<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[214280] trunk/Websites/perf.webkit.org</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/214280">214280</a></dd>
<dt>Author</dt> <dd>rniwa@webkit.org</dd>
<dt>Date</dt> <dd>2017-03-22 15:50:57 -0700 (Wed, 22 Mar 2017)</dd>
</dl>

<h3>Log Message</h3>
<pre>ComponentBase should enqueue itself to render when it becomes connected
https://bugs.webkit.org/show_bug.cgi?id=169905

Reviewed by Antti Koivisto.

When a component becomes connected to a document, enqueue itself to render automatically.
Also added the support for boolean attribute to ComponentBase.createElement.

* ReadMe.md: Added an instruction to raise the upload limit per <a href="http://trac.webkit.org/projects/webkit/changeset/214065">r214065</a>.
* browser-tests/component-base-tests.js: Added tests for the new behavior and createElement. Also moved
the tests related to enqueueToRenderOnResize out of defineElement tests.

* browser-tests/index.html:
(BrowsingContext.prototype.constructor): Override requestAnimationFrame so that the callback would be
involved immediately durign testing.

* public/v3/components/base.js:
(ComponentBase): Enqueue itself to render during construction if custom elements is not available.
(ComponentBase.defineElement):
(ComponentBase.defineElement.elementClass.prototype.connectedCallback): Enqueue itself to render when
the component's element became connected.
(ComponentBase.createElement): Use Array.isArray instead of instanceof to make it work with arrays made
in other realms (global objects) during testing. Added the support for boolean attributes. Setting an
attribute value to true would set the attribute, and setting it to false would not set the attribute.
(ComponentBase.useNativeCustomElements): Added. True iff window.customElements is defined.

* public/v3/components/chart-pane-base.js:
(ChartPaneBase.prototype.render): No longer need to call enqueueToRender on the commit log viewer.

* public/v3/components/commit-log-viewer.js:
(CommitLogViewer.prototype.render): No longer need to call enqueueToRender on the spinner icon.

* public/v3/models/time-series.js:
(TimeSeries): Made this a proper class declaration now that we don't include data.js after <a href="http://trac.webkit.org/projects/webkit/changeset/213300">r213300</a>.

* public/v3/pages/chart-pane.js:
(ChartPane.prototype._renderActionToolbar): No longer need to call enqueueToRender on the close icon.

