- Revision
- 115133
- Author
- [email protected]
- Date
- 2012-04-24 16:43:13 -0700 (Tue, 24 Apr 2012)
Log Message
Improve code for embedding flakiness dashboard as an iframe
https://bugs.webkit.org/show_bug.cgi?id=84782
Reviewed by Dirk Pranke.
-Include the horizontal scrollbar height in the measured height of the page.
-Post a message everytime the height changes instead of in response to a queryContentHeight message.
This way, the embedder doesn't need to poll.
No new tests. This is hard to test because it involves postMessage and iframes.
Once we switch the dashboard tests over to qunit, we should be able to write an
asyncTest for this.
* TestResultServer/static-dashboards/flakiness_dashboard.js:
(generatePage):
(appendHTML):
(appendExpectations):
(postHeightChangedMessage):
(generatePageForIndividualTests.if):
(generatePageForIndividualTests):
* TestResultServer/static-dashboards/flakiness_dashboard_embedded.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/Tools/ChangeLog (115132 => 115133)
--- trunk/Tools/ChangeLog 2012-04-24 23:41:32 UTC (rev 115132)
+++ trunk/Tools/ChangeLog 2012-04-24 23:43:13 UTC (rev 115133)
@@ -1,3 +1,27 @@
+2012-04-24 Ojan Vafai <[email protected]>
+
+ Improve code for embedding flakiness dashboard as an iframe
+ https://bugs.webkit.org/show_bug.cgi?id=84782
+
+ Reviewed by Dirk Pranke.
+
+ -Include the horizontal scrollbar height in the measured height of the page.
+ -Post a message everytime the height changes instead of in response to a queryContentHeight message.
+ This way, the embedder doesn't need to poll.
+
+ No new tests. This is hard to test because it involves postMessage and iframes.
+ Once we switch the dashboard tests over to qunit, we should be able to write an
+ asyncTest for this.
+
+ * TestResultServer/static-dashboards/flakiness_dashboard.js:
+ (generatePage):
+ (appendHTML):
+ (appendExpectations):
+ (postHeightChangedMessage):
+ (generatePageForIndividualTests.if):
+ (generatePageForIndividualTests):
+ * TestResultServer/static-dashboards/flakiness_dashboard_embedded.html: Added.
+
2012-04-16 Ojan Vafai <[email protected]>
Replace garden-o-matic accordion UI with a panel UI
Modified: trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard.js (115132 => 115133)
--- trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard.js 2012-04-24 23:41:32 UTC (rev 115132)
+++ trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard.js 2012-04-24 23:43:13 UTC (rev 115133)
@@ -95,6 +95,8 @@
for (var builder in g_builders)
processTestResultsForBuilderAsync(builder);
+
+ postHeightChangedMessage();
}
function handleValidHashParameter(key, value)
@@ -1244,6 +1246,7 @@
div.innerHTML = html;
document.body.appendChild(div);
logTime('Time to innerHTML', startTime);
+ postHeightChangedMessage();
}
function alphanumericCompare(column, reverse)
@@ -2090,6 +2093,8 @@
performChunkedAction(expectations, function(chunk) {
for (var i = 0, len = chunk.length; i < len; i++)
loadExpectations(chunk[i]);
+ postHeightChangedMessage();
+
}, hideLoadingUI, 10000);
}
@@ -2098,6 +2103,7 @@
var loadingDiv = $('loading-ui');
if (loadingDiv)
loadingDiv.style.display = 'none';
+ postHeightChangedMessage();
}
function generatePageForIndividualTests(tests)
@@ -2320,21 +2326,24 @@
minTime + ' seconds == SLOW</li></ul>';
}
-window.addEventListener('message', function(event) {
- try {
- var parsedData = JSON.parse(event.data);
- } catch (error) {
- console.log('Could not parse postMessage as JSON: ' + event.data);
+function postHeightChangedMessage()
+{
+ if (window == parent)
return;
- }
- if (parsedData.command == 'queryContentHeight') {
- var response = {height: document.documentElement.offsetHeight};
- event.source.postMessage(JSON.stringify(response), '*');
- return;
+ var root = document.documentElement;
+ var height = root.offsetHeight;
+ if (root.offsetWidth < root.scrollWidth) {
+ // We have a horizontal scrollbar. Include it in the height.
+ var dummyNode = document.createElement('div');
+ dummyNode.style.overflow = 'scroll';
+ document.body.appendChild(dummyNode);
+ var scrollbarWidth = dummyNode.offsetHeight - dummyNode.clientHeight;
+ document.body.removeChild(dummyNode);
+ height += scrollbarWidth;
}
- console.log('Unknown postMessage query: ' + event.data);
-});
+ parent.postMessage({command: 'heightChanged', height: height}, '*')
+}
document.addEventListener('keydown', function(e) {
if (e.keyIdentifier == 'U+003F' || e.keyIdentifier == 'U+00BF') {
Added: trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard_embedded.html (0 => 115133)
--- trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard_embedded.html (rev 0)
+++ trunk/Tools/TestResultServer/static-dashboards/flakiness_dashboard_embedded.html 2012-04-24 23:43:13 UTC (rev 115133)
@@ -0,0 +1,83 @@
+<!-- Copyright (C) 2011 Google Inc. All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+ * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+ * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+-->
+<!DOCTYPE HTML>
+<style>
+iframe {
+ width: 100%;
+ display: block;
+}
+#toolbar {
+ display: -webkit-flexbox;
+ -webkit-flex-align: baseline;
+}
+#tests {
+ -webkit-flex: 1;
+ /* WebKit bug. Don't properly wrap input elements for flexing. */
+ display: block;
+}
+</style>
+
+<div>This is a demo page for working on iframe embedding the flakiness dashboard.</div>
+<div id="toolbar">
+ <input id="chrome" type=checkbox></input><label>Hide chrome</label> |
+ <label>Tests:</label><input id=tests placeholder="Type test name here to load a different test in the frame" ></input>
+</div>
+<iframe src=""
+
+<script>
+var timeoutId;
+document.querySelector('#tests')._oninput_ = function(event) {
+ if (timeoutId)
+ clearTimeout(timeoutId);
+ timeoutId = setTimeout(setFrameSrc, 1000);
+};
+document.querySelector('#chrome')._onchange_ = setFrameSrc;
+
+function setFrameSrc() {
+ var tests = document.querySelector('#tests').value;
+ var hideChrome = document.querySelector('#chrome').checked ? '&showChrome=false' : '';
+ var url = '' + tests + hideChrome;
+ document.querySelector('iframe').src = ""
+};
+
+function sizeIframeToContents() {
+ document.querySelector('iframe').contentWindow.postMessage({command: 'queryContentHeight'}, '*');
+};
+
+window.addEventListener('message', function(event) {
+ switch(event.data.command) {
+ case 'heightChanged':
+ document.querySelector('iframe').style.height = event.data.height + 'px';
+ break;
+
+ default:
+ console.error('Did not understand message: ' + event.data);
+ }
+});
+</script>
