| OLD | NEW | 
| (Empty) |  | 
 |   1 <!DOCTYPE html> | 
 |   2 <script src="../../resources/testharness.js"></script> | 
 |   3 <script src="../../resources/testharnessreport.js"></script> | 
 |   4  | 
 |   5 <div id="target"></div> | 
 |   6  | 
 |   7 <script> | 
 |   8 function compareValue(property, calcValue, expectedValue) { | 
 |   9     target.style[property] = ''; | 
 |  10     target.style[property] = calcValue; | 
 |  11     var computedCalcValue = getComputedStyle(target)[property]; | 
 |  12  | 
 |  13     target.style[property] = expectedValue; | 
 |  14     var computedExpectedValue = getComputedStyle(target)[property]; | 
 |  15     assert_equals(computedCalcValue, computedExpectedValue, calcValue + ' should
     equal to ' + expectedValue); | 
 |  16 } | 
 |  17  | 
 |  18 test(function() { | 
 |  19     compareValue("transition-delay", "calc(4s + 1s)", "5s"); | 
 |  20     compareValue("transition-delay", "calc(4s + 1ms)", "4.001s"); | 
 |  21     compareValue("transition-delay", "calc(4ms + 1ms)", "0.005s"); | 
 |  22     compareValue("transition-delay", "calc(4s - 1s)", "3s"); | 
 |  23     compareValue("transition-delay", "calc(4s - 1ms)", "3.999s"); | 
 |  24     compareValue("transition-delay", "calc(4 * 1s)", "4s"); | 
 |  25     compareValue("transition-delay", "calc(4 * 1ms)", "0.004s"); | 
 |  26     compareValue("transition-delay", "calc(4s / 2)", "2s"); | 
 |  27     compareValue("transition-delay", "calc(4ms / 2)", "0.002s"); | 
 |  28 }, "Tests calc() with time units."); | 
 |  29  | 
 |  30 test(function() { | 
 |  31     compareValue("transform", "rotate(calc(45deg + 45deg))", "rotate(90deg)"); | 
 |  32     compareValue("transform", "rotate(calc(45deg + 1rad))", "rotate(102.3deg)"); | 
 |  33     compareValue("transform", "rotate(calc(20deg + 200grad))", "rotate(200deg)")
    ; | 
 |  34     compareValue("transform", "rotate(calc(200deg + 0.5turn))", "rotate(200deg)"
    ); | 
 |  35     compareValue("transform", "rotate(calc(45rad + 45rad))", "rotate(90rad)"); | 
 |  36     compareValue("transform", "rotate(calc(1rad + 40grad))", "matrix(-0.05749048
    75548093, 0.998346054151921, -0.998346054151921, -0.0574904875548093, 0, 0)"); | 
 |  37     compareValue("transform", "rotate(calc(1rad + 0.5turn))", "matrix(-0.5403023
    0586814, -0.841470984807896, 0.841470984807896, -0.54030230586814, 0, 0)"); | 
 |  38     compareValue("transform", "rotate(calc(45grad + 45grad))", "rotate(90grad)")
    ; | 
 |  39     compareValue("transform", "rotate(calc(10grad + 0.5turn))", "rotate(189deg)"
    ); | 
 |  40  | 
 |  41     compareValue("transform", "rotate(calc(45deg - 15deg))", "rotate(30deg)"); | 
 |  42     compareValue("transform", "rotate(calc(90deg - 1rad))", "matrix(0.8414709848
    07897, 0.54030230586814, -0.54030230586814, 0.841470984807897, 0, 0)"); | 
 |  43     compareValue("transform", "rotate(calc(38deg - 20grad))", "rotate(20deg)"); | 
 |  44     compareValue("transform", "rotate(calc(360deg - 0.5turn))", "rotate(180deg)"
    ); | 
 |  45     compareValue("transform", "rotate(calc(45rad - 15rad))", "rotate(30rad)"); | 
 |  46     compareValue("transform", "rotate(calc(30rad - 10grad))", "matrix(-0.9557280
    13201613, 0.294251533184956, -0.294251533184956, -0.955728013201613, 0, 0)"); | 
 |  47     compareValue("transform", "rotate(calc(4rad - 0.1turn))", "matrix(-0.9736461
    43183581, -0.228063999490797, 0.228063999490797, -0.973646143183581, 0, 0)"); | 
 |  48     compareValue("transform", "rotate(calc(45grad - 15grad))", "rotate(30grad)")
    ; | 
 |  49     compareValue("transform", "rotate(calc(100grad - 0.25turn))", "rotate(0deg)"
    ); | 
 |  50  | 
 |  51     compareValue("transform", "rotate(calc(45deg * 2))", "rotate(90deg)"); | 
 |  52     compareValue("transform", "rotate(calc(2 * 45rad))", "rotate(90rad)"); | 
 |  53     compareValue("transform", "rotate(calc(45grad * 2))", "rotate(90grad)"); | 
 |  54     compareValue("transform", "rotate(calc(2 * 45turn))", "rotate(90turn)"); | 
 |  55  | 
 |  56     compareValue("transform", "rotate(calc(90deg / 2))", "rotate(45deg)"); | 
 |  57     compareValue("transform", "rotate(calc(90rad / 2))", "rotate(45rad)"); | 
 |  58     compareValue("transform", "rotate(calc(90grad / 2))", "rotate(45grad)"); | 
 |  59     compareValue("transform", "rotate(calc(90turn / 2))", "rotate(45turn)"); | 
 |  60 }, "Tests calc() with angle units."); | 
 |  61  | 
 |  62 test(function() { | 
 |  63     // NOTE: Since there is no CSS property that uses frequency at the moment we
     only test the parsing. | 
 |  64     compareValue("pitch", "calc(10Hz + 20Hz)", null); | 
 |  65     compareValue("pitch", "calc(10kHz + 20kHz)", null); | 
 |  66     compareValue("pitch", "calc(10kHz + 20Hz)", null); | 
 |  67     compareValue("pitch", "calc(20Hz - 10Hz)", null); | 
 |  68     compareValue("pitch", "calc(20kHz - 10kHz)", null); | 
 |  69     compareValue("pitch", "calc(20kHz - 10Hz)", null); | 
 |  70     compareValue("pitch", "calc(10Hz * 2)", null); | 
 |  71     compareValue("pitch", "calc(10kHz * 2)", null); | 
 |  72     compareValue("pitch", "calc(10Hz / 2)", null); | 
 |  73     compareValue("pitch", "calc(10kHz / 2)", null); | 
 |  74 }, "Tests calc() with frequency units."); | 
 |  75  | 
 |  76 test(function() { | 
 |  77     compareValue("transition-delay", "calc(4000ms)", "4s"); | 
 |  78     compareValue("transform", "rotate(calc(50grad)", "rotate(45deg)"); | 
 |  79 }, "Tests unit conversion of single values in calc()."); | 
 |  80 </script> | 
| OLD | NEW |