⚠ Archived content — this site is no longer maintained.   Current WebKit documentation is at docs.webkit.org.

Changeset 122880 in webkit


Ignore:
Timestamp:
Jul 17, 2012, 3:22:12 PM (14 years ago)
Author:
ojan@chromium.org
Message:

A couple of UI nits about the flagging feature in results.html
​https://bugs.webkit.org/show_bug.cgi?id=86798

Reviewed by Dirk Pranke.

-Clicking the flag unflags it now
-There's a flag all link for each test list
-Make the flag list always show up at the bottom of the viewport
when there are flagged tests. This makes it both less annoying
and easier to understand what's going on when you flag a test.
This required wrapping all the content in a div so that we could
make the body be a flexbox.

  • fast/harness/resources/results-test.js:

(runSingleRowTest):

  • fast/harness/results.html:
Location:
trunk/LayoutTests
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r122879 r122880  
     12012-07-17  Ojan Vafai  <ojan@chromium.org>
     2
     3        A couple of UI nits about the flagging feature in results.html
     4        https://bugs.webkit.org/show_bug.cgi?id=86798
     5
     6        Reviewed by Dirk Pranke.
     7
     8        -Clicking the flag unflags it now
     9        -There's a flag all link for each test list
     10        -Make the flag list always show up at the bottom of the viewport
     11        when there are flagged tests. This makes it both less annoying
     12        and easier to understand what's going on when you flag a test.
     13        This required wrapping all the content in a div so that we could
     14        make the body be a flexbox.
     15        * fast/harness/resources/results-test.js:
     16        (runSingleRowTest):
     17        * fast/harness/results.html:
     18
    1192012-07-17  Bruno de Oliveira Abinader  <bruno.abinader@basyskom.com>
    220

  • trunk/LayoutTests/fast/harness/resources/results-test.js

    r122864 r122880  
    106106            assertTrue(document.querySelector('tbody').className.indexOf('expected') == -1);
    107107
    108         assertTrue(document.querySelector('tbody td:nth-child(1)').textContent == '+' + test);
     108        assertTrue(document.querySelector('tbody td:nth-child(1)').textContent == '+' + test + ' \u2691');
    109109        assertTrue(document.querySelector('tbody td:nth-child(2)').textContent == textResults);
    110110        assertTrue(document.querySelector('tbody td:nth-child(3)').textContent == imageResults);
    … …  
    685685    runTest(results, function() {
    686686        var titles = document.getElementsByTagName('h1');
    687         assertTrue(titles[0].textContent == 'Tests that crashed (1):');
    688         assertTrue(titles[1].textContent == 'Tests that failed text/pixel/audio diff (3):');
    689         assertTrue(titles[2].textContent == 'Tests that had no expected results (probably new) (1):');
    690         assertTrue(titles[3].textContent == 'Tests that timed out (0):');
    691         assertTrue(titles[4].textContent == 'Tests that had stderr output (1):');
    692         assertTrue(titles[5].textContent == 'Tests expected to fail but passed (1):');
     687        assertTrue(titles[0].textContent == 'Tests that crashed (1): flag all');
     688        assertTrue(titles[1].textContent == 'Tests that failed text/pixel/audio diff (3): flag all');
     689        assertTrue(titles[2].textContent == 'Tests that had no expected results (probably new) (1): flag all');
     690        assertTrue(titles[3].textContent == 'Tests that timed out (0): flag all');
     691        assertTrue(titles[4].textContent == 'Tests that had stderr output (1): flag all');
     692        assertTrue(titles[5].textContent == 'Tests expected to fail but passed (1): flag all');
    693693
    694694        document.getElementById('unexpected-results').checked = false;
    695695        document.getElementById('unexpected-results').onchange();
    696696
    697         assertTrue(titles[0].textContent == 'Tests that crashed (2):');
    698         assertTrue(titles[1].textContent == 'Tests that failed text/pixel/audio diff (5):');
    699         assertTrue(titles[2].textContent == 'Tests that had no expected results (probably new) (1):');
    700         assertTrue(titles[3].textContent == 'Tests that timed out (1):');
    701         assertTrue(titles[4].textContent == 'Tests that had stderr output (1):');
    702         assertTrue(titles[5].textContent == 'Tests expected to fail but passed (1):');
     697        assertTrue(titles[0].textContent == 'Tests that crashed (2): flag all');
     698        assertTrue(titles[1].textContent == 'Tests that failed text/pixel/audio diff (5): flag all');
     699        assertTrue(titles[2].textContent == 'Tests that had no expected results (probably new) (1): flag all');
     700        assertTrue(titles[3].textContent == 'Tests that timed out (1): flag all');
     701        assertTrue(titles[4].textContent == 'Tests that had stderr output (1): flag all');
     702        assertTrue(titles[5].textContent == 'Tests expected to fail but passed (1): flag all');
    703703    });
    704704
    … …  
    711711    runTest(results, function() {
    712712        var titles = document.getElementsByTagName('h1');
    713         assertTrue(titles[0].textContent == 'Tests that failed text/pixel/audio diff (1):');
    714         assertTrue(titles[1].textContent =='Flaky tests (failed the first run and passed on retry) (1):');
     713        assertTrue(titles[0].textContent == 'Tests that failed text/pixel/audio diff (1): flag all');
     714        assertTrue(titles[1].textContent =='Flaky tests (failed the first run and passed on retry) (1): flag all');
    715715
    716716        assertTrue(document.querySelectorAll('#results-table tbody').length == 2);
    … …  
    718718    });
    719719
     720    results = mockResults();
     721    var subtree = results.tests['foo'] = {}
     722    subtree['bar.html'] = mockExpectation('TEXT', 'IMAGE');
     723    subtree['bar1.html'] = mockExpectation('TEXT', 'TEXT');
     724    subtree['bar2.html'] = mockExpectation('TEXT', 'TEXT');
     725    runTest(results, function() {
     726        var flaggedTestsTextbox = document.getElementById('flagged-tests');
     727
     728        flagAll(document.querySelector('.flag-all'));
     729        assertTrue(flaggedTestsTextbox.innerText == 'foo/bar.html');
     730
     731        document.getElementById('unexpected-results').checked = false;
     732        document.getElementById('unexpected-results').onchange();
     733
     734        flagAll(document.querySelector('.flag-all'));
     735        assertTrue(flaggedTestsTextbox.innerText == 'foo/bar.html\nfoo/bar1.html\nfoo/bar2.html');
     736
     737        unflag(document.querySelector('.flag'));
     738        assertTrue(flaggedTestsTextbox.innerText == 'foo/bar1.html\nfoo/bar2.html');
     739    });
     740
    720741    document.body.innerHTML = '<pre>' + g_log.join('\n') + '</pre>';
    721742}

  • trunk/LayoutTests/fast/harness/results-expected.txt

    r122864 r122880  
    222222TEST-38: PASS
    223223TEST-38: PASS
     224TEST-39: PASS
     225TEST-39: PASS
     226TEST-39: PASS

  • trunk/LayoutTests/fast/harness/results.html

    r122864 r122880  
    11<!DOCTYPE html>
    22<style>
     3html {
     4    height: 100%;
     5}
    36body {
    4     margin: 4px;
     7    margin: 0;
    58    font-family: Helvetica, sans-serif;
    69    font-size: 11pt;
    7 }
    8 
    9 body > p:first-of-type {
    10     margin-top: 0;
     10    display: -webkit-flex;
     11    -webkit-flex-direction: column;
     12    height: 100%;
     13}
     14
     15body > * {
     16    margin-left: 4px;
     17    margin-top: 4px;
    1118}
    1219
    … …  
    4350    -webkit-user-select: none;
    4451    -moz-user-select: none;
     52}
     53
     54.content-container {
     55    -webkit-flex: 1;
     56    min-height: 0;
     57    overflow: auto;
    4558}
    4659
    … …  
    99112}
    100113
    101 .test-link.flagged:after {
    102     content: ' \2691';
     114tbody .flag {
     115    display: none;
     116}
     117
     118tbody.flagged .flag {
     119    display: inline;
    103120}
    104121
    … …  
    194211#flagged-tests {
    195212    padding: 5px;
     213    height: 100px;
    196214}
    197215</style>
    … …  
    254272}
    255273
    256 
    257 
    258274function remove(node)
    259275{
    … …  
    389405}
    390406
     407function visibleTests(container)
     408{
     409    if (onlyShowUnexpectedFailures())
     410        return container.querySelectorAll('tbody:not(.expected)');
     411    else
     412        return container.querySelectorAll('tbody');
     413}
     414
    391415function visibleExpandLinks()
    392416{
    … …  
    429453}
    430454
     455function unflag(flag)
     456{
     457    var shouldFlag = false;
     458    TestNavigator.flagTest(parentOfType(flag, 'tbody'), shouldFlag);
     459}
     460
    431461function testLinkWithExpandButton(test)
    432462{
    433     return '<span class=expand-button onclick="toggleExpectations(this)"><span class=expand-button-text>+</span></span>' + testLink(test);
     463    return '<span class=expand-button onclick="toggleExpectations(this)"><span class=expand-button-text>+</span></span>' + testLink(test) +
     464        '<span class=flag onclick="unflag(this)"> \u2691</span>';
    434465}
    435466
    … …  
    644675}
    645676
     677function flagAll(headerLink)
     678{
     679    var tests = visibleTests(parentOfType(headerLink, 'div'));
     680    forEach(tests, function(tests) {
     681        var shouldFlag = true;
     682        TestNavigator.flagTest(tests, shouldFlag);
     683    })
     684}
     685
    646686function testListHeaderHtml(header)
    647687{
    648     return '<h1>' + header + ' (<span class=test-list-count></span>):</h1>';
     688    return '<h1>' + header + ' (<span class=test-list-count></span>): <a href="#" class=flag-all onclick="flagAll(this)">flag all</a></h1>';
    649689}
    650690
    … …  
    10081048TestNavigator._toggleCurrentTestFlagged = function()
    10091049{
    1010     var testLink = parentOfType(TestNavigator._currentTestLink(), 'tbody').querySelector('.test-link');
    1011     var testName = testLink.innerText;
    1012    
    1013     if (testLink.classList.contains('flagged')) {
    1014         testLink.classList.remove('flagged');
     1050    var testLink = parentOfType(TestNavigator._currentTestLink(), 'tbody');
     1051    TestNavigator.flagTest(testLink, !testLink.classList.contains('flagged'));
     1052}
     1053
     1054// FIXME: Test navigator shouldn't know anything about flagging. It should probably call out to TestFlagger or something.
     1055TestNavigator.flagTest = function(testTbody, shouldFlag)
     1056{
     1057    var testName = testTbody.querySelector('.test-link').innerText;
     1058   
     1059    if (shouldFlag) {
     1060        testTbody.classList.add('flagged');
     1061        TestNavigator.flaggedTests[testName] = 1;
     1062    } else {
     1063        testTbody.classList.remove('flagged');
    10151064        delete TestNavigator.flaggedTests[testName];
    1016     } else {
    1017         testLink.classList.add('flagged');
    1018         TestNavigator.flaggedTests[testName] = 1;
    10191065    }
    10201066
    … …  
    12591305    forEachTest(processGlobalStateFor);
    12601306
    1261     var html = '<div id=toolbar>' +
     1307    var html = '<div class=content-container><div id=toolbar>' +
    12621308        '<div class="note">Use the i, j, k and l keys to navigate, e, c to expand and collapse, and f to flag</div>' +
    12631309        '<a href="javascript:void()" onclick="expandAllExpectations()">expand all</a> ' +
    … …  
    12991345    }
    13001346
    1301     document.body.innerHTML = html;
     1347    document.body.innerHTML = html + '</div>';
    13021348
    13031349    if (document.getElementById('results-table')) {
Note: See TracChangeset for help on using the changeset viewer.