[polymer] Switches .appendChild() to Polymer.dom()...appendChild()

tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html

Index: tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html
diff --git a/tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html b/tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html
index aacabc4ccbcbe948d48d4e3728385aff508cd90c..6c18719f8cfda520b444ea42a6ae28f54c5dc565 100644
--- a/tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html
+++ b/tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view.html
@@ -130,12 +130,12 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           this, 'howToShowTiles',
           'layerView.howToShowTiles', 'none',
           createTileRectsSelectorBaseOptions());
-      this.controls_.appendChild(this.tileRectsSelector_);
+      Polymer.dom(this.controls_).appendChild(this.tileRectsSelector_);
 
       var tileHeatmapText = tr.ui.b.createSpan({
         textContent: 'Tile heatmap:'
       });
-      this.controls_.appendChild(tileHeatmapText);
+      Polymer.dom(this.controls_).appendChild(tileHeatmapText);
 
       var tileHeatmapSelector = tr.ui.b.createSelector(
           this, 'tileHeatmapType',
@@ -147,7 +147,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
            {label: 'Is using GPU memory',
             value: TILE_HEATMAP_TYPE.USING_GPU_MEMORY}
           ]);
-      this.controls_.appendChild(tileHeatmapSelector);
+      Polymer.dom(this.controls_).appendChild(tileHeatmapSelector);
 
       var showOtherLayersCheckbox = tr.ui.b.createCheckBox(
           this, 'showOtherLayers',
@@ -155,7 +155,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Other layers/passes');
       showOtherLayersCheckbox.title =
           'When checked, show all layers, selected or not.';
-      this.controls_.appendChild(showOtherLayersCheckbox);
+      Polymer.dom(this.controls_).appendChild(showOtherLayersCheckbox);
 
       var showInvalidationsCheckbox = tr.ui.b.createCheckBox(
           this, 'showInvalidations',
@@ -163,7 +163,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Invalidations');
       showInvalidationsCheckbox.title =
           'When checked, compositing invalidations are highlighted in red';
-      this.controls_.appendChild(showInvalidationsCheckbox);
+      Polymer.dom(this.controls_).appendChild(showInvalidationsCheckbox);
 
       var showUnrecordedRegionCheckbox = tr.ui.b.createCheckBox(
           this, 'showUnrecordedRegion',
@@ -171,7 +171,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Unrecorded area');
       showUnrecordedRegionCheckbox.title =
           'When checked, unrecorded areas are highlighted in yellow';
-      this.controls_.appendChild(showUnrecordedRegionCheckbox);
+      Polymer.dom(this.controls_).appendChild(showUnrecordedRegionCheckbox);
 
       var showBottlenecksCheckbox = tr.ui.b.createCheckBox(
           this, 'showBottlenecks',
@@ -179,7 +179,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Bottlenecks');
       showBottlenecksCheckbox.title =
           'When checked, scroll bottlenecks are highlighted';
-      this.controls_.appendChild(showBottlenecksCheckbox);
+      Polymer.dom(this.controls_).appendChild(showBottlenecksCheckbox);
 
       var showLayoutRectsCheckbox = tr.ui.b.createCheckBox(
           this, 'showLayoutRects',
@@ -187,7 +187,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Layout rects');
       showLayoutRectsCheckbox.title =
           'When checked, shows rects for regions where layout happened';
-      this.controls_.appendChild(showLayoutRectsCheckbox);
+      Polymer.dom(this.controls_).appendChild(showLayoutRectsCheckbox);
 
       var showContentsCheckbox = tr.ui.b.createCheckBox(
           this, 'showContents',
@@ -195,7 +195,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Contents');
       showContentsCheckbox.title =
           'When checked, show the rendered contents inside the layer outlines';
-      this.controls_.appendChild(showContentsCheckbox);
+      Polymer.dom(this.controls_).appendChild(showContentsCheckbox);
 
       var showAnimationBoundsCheckbox = tr.ui.b.createCheckBox(
           this, 'showAnimationBounds',
@@ -203,7 +203,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Animation Bounds');
       showAnimationBoundsCheckbox.title = 'When checked, show a border around' +
           ' a layer showing the extent of its animation.';
-      this.controls_.appendChild(showAnimationBoundsCheckbox);
+      Polymer.dom(this.controls_).appendChild(showAnimationBoundsCheckbox);
 
       var showInputEventsCheckbox = tr.ui.b.createCheckBox(
           this, 'showInputEvents',
@@ -211,7 +211,7 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
           'Input events');
       showInputEventsCheckbox.title = 'When checked, input events are ' +
           'displayed as circles.';
-      this.controls_.appendChild(showInputEventsCheckbox);
+      Polymer.dom(this.controls_).appendChild(showInputEventsCheckbox);
 
       this.whatRasterizedLink_ = document.createElement('a');
       this.whatRasterizedLink_.classList.add('what-rasterized');
@@ -1132,8 +1132,8 @@ tr.exportTo('tr.ui.e.chrome.cc', function() {
             var details = document.createElement('div');
             details.textContent = message.details;
 
-            overlay.appendChild(title);
-            overlay.appendChild(details);
+            Polymer.dom(overlay).appendChild(title);
+            Polymer.dom(overlay).appendChild(details);
           });
           overlay.visible = true;