* public/v3/pages/summary-page.js:
(SummaryPage.prototype._renderCell): No longer need to call enqueueToRender on the spinner icon.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkWebsitesperfwebkitorgChangeLog">trunk/Websites/perf.webkit.org/ChangeLog</a></li>
<li><a href="#trunkWebsitesperfwebkitorgReadMemd">trunk/Websites/perf.webkit.org/ReadMe.md</a></li>
<li><a href="#trunkWebsitesperfwebkitorgbrowsertestscomponentbasetestsjs">trunk/Websites/perf.webkit.org/browser-tests/component-base-tests.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgbrowsertestsindexhtml">trunk/Websites/perf.webkit.org/browser-tests/index.html</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3componentsbasejs">trunk/Websites/perf.webkit.org/public/v3/components/base.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3componentschartpanebasejs">trunk/Websites/perf.webkit.org/public/v3/components/chart-pane-base.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3componentscommitlogviewerjs">trunk/Websites/perf.webkit.org/public/v3/components/commit-log-viewer.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3modelstimeseriesjs">trunk/Websites/perf.webkit.org/public/v3/models/time-series.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3pageschartpanejs">trunk/Websites/perf.webkit.org/public/v3/pages/chart-pane.js</a></li>
<li><a href="#trunkWebsitesperfwebkitorgpublicv3pagessummarypagejs">trunk/Websites/perf.webkit.org/public/v3/pages/summary-page.js</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkWebsitesperfwebkitorgChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/ChangeLog (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/ChangeLog        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/ChangeLog        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -1,3 +1,46 @@
</span><ins>+2017-03-22  Ryosuke Niwa  &lt;rniwa@webkit.org&gt;
+
+        ComponentBase should enqueue itself to render when it becomes connected
+        https://bugs.webkit.org/show_bug.cgi?id=169905
+
+        Reviewed by Antti Koivisto.
+
+        When a component becomes connected to a document, enqueue itself to render automatically.
+        Also added the support for boolean attribute to ComponentBase.createElement.
+
+        * ReadMe.md: Added an instruction to raise the upload limit per r214065.
+        * browser-tests/component-base-tests.js: Added tests for the new behavior and createElement. Also moved
+        the tests related to enqueueToRenderOnResize out of defineElement tests.
+
+        * browser-tests/index.html:
+        (BrowsingContext.prototype.constructor): Override requestAnimationFrame so that the callback would be
+        involved immediately durign testing.
+
+        * public/v3/components/base.js:
+        (ComponentBase): Enqueue itself to render during construction if custom elements is not available.
+        (ComponentBase.defineElement):
+        (ComponentBase.defineElement.elementClass.prototype.connectedCallback): Enqueue itself to render when
+        the component's element became connected.
+        (ComponentBase.createElement): Use Array.isArray instead of instanceof to make it work with arrays made
+        in other realms (global objects) during testing. Added the support for boolean attributes. Setting an
+        attribute value to true would set the attribute, and setting it to false would not set the attribute.
+        (ComponentBase.useNativeCustomElements): Added. True iff window.customElements is defined.
+
+        * public/v3/components/chart-pane-base.js:
+        (ChartPaneBase.prototype.render): No longer need to call enqueueToRender on the commit log viewer.
+
+        * public/v3/components/commit-log-viewer.js:
+        (CommitLogViewer.prototype.render): No longer need to call enqueueToRender on the spinner icon.
+
+        * public/v3/models/time-series.js:
+        (TimeSeries): Made this a proper class declaration now that we don't include data.js after r213300.
+
+        * public/v3/pages/chart-pane.js:
+        (ChartPane.prototype._renderActionToolbar): No longer need to call enqueueToRender on the close icon.
+
+        * public/v3/pages/summary-page.js:
+        (SummaryPage.prototype._renderCell): No longer need to call enqueueToRender on the spinner icon.
+
</ins><span class="cx"> 2017-03-20  Ryosuke Niwa  &lt;rniwa@webkit.org&gt;
</span><span class="cx"> 
</span><span class="cx">         Delete another function that was supposed to be removed in the previous commit.
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgReadMemd"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/ReadMe.md (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/ReadMe.md        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/ReadMe.md        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -84,6 +84,13 @@
</span><span class="cx">         Options Indexes MultiViews
</span><span class="cx">         php_flag zlib.output_compression on
</span><span class="cx"> 
</span><ins>+ 4. Increase the maximum upload size as needed for accepting custom roots:
+
+        &lt;IfModule php5_module&gt;
+        php_value upload_max_filesize 100M
+        php_value post_max_size 100M
+        &lt;/IfModule&gt;
+
</ins><span class="cx"> ### Protecting the Administrative Pages to Prevent Execution of Arbitrary Code
</span><span class="cx"> 
</span><span class="cx"> By default, the application gives the administrative privilege to everyone. Anyone can add, remove, or edit tests,
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgbrowsertestscomponentbasetestsjs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/browser-tests/component-base-tests.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/browser-tests/component-base-tests.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/browser-tests/component-base-tests.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -18,6 +18,78 @@
</span><span class="cx">         });
</span><span class="cx">     }
</span><span class="cx"> 
</span><ins>+    it('must enqueue a connected component to render', () =&gt; {
+        const context = new BrowsingContext();
+        return context.importScripts(['instrumentation.js', 'components/base.js'], 'ComponentBase').then((ComponentBase) =&gt; {
+            let renderCall = 0;
+            class SomeComponent extends ComponentBase {
+                render() { renderCall++; }
+            }
+            ComponentBase.defineElement('some-component', SomeComponent);
+
+            let requestAnimationFrameCount = 0;
+            let callback = null;
+            context.global.requestAnimationFrame = (newCallback) =&gt; {
+                callback = newCallback;
+                requestAnimationFrameCount++;
+            }
+
+            expect(requestAnimationFrameCount).to.be(0);
+            const instance = new SomeComponent;
+            context.document.body.appendChild(instance.element());
+            expect(requestAnimationFrameCount).to.be(1);
+            callback();
+            expect(renderCall).to.be(1);
+            expect(requestAnimationFrameCount).to.be(1);
+        });
+    });
+
+    it('must enqueue a connected component to render upon a resize event if enqueueToRenderOnResize is true', () =&gt; {
+        const context = new BrowsingContext();
+        return context.importScripts(['instrumentation.js', 'components/base.js'], 'ComponentBase').then((ComponentBase) =&gt; {
+            class SomeComponent extends ComponentBase {
+                static get enqueueToRenderOnResize() { return true; }
+            }
+            ComponentBase.defineElement('some-component', SomeComponent);
+
+            let requestAnimationFrameCount = 0;
+            let callback = null;
+            context.global.requestAnimationFrame = (newCallback) =&gt; {
+                callback = newCallback;
+                requestAnimationFrameCount++;
+            }
+
+            expect(requestAnimationFrameCount).to.be(0);
+            const instance = new SomeComponent;
+            context.global.dispatchEvent(new Event('resize'));
+            context.document.body.appendChild(instance.element());
+            context.global.dispatchEvent(new Event('resize'));
+            expect(requestAnimationFrameCount).to.be(1);
+        });
+    });
+
+    it('must not enqueue a disconnected component to render upon a resize event if enqueueToRenderOnResize is true', () =&gt; {
+        const context = new BrowsingContext();
+        return context.importScripts(['instrumentation.js', 'components/base.js'], 'ComponentBase').then((ComponentBase) =&gt; {
+            class SomeComponent extends ComponentBase {
+                static get enqueueToRenderOnResize() { return true; }
+            }
+            ComponentBase.defineElement('some-component', SomeComponent);
+
+            let requestAnimationFrameCount = 0;
+            let callback = null;
+            context.global.requestAnimationFrame = (newCallback) =&gt; {
+                callback = newCallback;
+                requestAnimationFrameCount++;
+            }
+
+            const instance = new SomeComponent;
+            expect(requestAnimationFrameCount).to.be(0);
+            context.global.dispatchEvent(new Event('resize'));
+            expect(requestAnimationFrameCount).to.be(0);
+        });
+    });
+
</ins><span class="cx">     describe('constructor', () =&gt; {
</span><span class="cx">         it('is a function', () =&gt; {
</span><span class="cx">             return new BrowsingContext().importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
</span><span class="lines">@@ -406,6 +478,121 @@
</span><span class="cx">         });
</span><span class="cx">     });
</span><span class="cx"> 
</span><ins>+    describe('createElement()', () =&gt; {
+
+        it('should create an element of the specified name', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const div = ComponentBase.createElement('div');
+                expect(div).to.be.a(context.global.HTMLDivElement);
+            });
+        });
+
+        it('should create an element with the specified attributes', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const input = ComponentBase.createElement('input', {'title': 'hi', 'id': 'foo', 'required': false, 'checked': true});
+                expect(input).to.be.a(context.global.HTMLInputElement);
+                expect(input.attributes.length).to.be(3);
+                expect(input.attributes[0].localName).to.be('title');
+                expect(input.attributes[0].value).to.be('hi');
+                expect(input.attributes[1].localName).to.be('id');
+                expect(input.attributes[1].value).to.be('foo');
+                expect(input.attributes[2].localName).to.be('checked');
+                expect(input.attributes[2].value).to.be('checked');
+            });
+        });
+
+        it('should create an element with the specified event handlers and attributes', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                let clickCount = 0;
+                const div = ComponentBase.createElement('div', {'title': 'hi', 'onclick': () =&gt; clickCount++});
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(1);
+                expect(div.attributes[0].localName).to.be('title');
+                expect(div.attributes[0].value).to.be('hi');
+                expect(clickCount).to.be(0);
+                div.click();
+                expect(clickCount).to.be(1);
+            });
+        });
+
+        it('should create an element with the specified children when there is no attribute specified', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const element = ComponentBase.createElement;
+                const span = element('span');
+                const div = element('div', [span, 'hi']);
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(0);
+                expect(div.childNodes.length).to.be(2);
+                expect(div.childNodes[0]).to.be(span);
+                expect(div.childNodes[1]).to.be.a(context.global.Text);
+                expect(div.childNodes[1].data).to.be('hi');
+            });
+        });
+
+        it('should create an element with the specified children when the second argument is a span', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const element = ComponentBase.createElement;
+                const span = element('span');
+                const div = element('div', span);
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(0);
+                expect(div.childNodes.length).to.be(1);
+                expect(div.childNodes[0]).to.be(span);
+            });
+        });
+
+        it('should create an element with the specified children when the second argument is a Text node', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const element = ComponentBase.createElement;
+                const text = context.document.createTextNode('hi');
+                const div = element('div', text);
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(0);
+                expect(div.childNodes.length).to.be(1);
+                expect(div.childNodes[0]).to.be(text);
+            });
+        });
+
+        it('should create an element with the specified children when the second argument is a component', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                class SomeComponent extends ComponentBase { };
+                ComponentBase.defineElement('some-component', SomeComponent);
+                const element = ComponentBase.createElement;
+                const component = new SomeComponent;
+                const div = element('div', component);
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(0);
+                expect(div.childNodes.length).to.be(1);
+                expect(div.childNodes[0]).to.be(component.element());
+            });
+        });
+
+        it('should create an element with the specified attributes and children', () =&gt; {
+            const context = new BrowsingContext();
+            return context.importScript('components/base.js', 'ComponentBase').then((ComponentBase) =&gt; {
+                const element = ComponentBase.createElement;
+                const span = element('span');
+                const div = element('div', {'lang': 'en'}, [span, 'hi']);
+                expect(div).to.be.a(context.global.HTMLDivElement);
+                expect(div.attributes.length).to.be(1);
+                expect(div.attributes[0].localName).to.be('lang');
+                expect(div.attributes[0].value).to.be('en');
+                expect(div.childNodes.length).to.be(2);
+                expect(div.childNodes[0]).to.be(span);
+                expect(div.childNodes[1]).to.be.a(context.global.Text);
+                expect(div.childNodes[1].data).to.be('hi');
+            });
+        });
+
+    });
+
</ins><span class="cx">     describe('defineElement()', () =&gt; {
</span><span class="cx"> 
</span><span class="cx">         it('must define a custom element with a class of an appropriate name', () =&gt; {
</span><span class="lines">@@ -466,52 +653,6 @@
</span><span class="cx">             });
</span><span class="cx">         });
</span><span class="cx"> 
</span><del>-        it('must enqueue a connected component to render upon a resize event if enqueueToRenderOnResize is true', () =&gt; {
-            const context = new BrowsingContext();
-            return context.importScripts(['instrumentation.js', 'components/base.js'], 'ComponentBase').then((ComponentBase) =&gt; {
-                class SomeComponent extends ComponentBase {
-                    static get enqueueToRenderOnResize() { return true; }
-                }
-                ComponentBase.defineElement('some-component', SomeComponent);
-
-                let requestAnimationFrameCount = 0;
-                let callback = null;
-                context.global.requestAnimationFrame = (newCallback) =&gt; {
-                    callback = newCallback;
-                    requestAnimationFrameCount++;
-                }
-
-                expect(requestAnimationFrameCount).to.be(0);
-                const instance = new SomeComponent;
-                context.global.dispatchEvent(new Event('resize'));
-                context.document.body.appendChild(instance.element());
-                context.global.dispatchEvent(new Event('resize'));
-                expect(requestAnimationFrameCount).to.be(1);
-            });
-        });
-
-        it('must not enqueue a disconnected component to render upon a resize event if enqueueToRenderOnResize is true', () =&gt; {
-            const context = new BrowsingContext();
-            return context.importScripts(['instrumentation.js', 'components/base.js'], 'ComponentBase').then((ComponentBase) =&gt; {
-                class SomeComponent extends ComponentBase {
-                    static get enqueueToRenderOnResize() { return true; }
-                }
-                ComponentBase.defineElement('some-component', SomeComponent);
-
-                let requestAnimationFrameCount = 0;
-                let callback = null;
-                context.global.requestAnimationFrame = (newCallback) =&gt; {
-                    callback = newCallback;
-                    requestAnimationFrameCount++;
-                }
-
-                const instance = new SomeComponent;
-                expect(requestAnimationFrameCount).to.be(0);
-                context.global.dispatchEvent(new Event('resize'));
-                expect(requestAnimationFrameCount).to.be(0);
-            });
-        });
-
</del><span class="cx">     });
</span><span class="cx"> 
</span><span class="cx"> });
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgbrowsertestsindexhtml"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/browser-tests/index.html (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/browser-tests/index.html        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/browser-tests/index.html        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -40,6 +40,9 @@
</span><span class="cx">         iframe.style.top = '0px';
</span><span class="cx">         BrowsingContext._iframes.push(iframe);
</span><span class="cx"> 
</span><ins>+        // Expedite calls to callbacks to make tests go faster.
+        iframe.contentWindow.requestAnimationFrame = (callback) =&gt; setTimeout(callback, 0);
+
</ins><span class="cx">         this.iframe = iframe;
</span><span class="cx">         this.symbols = {};
</span><span class="cx">         this.global = this.iframe.contentWindow;
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3componentsbasejs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/components/base.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/components/base.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/components/base.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -17,7 +17,9 @@
</span><span class="cx">         this._shadow = null;
</span><span class="cx">         this._actionCallbacks = new Map;
</span><span class="cx"> 
</span><del>-        if (!window.customElements &amp;&amp; new.target.enqueueToRenderOnResize)
</del><ins>+        if (!ComponentBase.useNativeCustomElements)
+            this.enqueueToRender();
+        if (!ComponentBase.useNativeCustomElements &amp;&amp; new.target.enqueueToRenderOnResize)
</ins><span class="cx">             ComponentBase._connectedComponentToRenderOnResize(this);
</span><span class="cx">     }
</span><span class="cx"> 
</span><span class="lines">@@ -174,7 +176,7 @@
</span><span class="cx"> 
</span><span class="cx">         const enqueueToRenderOnResize = elementInterface.enqueueToRenderOnResize;
</span><span class="cx"> 
</span><del>-        if (!window.customElements)
</del><ins>+        if (!ComponentBase.useNativeCustomElements)
</ins><span class="cx">             return;
</span><span class="cx"> 
</span><span class="cx">         class elementClass extends HTMLElement {
</span><span class="lines">@@ -194,6 +196,7 @@
</span><span class="cx"> 
</span><span class="cx">             connectedCallback()
</span><span class="cx">             {
</span><ins>+                this.component().enqueueToRender();
</ins><span class="cx">                 if (enqueueToRenderOnResize)
</span><span class="cx">                     ComponentBase._connectedComponentToRenderOnResize(this.component());
</span><span class="cx">             }
</span><span class="lines">@@ -215,7 +218,7 @@
</span><span class="cx">     static createElement(name, attributes, content)
</span><span class="cx">     {
</span><span class="cx">         var element = document.createElement(name);
</span><del>-        if (!content &amp;&amp; (attributes instanceof Array || attributes instanceof Node
</del><ins>+        if (!content &amp;&amp; (Array.isArray(attributes) || attributes instanceof Node
</ins><span class="cx">             || attributes instanceof ComponentBase || typeof(attributes) != 'object')) {
</span><span class="cx">             content = attributes;
</span><span class="cx">             attributes = {};
</span><span class="lines">@@ -222,10 +225,12 @@
</span><span class="cx">         }
</span><span class="cx"> 
</span><span class="cx">         if (attributes) {
</span><del>-            for (var name in attributes) {
</del><ins>+            for (let name in attributes) {
</ins><span class="cx">                 if (name.startsWith('on'))
</span><span class="cx">                     element.addEventListener(name.substring(2), attributes[name]);
</span><del>-                else
</del><ins>+                else if (attributes[name] === true)
+                    element.setAttribute(name, name);
+                else if (attributes[name] !== false)
</ins><span class="cx">                     element.setAttribute(name, attributes[name]);
</span><span class="cx">             }
</span><span class="cx">         }
</span><span class="lines">@@ -283,6 +288,7 @@
</span><span class="cx">     }
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+ComponentBase.useNativeCustomElements = !!window.customElements;
</ins><span class="cx"> ComponentBase._componentByName = new Map;
</span><span class="cx"> ComponentBase._componentByClass = new Map;
</span><span class="cx"> ComponentBase._currentlyConstructedByInterface = new Map;
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3componentschartpanebasejs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/components/chart-pane-base.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/components/chart-pane-base.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/components/chart-pane-base.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -256,10 +256,9 @@
</span><span class="cx">             this._mainChartStatus.enqueueToRender();
</span><span class="cx"> 
</span><span class="cx">         var body = this.content().querySelector('.chart-pane-body');
</span><del>-        if (this._openRepository) {
</del><ins>+        if (this._openRepository)
</ins><span class="cx">             body.classList.add('has-second-sidebar');
</span><del>-            this._commitLogViewer.enqueueToRender();
-        } else
</del><ins>+        else
</ins><span class="cx">             body.classList.remove('has-second-sidebar');
</span><span class="cx"> 
</span><span class="cx">         Instrumentation.endMeasuringTime('ChartPane', 'render');
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3componentscommitlogviewerjs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/components/commit-log-viewer.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/components/commit-log-viewer.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/components/commit-log-viewer.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -55,8 +55,6 @@
</span><span class="cx"> 
</span><span class="cx">     render()
</span><span class="cx">     {
</span><del>-        this.part('spinner').enqueueToRender();
-
</del><span class="cx">         const shouldShowRepositoryName = this._repository &amp;&amp; (this._commits || this._fetchingPromise);
</span><span class="cx">         this.content('repository-name').textContent = shouldShowRepositoryName ? this._repository.name() : '';
</span><span class="cx">         this.content('spinner-container').style.display = this._fetchingPromise ? null : 'none';
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3modelstimeseriesjs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/models/time-series.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/models/time-series.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/models/time-series.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -1,8 +1,6 @@
</span><span class="cx"> 'use strict';
</span><span class="cx"> 
</span><del>-// v3 UI still relies on RunsData for associating metrics with units.
-// Use declartive syntax once that dependency has been removed.
-var TimeSeries = class {
</del><ins>+class TimeSeries {
</ins><span class="cx">     constructor()
</span><span class="cx">     {
</span><span class="cx">         this._data = [];
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3pageschartpanejs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/pages/chart-pane.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/pages/chart-pane.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/pages/chart-pane.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -247,8 +247,6 @@
</span><span class="cx">         var link = ComponentBase.createLink;
</span><span class="cx">         var self = this;
</span><span class="cx"> 
</span><del>-        this.part('close').enqueueToRender();
-
</del><span class="cx">         if (this._chartsPage.canBreakdown(platform, metric)) {
</span><span class="cx">             actions.push(element('li', link('Breakdown', function () {
</span><span class="cx">                 self._chartsPage.insertBreakdownPanesAfter(platform, metric, self);
</span></span></pre></div>
<a id="trunkWebsitesperfwebkitorgpublicv3pagessummarypagejs"></a>
<div class="modfile"><h4>Modified: trunk/Websites/perf.webkit.org/public/v3/pages/summary-page.js (214279 => 214280)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Websites/perf.webkit.org/public/v3/pages/summary-page.js        2017-03-22 22:25:09 UTC (rev 214279)
+++ trunk/Websites/perf.webkit.org/public/v3/pages/summary-page.js        2017-03-22 22:50:57 UTC (rev 214280)
</span><span class="lines">@@ -121,8 +121,6 @@
</span><span class="cx"> 
</span><span class="cx">     _renderCell(cell, spinner, anchor, ratioGraph, configurationGroup)
</span><span class="cx">     {
</span><del>-        spinner.enqueueToRender();
-
</del><span class="cx">         if (configurationGroup.isFetching())
</span><span class="cx">             cell.classList.add('fetching');
</span><span class="cx">         else
</span></span></pre>
</div>
</div>

</body>
</html>