Changeset 107245 in webkit


Ignore:
Timestamp:
Feb 9, 2012 7:53:48 AM (12 years ago)
Author:
mikelawther@chromium.org
Message:

update CSS3 calc() color tests to use pre/post js
​https://bugs.webkit.org/show_bug.cgi?id=77596

Note that these tests are intended to 'fail' as calc() functionality
had not yet landed (see ​http://webkit.org/b/16662)

Reviewed by Kent Tamura.

  • css3/calc/color-hsl-expected.txt:
  • css3/calc/color-hsl.html:
  • css3/calc/color-rgb-expected.txt:
  • css3/calc/color-rgb.html:
Location:
trunk/LayoutTests
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r107244 r107245  
     12012-02-09  Mike Lawther  <mikelawther@chromium.org>
     2
     3        update CSS3 calc() color tests to use pre/post js
     4        https://bugs.webkit.org/show_bug.cgi?id=77596
     5
     6        Note that these tests are intended to 'fail' as calc() functionality
     7        had not yet landed (see http://webkit.org/b/16662)
     8
     9        Reviewed by Kent Tamura.
     10
     11        * css3/calc/color-hsl-expected.txt:
     12        * css3/calc/color-hsl.html:
     13        * css3/calc/color-rgb-expected.txt:
     14        * css3/calc/color-rgb.html:
     15
    1162012-02-09  Arun Patole  <arun.patole@motorola.com>
    217

  • trunk/LayoutTests/css3/calc/color-hsl-expected.txt

    r107030 r107245  
    1 These two sentences should be the same color (simple)
    2 These two sentences should be the same color (simple)
    3 These two sentences should be the same color (alpha)
    4 These two sentences should be the same color (alpha)
    5 PASS
     1Tests that CSS3 calc() can be used with the hsl() and hsla() functions
     2
     3On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
     4
     5
     6PASS getComputedStyle(document.getElementById("simple"), null).color is "rgb(31, 223, 31)"
     7PASS getComputedStyle(document.getElementById("alpha"), null).color is "rgba(31, 223, 31, 0.699219)"
     8PASS successfullyParsed is true
     9
     10TEST COMPLETE
     11

  • trunk/LayoutTests/css3/calc/color-hsl.html

    r104432 r107245  
     1<!DOCTYPE HTML>
     2<script src="../../fast/js/resources/js-test-pre.js"></script>
    13<style>
    2 div {color: red;}
    3 #controlsimple {color: hsl(120,75%,50%);}
    4 #simple        {color: hsl(-webkit-calc(120),-webkit-calc(75%),-webkit-calc(50%));}
     4    #controlsimple { color: hsl(120,75%,50%); }
     5    #simple        { color: hsl(-webkit-calc(120),-webkit-calc(75%),-webkit-calc(50%)); }
    56
    6 #controlalpha {color: hsla(120,75%,50%,0.7);}
    7 #alpha        {color: hsla(-webkit-calc(120),-webkit-calc(75%),-webkit-calc(50%), -webkit-calc(0.7));}
     7    #controlalpha { color: hsla(120,75%,50%,0.7); }
     8    #alpha        { color: hsla(-webkit-calc(120),-webkit-calc(75%),-webkit-calc(50%), -webkit-calc(0.7)); }
    89</style>
     10<div id="test-container">
     11    <hr/>
     12    <div id="controlsimple">These two sentences should be the same color (simple)</div>
     13    <div id="simple">These two sentences should be the same color (simple)</div>
     14    <hr/>
     15    <div id="controlalpha">These two sentences should be the same color (alpha)</div>
     16    <div id="alpha">These two sentences should be the same color (alpha)</div>
     17</div>
     18<script>
     19    description("Tests that CSS3 calc() can be used with the hsl() and hsla() functions");
     20   
     21    tests = ["simple", "alpha"];
    922
    10 <div id="controlsimple">These two sentences should be the same color (simple)</div>
    11 <div id="simple">These two sentences should be the same color (simple)</div>
    12 <hr/>
    13 <div id="controlalpha">These two sentences should be the same color (alpha)</div>
    14 <div id="alpha">These two sentences should be the same color (alpha)</div>
    15 <hr/>
    16 <div id="results"></div>
     23    for (i = 0; i < tests.length; i++) {
     24        var test = tests[i];
     25        shouldBeEqualToString('getComputedStyle(document.getElementById("' + test + '"), null).color', getComputedStyle(document.getElementById("control" + test), null).color);
     26    }
     27   
     28    if (window.layoutTestController)
     29        document.body.removeChild(document.getElementById("test-container"));   
     30</script>
     31<script src="../../fast/js/resources/js-test-post.js"></script>
    1732
    18 <script>
    19 if (window.layoutTestController)
    20     layoutTestController.dumpAsText();
    21 
    22 tests = ["simple", "alpha"];
    23 
    24 var success = true;
    25 
    26 for (i = 0; i < tests.length; i++) {
    27     var test = tests[i];
    28     var expected = getComputedStyle(document.getElementById("control" + test), null).color;
    29     var actual = getComputedStyle(document.getElementById(test), null).color;
    30     success = success && (actual == expected);
    31 }
    32 
    33 var results = document.getElementById("results");
    34 if (success) {
    35     results.style.color = "green";
    36     results.innerHTML = "PASS";
    37 } else {
    38     results.style.color = "red";
    39     results.innerHTML = "FAIL";
    40 }
    41 </script>

  • trunk/LayoutTests/css3/calc/color-rgb-expected.txt

    r107030 r107245  
    1 These two sentences should be the same color (simple)
    2 These two sentences should be the same color (simple)
    3 B. These two sentences should be the same color (simple percent)
    4 B. These two sentences should be the same color (simple percent)
    5 C. These two sentences should be the same color (alpha)
    6 C. These two sentences should be the same color (alpha)
    7 These two sentences should be the same color (percent alpha)
    8 These two sentences should be the same color (percent alpha)
    9 PASS
     1Tests that CSS3 calc() can be used with the rgb() and rgba() functions
     2
     3On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
     4
     5
     6PASS getComputedStyle(document.getElementById("simple"), null).color is "rgb(10, 180, 30)"
     7PASS getComputedStyle(document.getElementById("percentsimple"), null).color is "rgb(25, 243, 76)"
     8FAIL getComputedStyle(document.getElementById("percentnumber"), null).color should be rgb(26, 240, 80). Was rgb(0, 0, 0).
     9PASS getComputedStyle(document.getElementById("alpha"), null).color is "rgba(10, 180, 30, 0.699219)"
     10PASS getComputedStyle(document.getElementById("percentalpha"), null).color is "rgba(25, 243, 76, 0.699219)"
     11FAIL getComputedStyle(document.getElementById("percentnumberalpha"), null).color should be rgba(26, 240, 80, 0.496094). Was rgb(0, 0, 0).
     12PASS successfullyParsed is true
     13
     14TEST COMPLETE
     15

  • trunk/LayoutTests/css3/calc/color-rgb.html

    r104432 r107245  
     1<!DOCTYPE HTML>
     2<script src="../../fast/js/resources/js-test-pre.js"></script>
    13<style>
    2 div {color: red;}
    3 #controlsimple {color: rgb(10,180,30);}
    4 #simple        {color: rgb(-webkit-calc(10),-webkit-calc(18 * 10),-webkit-calc(30));}
    5 #controlpercentsimple {color: rgb(10%,95%,30%);}
    6 #percentsimple        {color: rgb(-webkit-calc(2% + 8%),-webkit-calc(95%),-webkit-calc(3% * 10));}
     4    #controlsimple { color: rgb(10,180,30); }
     5    #simple        { color: rgb(-webkit-calc(10),-webkit-calc(18 * 10),-webkit-calc(30)); }
     6    #controlpercentsimple { color: rgb(10%,95%,30%); }
     7    #percentsimple        { color: rgb(-webkit-calc(2% + 8%),-webkit-calc(95%),-webkit-calc(3% * 10)); }
     8    #controlpercentnumber { color: rgb(26,240,80); }
     9    #percentnumber        { color: rgb(-webkit-calc(2% + 8% + 1),-webkit-calc(95% - 3),-webkit-calc(3% * 10 + 4)); }
    710
    8 #controlalpha {color: rgba(10,180,30,0.7);}
    9 #alpha        {color: rgba(-webkit-calc(10),-webkit-calc(180),-webkit-calc(30), -webkit-calc(0.35 * 2));}
    10 #controlpercentalpha {color: rgba(10%,95%,30%,0.7);}
    11 #percentalpha        {color: rgba(-webkit-calc(2 * 5%),-webkit-calc(100% - 5%),-webkit-calc(30%),-webkit-calc(0.2 * 3 + 0.1));}
     11    #controlalpha { color: rgba(10,180,30,0.7); }
     12    #alpha        { color: rgba(-webkit-calc(10),-webkit-calc(180),-webkit-calc(30), -webkit-calc(0.35 * 2)); }
     13    #controlpercentalpha { color: rgba(10%,95%,30%,0.7); }
     14    #percentalpha        { color: rgba(-webkit-calc(2 * 5%),-webkit-calc(100% - 5%),-webkit-calc(30%),-webkit-calc(0.2 * 3 + 0.1)); }
     15    #controlpercentnumberalpha { color: rgba(26,240,80, 0.5); }
     16    #percentnumberalpha        { color: rgba(-webkit-calc(2% + 8% + 1),-webkit-calc(95% - 3),-webkit-calc(3% * 10 + 4), -webkit-calc(1.0 / 2)); }
    1217</style>
     18<div id="test-container">
     19    <hr/>
     20    <div id="controlsimple">These two sentences should be the same color (simple)</div>
     21    <div id="simple">These two sentences should be the same color (simple)</div>
     22    <hr/>
     23    <div id="controlpercentsimple">These two sentences should be the same color (simple percent)</div>
     24    <div id="percentsimple">These two sentences should  be the same color (simple percent)</div>
     25    <hr/>
     26    <div id="controlpercentnumber">These two sentences should be the same color (percent number)</div>
     27    <div id="percentnumber">These two sentences should  be the same color (percent number)</div>
     28    <hr/>
     29    <div id="controlalpha">These two sentences should be the same color (alpha)</div>
     30    <div id="alpha">These two sentences should be the same color (alpha)</div>
     31    <hr/>
     32    <div id="controlpercentalpha">These two sentences should  be the same color (percent alpha)</div>
     33    <div id="percentalpha">These two sentences should  be the same color (percent alpha)</div>
     34    <hr/>
     35    <div id="controlpercentnumberalpha">These two sentences should be the same color (percent number alpha)</div>
     36    <div id="percentnumberalpha">These two sentences should  be the same color (percent number alpha)</div>
     37</div>
     38<script>
     39    description("Tests that CSS3 calc() can be used with the rgb() and rgba() functions");
     40   
     41    tests = ["simple", "percentsimple", "percentnumber", "alpha", "percentalpha", "percentnumberalpha"];
    1342
    14 <div id="controlsimple">These two sentences should be the same color (simple)</div>
    15 <div id="simple">These two sentences should be the same color (simple)</div>
    16 <hr/>
    17 <div id="controlpercentsimple">B. These two sentences should be the same color (simple percent)</div>
    18 <div id="percentsimple">B. These two sentences should  be the same color (simple percent)</div>
    19 <hr/>
    20 <div id="controlalpha">C. These two sentences should be the same color (alpha)</div>
    21 <div id="alpha">C. These two sentences should be the same color (alpha)</div>
    22 <hr/>
    23 <div id="controlpercentalpha">These two sentences should  be the same color (percent alpha)</div>
    24 <div id="percentalpha">These two sentences should  be the same color (percent alpha)</div>
    25 <hr/>
    26 <div id="results"></div>
     43    for (i = 0; i < tests.length; i++) {
     44        var test = tests[i];
     45        shouldBeEqualToString('getComputedStyle(document.getElementById("' + test + '"), null).color', getComputedStyle(document.getElementById("control" + test), null).color);
     46    }
    2747
    28 <script>
    29 if (window.layoutTestController)
    30     layoutTestController.dumpAsText();
    31 
    32 tests = ["simple", "alpha"];
    33 
    34 var success = true;
    35 
    36 for (i = 0; i < tests.length; i++) {
    37     var test = tests[i];
    38     var expectedsimple = getComputedStyle(document.getElementById("control" + test), null).color;
    39     var actualsimple = getComputedStyle(document.getElementById(test), null).color;
    40     var expectedpercent = getComputedStyle(document.getElementById("controlpercent" + test), null).color;
    41     var actualpercent = getComputedStyle(document.getElementById("percent" + test), null).color;   
    42     success = success && (actualsimple == expectedsimple) && (actualpercent == expectedpercent);
    43 }
    44 
    45 var results = document.getElementById("results");
    46 if (success) {
    47     results.style.color = "green";
    48     results.innerHTML = "PASS";
    49 } else {
    50     results.style.color = "red";
    51     results.innerHTML = "FAIL";
    52 }
     48    if (window.layoutTestController)
     49        document.body.removeChild(document.getElementById("test-container"));
    5350</script>
     51<script src="../../fast/js/resources/js-test-post.js"></script>
Note: See TracChangeset for help on using the changeset viewer.