Use textContent and jQuery to set label and title (elastic#16178) (el…

…astic#16199) * Use textContent to set tagcloud label * Use jquery to set disabled vis title
chrisronline · Jan 22, 2018 · 46ee1c3 · 46ee1c3
1 parent 311bf2a
commit 46ee1c3
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 3 deletions.
diff --git a/src/core_plugins/kibana/public/visualize/embeddable/visualize_embeddable_factory.js b/src/core_plugins/kibana/public/visualize/embeddable/visualize_embeddable_factory.js
@@ -1,3 +1,4 @@
+import $ from 'jquery';
 import { getVisualizeLoader } from 'ui/visualize/loader';
 
 import { UtilsBrushEventProvider as utilsBrushEventProvider } from 'ui/utils/brush_event';
@@ -33,7 +34,9 @@ export class VisualizeEmbeddableFactory extends EmbeddableFactory {
         const isLabsEnabled = this._config.get('visualize:enableLabs');
 
         if (!isLabsEnabled && savedObject.vis.type.stage === 'lab') {
-          domNode.innerHTML = labDisabledTemplate.replace('{{title}}', savedObject.title);
+          const template = $(labDisabledTemplate);
+          template.find('.disabledLabVisualization__title').text(savedObject.title);
+          $(domNode).html(template);
 
           return new Embeddable({
             title: savedObject.title

diff --git a/src/core_plugins/kibana/public/visualize/embeddable/visualize_lab_disabled.html b/src/core_plugins/kibana/public/visualize/embeddable/visualize_lab_disabled.html
@@ -1,5 +1,5 @@
 <div class="disabledLabVisualization">
   <div class="kuiVerticalRhythm disabledLabVisualization__icon kuiIcon fa-flask" aria-hidden="true"></div>
-  <div class="kuiVerticalRhythm"><em>{{title}}</em> is a lab visualization.</div>
+  <div class="kuiVerticalRhythm"><em class="disabledLabVisualization__title"></em> is a lab visualization.</div>
   <div class="kuiVerticalRhythm">Please turn on lab-mode in the advanced settings to see lab visualizations.</div>
 </div>
diff --git a/src/core_plugins/tagcloud/public/tag_cloud_controller.js b/src/core_plugins/tagcloud/public/tag_cloud_controller.js
@@ -28,7 +28,7 @@ module.controller('KbnTagCloudController', function ($scope, $element) {
     }
 
     const bucketName = containerNode.querySelector('.tagcloud-custom-label');
-    bucketName.innerHTML = `${$scope.vis.aggs[0].makeLabel()} - ${$scope.vis.aggs[1].makeLabel()}`;
+    bucketName.textContent = `${$scope.vis.aggs[0].makeLabel()} - ${$scope.vis.aggs[1].makeLabel()}`;
     truncatedMessage.style.display = truncated ? 'block' : 'none';
 
     const status = tagCloud.getStatus();