Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(321)

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: Rebase and add tests for each property 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/Source/core/css/cssom/StyleValueFactory.cpp » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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 function urlImage() { 12 function urlImage() {
12 var c = document.location.href.split('/'); 13 var c = document.location.href.split('/');
13 c[c.length - 1] = 'resources/1x1-green.png'; 14 c[c.length - 1] = 'resources/1x1-green.png';
14 return c.join('/'); 15 return c.join('/');
15 } 16 }
16 17
17 function base64Image() { 18 function base64Image() {
18 return "data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA="; 19 return "data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=";
19 } 20 }
20 21
22 function assertEqualsURLImageValue(urlImage1, urlImage2) {
23 assert_equals(urlImage1.url, urlImage2.url);
24 assert_equals(urlImage1.state, urlImage2.state);
25 assert_equals(urlImage1.intrinsicWidth, urlImage2.intrinsicWidth);
26 assert_equals(urlImage1.intrinsicHeight, urlImage2.intrinsicHeight);
27 assert_equals(urlImage1.intrinsicRatio, urlImage2.intrinsicRatio);
28 }
29
21 test(function() { 30 test(function() {
22 var bg = new CSSURLImageValue(urlImage); 31 var bg = new CSSURLImageValue(urlImage);
23 assert_equals(bg.state, "unloaded"); 32 assert_equals(bg.state, "unloaded");
24 }, "Can construct a new CSSURLImageValue object with url"); 33 }, "Can construct a new CSSURLImageValue object with url");
25 34
26 // list of available image properties 35 // list of available image properties
27 var imageProperties = ["background-image", "border-image-source", "list-style-im age", "content", "shape-outside"]; 36 var imageProperties = ["background-image", "border-image-source", "list-style-im age", "content", "shape-outside"];
meade_UTC10 2016/08/11 03:57:26 Probably from a dependent CL, but put this right a
anthonyhkf 2016/08/11 06:01:18 Done.
28 37
29 { 38 {
30 var test1 = async_test("Set available properties as CSSURLImageValue using URL "); 39 var test1 = async_test("Set available properties as CSSURLImageValue using URL ");
31 var url1 = urlImage(); 40 var url1 = urlImage();
32 41
33 var imageValue1 = new CSSURLImageValue(url1); 42 var imageValue1 = new CSSURLImageValue(url1);
34 var div = document.getElementById("test-image1"); 43 var div = document.getElementById("test-image1");
35 44
36 for (var i = 0; i < imageProperties.length; ++i) { 45 for (var i = 0; i < imageProperties.length; ++i) {
37 if (imageProperties[i] == 'content') // content accepts a list of value 46 if (imageProperties[i] == 'content') // content accepts a list of value
(...skipping 25 matching lines...) Expand all
63 var imageValue2 = new CSSURLImageValue(url2); 72 var imageValue2 = new CSSURLImageValue(url2);
64 var div2 = document.getElementById("test-image2"); 73 var div2 = document.getElementById("test-image2");
65 74
66 for (var i = 0; i < imageProperties.length; ++i) { 75 for (var i = 0; i < imageProperties.length; ++i) {
67 if (imageProperties[i] == 'content') // content accepts a list of value 76 if (imageProperties[i] == 'content') // content accepts a list of value
68 div2.styleMap.set(imageProperties[i], [imageValue2]); 77 div2.styleMap.set(imageProperties[i], [imageValue2]);
69 else 78 else
70 div2.styleMap.set(imageProperties[i], imageValue2); 79 div2.styleMap.set(imageProperties[i], imageValue2);
71 } 80 }
72 81
73 // add an Image object to know if the image has been loaded
meade_UTC10 2016/08/11 03:57:26 Might as well keep this comment, even if it is the
74 var image2 = new Image(); 82 var image2 = new Image();
75 image2.src = url2; 83 image2.src = url2;
76 84
77 assert_equals(imageValue2.state, "unloaded"); 85 assert_equals(imageValue2.state, "unloaded");
78 86
79 image2.addEventListener("load", function() { 87 image2.addEventListener("load", function() {
80 assert_equals(imageValue2.url, url2); 88 assert_equals(imageValue2.url, url2);
81 assert_equals(imageValue2.state, "loaded"); 89 assert_equals(imageValue2.state, "loaded");
82 assert_equals(imageValue2.intrinsicWidth, 1); 90 assert_equals(imageValue2.intrinsicWidth, 1);
83 assert_equals(imageValue2.intrinsicHeight, 1); 91 assert_equals(imageValue2.intrinsicHeight, 1);
(...skipping 17 matching lines...) Expand all
101 image3.onerror = function() { 109 image3.onerror = function() {
102 assert_equals(imageValue3.url, url3); 110 assert_equals(imageValue3.url, url3);
103 assert_equals(imageValue3.state, "error"); 111 assert_equals(imageValue3.state, "error");
104 assert_equals(imageValue3.intrinsicWidth, 0); 112 assert_equals(imageValue3.intrinsicWidth, 0);
105 assert_equals(imageValue3.intrinsicHeight, 0); 113 assert_equals(imageValue3.intrinsicHeight, 0);
106 assert_equals(imageValue3.intrinsicRatio, null); 114 assert_equals(imageValue3.intrinsicRatio, null);
107 test3.done(); 115 test3.done();
108 }; 116 };
109 } 117 }
110 118
119 {
120 var test4 = async_test("Get style for each property");
121 var url4 = base64Image();
122 var imageValue4 = new CSSURLImageValue(url4);
123
124 var div4 = document.getElementById("test-image4");
125
126 for (var i = 0; i < imageProperties.length; ++i) {
127 if (imageProperties[i] == 'content') // content accepts a list of value
128 div4.styleMap.set(imageProperties[i], [imageValue4]);
129 else
130 div4.styleMap.set(imageProperties[i], imageValue4);
meade_UTC10 2016/08/11 03:57:26 For this test, it'd be clearer if you set the prop
anthonyhkf 2016/08/11 06:01:18 Done.
131 }
132
133 var image4 = new Image();
134 image4.src = url4;
135
136 assert_equals(imageValue4.state, "unloaded");
137
138 image4.addEventListener("load", function() {
139 for (var i = 0; i < imageProperties.length; ++i) {
140 assert_true(getComputedStyleMap(div4).get(imageProperties[i]) instanceof C SSURLImageValue);
141 assert_true(div4.styleMap.get(imageProperties[i]) instanceof CSSURLImageVa lue);
142 assertEqualsURLImageValue(getComputedStyleMap(div4).get(imageProperties[i] ), imageValue4);
143 assertEqualsURLImageValue(div4.styleMap.get(imageProperties[i]), imageValu e4);
144 }
145 test4.done();
146 });
147 }
111 </script> 148 </script>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/css/cssom/StyleValueFactory.cpp » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698