Chromium Code Reviews Chromium Code Reviews
Issue 1926143002:
[polymer] Makes ContainerThatDecoratesItsChildren use HTMLDivElement (Closed)
Base URL: git@github.com:catapult-project/catapult.git@polymer10-migration| OLD | NEW |
|---|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- | 2 <!-- |
| 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. |
| 4 Use of this source code is governed by a BSD-style license that can be | 4 Use of this source code is governed by a BSD-style license that can be |
| 5 found in the LICENSE file. | 5 found in the LICENSE file. |
| 6 --> | 6 --> |
| 7 | 7 |
| 8 <link rel="import" href="/tracing/base/event.html"> | 8 <link rel="import" href="/tracing/base/event.html"> |
| 9 <link rel="import" href="/tracing/ui/base/ui.html"> | 9 <link rel="import" href="/tracing/ui/base/ui.html"> |
| 10 | 10 |
| 11 <script> | 11 <script> |
| 12 'use strict'; | 12 'use strict'; |
| 13 | 13 |
| 14 /** | 14 /** |
| 15 * @fileoverview Container that decorates its children. | 15 * @fileoverview Container that decorates its children. |
| 16 */ | 16 */ |
| 17 tr.exportTo('tr.ui.b', function() { | 17 tr.exportTo('tr.ui.b', function() { |
| 18 /** | 18 /** |
| 19 * @constructor | 19 * @constructor |
| 20 */ | 20 */ |
| 21 var ContainerThatDecoratesItsChildren = tr.ui.b.define('div'); | 21 var ContainerThatDecoratesItsChildren = tr.ui.b.define('div'); |
| 22 | 22 |
| 23 ContainerThatDecoratesItsChildren.prototype = { | 23 ContainerThatDecoratesItsChildren.prototype = { |
| 24 __proto__: HTMLUnknownElement.prototype, | 24 __proto__: HTMLDivElement.prototype, |
| 25 | 25 |
| 26 decorate: function() { | 26 decorate: function() { |
| 27 this.observer_ = new WebKitMutationObserver(this.didMutate_.bind(this)); | 27 this.observer_ = new WebKitMutationObserver(this.didMutate_.bind(this)); |
| 28 this.observer_.observe(this, { childList: true }); | 28 this.observer_.observe(this, { childList: true }); |
| 29 | 29 |
| 30 // textContent is a variable on regular HTMLElements. However, we want to | 30 // textContent is a variable on regular HTMLElements. However, we want to |
| 31 // hook and prevent writes to it. | 31 // hook and prevent writes to it. |
| 32 Object.defineProperty( | 32 Object.defineProperty( |
| 33 this, 'textContent', | 33 this, 'textContent', |
| 34 { get: undefined, set: this.onSetTextContent_}); | 34 { get: undefined, set: this.onSetTextContent_}); |
| 35 }, | 35 }, |
| 36 | 36 |
| 37 // TODO(polymer): Do we need to use Polymer.dom on these functions? | |
| 38 appendChild: function(x) { | 37 appendChild: function(x) { |
| 39 Polymer.dom(HTMLUnknownElement.prototype).appendChild.call(this, x); | 38 HTMLDivElement.prototype.appendChild.call(this, x); |
|
charliea (OOO until 10-5)
2016/04/28 18:02:15
I don't think that we need to wrap this in Polymer
aiolos (Not reviewing)
2016/04/28 18:03:42
That seems likely
| |
| 40 this.didMutate_(this.observer_.takeRecords()); | 39 this.didMutate_(this.observer_.takeRecords()); |
| 41 }, | 40 }, |
| 42 | 41 |
| 43 insertBefore: function(x, y) { | 42 insertBefore: function(x, y) { |
| 44 HTMLUnknownElement.prototype.insertBefore.call(this, x, y); | 43 HTMLDivElement.prototype.insertBefore.call(this, x, y); |
| 45 this.didMutate_(this.observer_.takeRecords()); | 44 this.didMutate_(this.observer_.takeRecords()); |
| 46 }, | 45 }, |
| 47 | 46 |
| 48 removeChild: function(x) { | 47 removeChild: function(x) { |
| 49 HTMLUnknownElement.prototype.removeChild.call(this, x); | 48 HTMLDivElement.prototype.removeChild.call(this, x); |
| 50 this.didMutate_(this.observer_.takeRecords()); | 49 this.didMutate_(this.observer_.takeRecords()); |
| 51 }, | 50 }, |
| 52 | 51 |
| 53 replaceChild: function(x, y) { | 52 replaceChild: function(x, y) { |
| 54 HTMLUnknownElement.prototype.replaceChild.call(this, x, y); | 53 HTMLDivElement.prototype.replaceChild.call(this, x, y); |
| 55 this.didMutate_(this.observer_.takeRecords()); | 54 this.didMutate_(this.observer_.takeRecords()); |
| 56 }, | 55 }, |
| 57 | 56 |
| 58 onSetTextContent_: function(textContent) { | 57 onSetTextContent_: function(textContent) { |
| 59 if (textContent != '') | 58 if (textContent != '') |
| 60 throw new Error('textContent can only be set to \'\'.'); | 59 throw new Error('textContent can only be set to \'\'.'); |
| 61 this.clear(); | 60 this.clear(); |
| 62 }, | 61 }, |
| 63 | 62 |
| 64 clear: function() { | 63 clear: function() { |
| 65 while (this.lastChild) | 64 while (this.lastChild) |
| 66 HTMLUnknownElement.prototype.removeChild.call(this, this.lastChild); | 65 HTMLDivElement.prototype.removeChild.call(this, this.lastChild); |
| 67 this.didMutate_(this.observer_.takeRecords()); | 66 this.didMutate_(this.observer_.takeRecords()); |
| 68 }, | 67 }, |
| 69 | 68 |
| 70 didMutate_: function(records) { | 69 didMutate_: function(records) { |
| 71 this.beginDecorating_(); | 70 this.beginDecorating_(); |
| 72 for (var i = 0; i < records.length; i++) { | 71 for (var i = 0; i < records.length; i++) { |
| 73 var addedNodes = records[i].addedNodes; | 72 var addedNodes = records[i].addedNodes; |
| 74 if (addedNodes) { | 73 if (addedNodes) { |
| 75 for (var j = 0; j < addedNodes.length; j++) | 74 for (var j = 0; j < addedNodes.length; j++) |
| 76 this.decorateChild_(addedNodes[j]); | 75 this.decorateChild_(addedNodes[j]); |
| (...skipping 22 matching lines...) Expand all Loading... | |
| 99 doneDecoratingForNow_: function() { | 98 doneDecoratingForNow_: function() { |
| 100 } | 99 } |
| 101 }; | 100 }; |
| 102 | 101 |
| 103 return { | 102 return { |
| 104 ContainerThatDecoratesItsChildren: ContainerThatDecoratesItsChildren | 103 ContainerThatDecoratesItsChildren: ContainerThatDecoratesItsChildren |
| 105 }; | 104 }; |
| 106 | 105 |
| 107 }); | 106 }); |
| 108 </script> | 107 </script> |
| OLD | NEW |
