Fix for heat map tooltips with angular ui bootstrap upgrade

Author: jeff-phillips-18

src/charts/heatmap/heatmap.directive.js

@@ -313,11 +313,11 @@ angular.module('patternfly.charts').directive('pfHeatmap', function ($compile, $
           return i % numberOfRows * blockSize;
         }).attr('width', fillSize).attr('height', fillSize).style('fill', function (d) {
           return color(d.value);
-        }).attr('tooltip-html-unsafe', function (d, i) { //tooltip-html is throwing an exception
+        }).attr('uib-tooltip-html', function (d, i) { //tooltip-html is throwing an exception
           if (scope.rangeOnHover && fillSize <= scope.rangeHoverSize) {
-            return rangeTooltip(d.value);
+            return '"' + rangeTooltip(d.value) + '"';
           }
-          return d.tooltip;
+          return "'" + d.tooltip + "'";
         }).attr('tooltip-append-to-body', function (d, i) {
           return true;
         }).attr('tooltip-animation', function (d, i) {

test/charts/heatmap/heatmap.spec.js

@@ -49,9 +49,9 @@ describe('Directive: pfHeatmap', function() {
     element = compileChart('<div pf-heatmap chart-title="title" data="data"></div>',$scope);
 
     block = angular.element(element).find('.heatmap-pf-svg').children().first();
-    tooltip = block.attr('tooltip-html-unsafe');
+    tooltip = block.attr('uib-tooltip-html');
 
-    expect(tooltip).toBe('Node 8 : My OpenShift Provider<br>96% : 96 Used of 100 Total<br>4 Available');
+    expect(tooltip).toBe("'Node 8 : My OpenShift Provider<br>96% : 96 Used of 100 Total<br>4 Available'");
 
     color = block.attr('style');
     var result = color.trim() == 'fill: #ce0000;' || color.trim() == 'fill: rgb(206, 0, 0);';