third_party/WebKit/LayoutTests/typedcssom/cssURLImageValue.html - Issue 2222863002: [Typed-OM] Enable getting CSSURLImageValue from stylemap

Side by Side Diff: third_party/WebKit/LayoutTests/typedcssom/cssURLImageValue.html

Issue 2222863002: [Typed-OM] Enable getting CSSURLImageValue from stylemap (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@CSSProperties_Image

Patch Set: Remove backgroundImage test from unsupported-properties, simplify test to get from StyleMap Created 4 years, 4 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/typedcssom/inlinestyle/unsupported-properties.html » ('j') | third_party/WebKit/LayoutTests/typedcssom/inlinestyle/unsupported-properties.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <script src="../resources/testharness.js"></script>	2 <script src="../resources/testharness.js"></script>

3 <script src="../resources/testharnessreport.js"></script>	3 <script src="../resources/testharnessreport.js"></script>

4	4

5 <div id="test-image1"></div>	5 <div id="test-image1"></div>

6 <div id="test-image2"></div>	6 <div id="test-image2"></div>

7 <div id="test-image3"></div>	7 <div id="test-image3"></div>

	8 <div id="test-image4"></div>

8	9

9 <script>	10 <script>

10	11

11 // list of available image properties	12 // list of available image properties

12 var imageProperties = ["background-image", "border-image-source", "list-style-im age", "content", "shape-outside"];	13 var imageProperties = ["background-image", "border-image-source", "list-style-im age", "content", "shape-outside"];

13	14

14 function urlImage() {	15 function urlImage() {

15 var c = document.location.href.split('/');	16 var c = document.location.href.split('/');

16 c[c.length - 1] = 'resources/1x1-green.png';	17 c[c.length - 1] = 'resources/1x1-green.png';

17 return c.join('/');	18 return c.join('/');

18 }	19 }

19	20

20 function base64Image() {	21 function base64Image() {

21 return "data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=";	22 return "data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=";

22 }	23 }

23	24

	25 function assertCorrectURLImageValue(image, expectedUrl, expectedWidth, expectedH eight, expectedRatio) {

	26 assert_true(image instanceof CSSURLImageValue);

	27 assert_equals(image.url, expectedUrl);

	28 assert_equals(image.state, "loaded");

	29 assert_equals(image.intrinsicWidth, expectedWidth);

	30 assert_equals(image.intrinsicHeight, expectedHeight);

	31 assert_equals(image.intrinsicRatio, expectedRatio);

	32 }

	33

24 test(function() {	34 test(function() {

25 var bg = new CSSURLImageValue(urlImage);	35 var bg = new CSSURLImageValue(urlImage);

26 assert_equals(bg.state, "unloaded");	36 assert_equals(bg.state, "unloaded");

27 }, "Can construct a new CSSURLImageValue object with url");	37 }, "Can construct a new CSSURLImageValue object with url");

28	38

29 {	39 {

30 var test1 = async_test("Set available properties as CSSURLImageValue using URL ");	40 var test1 = async_test("Set available properties as CSSURLImageValue using URL ");

31 var url1 = urlImage();	41 var url1 = urlImage();

32	42

33 var imageValue1 = new CSSURLImageValue(url1);	43 var imageValue1 = new CSSURLImageValue(url1);

(...skipping 68 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
102 image3.onerror = function() {	112 image3.onerror = function() {

103 assert_equals(imageValue3.url, url3);	113 assert_equals(imageValue3.url, url3);

104 assert_equals(imageValue3.state, "error");	114 assert_equals(imageValue3.state, "error");

105 assert_equals(imageValue3.intrinsicWidth, 0);	115 assert_equals(imageValue3.intrinsicWidth, 0);

106 assert_equals(imageValue3.intrinsicHeight, 0);	116 assert_equals(imageValue3.intrinsicHeight, 0);

107 assert_equals(imageValue3.intrinsicRatio, null);	117 assert_equals(imageValue3.intrinsicRatio, null);

108 test3.done();	118 test3.done();

109 };	119 };

110 }	120 }

111	121

	122 test(function() {

	123 var url4 = base64Image();

	124 var div4 = document.getElementById("test-image4");

	125

	126 for (var i = 0; i < imageProperties.length; ++i)

	127 div4.style[imageProperties[i]] = 'url(' + url4 + ')';
	meade_UTC10 2016/08/12 05:23:16 For JS style we use curly braces ({}) everywhere, For JS style we use curly braces ({}) everywhere, including one-line for loops.
	128

	129 for (var i = 0; i < imageProperties.length; ++i) {

	130 assertCorrectURLImageValue(getComputedStyleMap(div4).get(imageProperties[i]) , url4, 1, 1, 1);

	131 assertCorrectURLImageValue(div4.styleMap.get(imageProperties[i]), url4, 1, 1 , 1);

	132 }

	133 }, "Getting CSSURLImageValue from StyleMap");

112 </script>	134 </script>

OLD	NEW