Changeset 112423 in webkit

Timestamp:

Mar 28, 2012 12:19:36 PM (12 years ago)

Author:

ojan@chromium.org

Message:

Add history navigation to garden-o-matic
​https://bugs.webkit.org/show_bug.cgi?id=82495

Reviewed by Dimitri Glazkov.

Also, maintain scroll offsets when returning to a tab. This makes addressing
expected failures considerably easier when dealing with below-the-fold tests.

• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui.js:

-Store the scrollTop before switching to a new tab and restore the appropriate scrollTop after
switching.
-Modify window.location with the tabName in the hash. Can't use pushState because this is served
from a file URL and Chrome puts each different file URL in it's own origin.

• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js:

Remove the href so that clicking on the accordion item does not modify window.location.hash.

• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js:
• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/results.css:

Location:

trunk/Tools

Files:

• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui.js (modified) (2 diffs)
• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js (modified) (1 diff)
• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js (modified) (1 diff)
• BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/results.css (modified) (1 diff)
• ChangeLog (modified) (1 diff)

trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui.js

@@ -76 +76 @@
             'results',
         ]
+        this._tabIndexToSavedScrollOffset = {};
         this._tabs = $(this).tabs({
             disabled: [2],
+            show: function(event, ui) { this._restoreScrollOffset(ui.index); },
         });
     },
+    _saveScrollOffset: function() {
+        var tabIndex = this._tabs.tabs('option', 'selected');
+        this._tabIndexToSavedScrollOffset[tabIndex] = document.body.scrollTop;
+    },
+    _restoreScrollOffset: function(tabIndex)
+    {
+        document.body.scrollTop = this._tabIndexToSavedScrollOffset[tabIndex] || 0;
+    },
+    _setupHistoryHandlers: function()
+    {
+        function currentHash() {
+            var hash = window.location.hash;
+            return (!hash || hash == '#') ? '#unexpected' : hash;
+        }
+
+        var self = this;
+        $('.ui-tabs-nav a').bind('mouseup', function(event) {
+            var href = event.target.getAttribute('href');
+            var hash = currentHash();
+            if (href != hash) {
+                self._saveScrollOffset();
+                window.location = href
+            }
+        });
+
+        window.onhashchange = function(event) {
+            var tabName = currentHash().substring(1);
+            self._selectInternal(tabName);
+        };
+
+        // When navigating from the browser chrome, we'll
+        // scroll to the #tabname contents. popstate fires before
+        // we scroll, so we can save the scroll offset first.
+        window.onpopstate = function() {
+            self._saveScrollOffset();
+        };
+    },
     attach: function()
     {
         document.body.insertBefore(this, document.body.firstChild);
+        this._setupHistoryHandlers();
     },
     tabNamed: function(tabName)
@@ -109 +149 @@
         return this.tabNamed('results');
     },
-    select: function(tabName)
-    {
+    _selectInternal: function(tabName) {
         var tabIndex = this._tabNames.indexOf(tabName);
         this._tabs.tabs('enable', tabIndex);
         this._tabs.tabs('select', tabIndex);
+    },
+    select: function(tabName)
+    {
+        this._saveScrollOffset();
+        this._selectInternal(tabName);
+        window.location = '#' + tabName;
     }
 });

trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js

@@ -191 +191 @@
             var nonLinkTitle = document.createElement('a');
             $(nonLinkTitle).addClass('non-link-title');
-            $(nonLinkTitle).attr('href', "#").text(testName);
+            $(nonLinkTitle).text(testName);
 
             var linkTitle = document.createElement('a');

trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js

@@ -47 +47 @@
 }
 
+test("ui.onebar", 3, function() {
+    if (window.location.hash) {
+        window.location.hash = '';
+    }
+
+    onebar = new ui.onebar();
+    onebar.attach();
+    equal(onebar.innerHTML,
+        '<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">' +
+            '<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#unexpected">Unexpected Failures</a></li>' +
+            '<li class="ui-state-default ui-corner-top"><a href="#expected">Expected Failures</a></li>' +
+            '<li class="ui-state-default ui-corner-top ui-state-disabled"><a href="#results">Results</a></li>' +
+        '</ul>' +
+        '<div id="unexpected" class="ui-tabs-panel ui-widget-content ui-corner-bottom"></div>' +
+        '<div id="expected" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"></div>' +
+        '<div id="results" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"></div>');
+
+    onebar.select('expected');
+    equal(window.location.hash, '#expected');
+    onebar.select('unexpected');
+    equal(window.location.hash, '#unexpected');
+
+    $(onebar).detach();
+});
+
 test("results.ResultsGrid", 1, function() {
     var grid = new ui.results.ResultsGrid()

trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/results.css

@@ -91 +91 @@
     display: inline-block;
 }
-.ui-state-active .non-link-title, .ui-state-active .non-link-title:link, .ui-state-active .non-link-title:visited {
+/* Stupid CSS specificity rules. We need the .ui-accordion-header to override the builtin jquery styling on anchor tags in accordion headers. */
+.ui-state-active.ui-accordion-header .non-link-title, .ui-state-active .non-link-title:link, .ui-state-active .non-link-title:visited {
     display: none;
 }

trunk/Tools/ChangeLog

@@ +1 @@
+2012-03-28  Ojan Vafai  <ojan@chromium.org>
+
+        Add history navigation to garden-o-matic
+        https://bugs.webkit.org/show_bug.cgi?id=82495
+
+        Reviewed by Dimitri Glazkov.
+
+        Also, maintain scroll offsets when returning to a tab. This makes addressing
+        expected failures considerably easier when dealing with below-the-fold tests.
+
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui.js:
+        -Store the scrollTop before switching to a new tab and restore the appropriate scrollTop after
+        switching.
+        -Modify window.location with the tabName in the hash. Can't use pushState because this is served
+        from a file URL and Chrome puts each different file URL in it's own origin.
+
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js:
+        Remove the href so that clicking on the accordion item does not modify window.location.hash.
+
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js:
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/results.css:
+
 2012-03-28  Philippe Normand  <pnormand@igalia.com>