third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-cross-fade.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <script type="text/javascript">
   8
   9 function testCrossfade(css, queryProp)
  10 {
  11     var div = document.createElement('div');
  12     div.setAttribute('style', css);
  13     document.body.appendChild(div);
  14
  15     var result = getComputedStyle(div).getPropertyValue(queryProp);
  16     document.body.removeChild(div);
  17     return result;
  18 }
  19
  20 debug('<p>-webkit-cross-fade</p>');
  21
  22 // Valid
  23
  24 shouldBe('testCrossfade("opacity: 500%", "opacity")', '"1"');
  25 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 50%)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 0.5)"');
  26 shouldBe('testCrossfade("background-image: -webkit-cross-fade(-webkit-cross-fade(url(dummy://a.png), url(dummy://b.png), 25%), url(dummy://example.png), 50%)", "background-image")', '"-webkit-cross-fade(-webkit-cross-fade(url(dummy://a.png), url(dummy://b.png), 0.25), url(dummy://example.png), 0.5)"');
  27 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://c.png), -webkit-cross-fade(url(dummy://a.png), url(dummy://b.png), 25%), 50%)", "background-image")', '"-webkit-cross-fade(url(dummy://c.png), -webkit-cross-fade(url(dummy://a.png), url(dummy://b.png), 0.25), 0.5)"');
  28 shouldBe('testCrossfade("background-image: -webkit-cross-fade(-webkit-linear-gradient(black, white), url(dummy://example.png), 10%)", "background-image")', '"-webkit-cross-fade(-webkit-linear-gradient(top, black, white), url(dummy://example.png), 0.1)"');
  29 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 1.0)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 1)"');
  30 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 0.5)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 0.5)"');
  31
  32 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 5.0)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 1)"');
  33 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 700%)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 1)"');
  34
  35 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), -20)", "background-image")', '"-webkit-cross-fade(url(dummy://example.png), url(dummy://example.png), 0)"');
  36
  37 // Invalid
  38
  39 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png))", "background-image")', '"none"');
  40 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png), url(dummy://example.png),)", "background-image")', '"none"');
  41 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://example.png))", "background-image")', '"none"');
  42 shouldBe('testCrossfade("background-image: -webkit-cross-fade(), url(dummy://example.png))", "background-image")', '"none"');
  43 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(", "background-image")', '"none"');
  44 shouldBe('testCrossfade("background-image: -webkit-cross-fade(10px 20% 5px #bbb)", "background-image")', '"none"');
  45 shouldBe('testCrossfade("background-image: -webkit-cross-fade(-webkit-cross-fade(-webkit-cross-fade()))", "background-image")', '"none"');
  46 shouldBe('testCrossfade("background-image: -webkit-cross-fade(20%, url(dummy://a.png), url(dummy://b.png))", "background-image")', '"none"');
  47 shouldBe('testCrossfade("background-image: -webkit-cross-fade(url(dummy://a.png),)", "background-image")', '"none"');
  48 shouldBe('testCrossfade("background-image: -webkit-cross-fade(,)", "background-image")', '"none"');
  49 shouldBe('testCrossfade("background-image: -webkit-cross-fade(,url(dummy://a.png))", "background-image")', '"none"');
  50 shouldBe('testCrossfade("background-image: -webkit-cross-fade(,,,,,)", "background-image")', '"none"');
  51
  52
  53 </script>
  54
  55 </body>
  56 </html>