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

Side by Side Diff: third_party/WebKit/LayoutTests/fast/canvas/canvas-direction.html

Issue 2674863003: Use testharness.js instead of js-test.js in LayoutTests/fast/canvas tests. (Closed)
Patch Set: Addressing comments Created 3 years, 10 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
OLDNEW
1 <html> 1 <html>
2 <head> 2 <head>
3 <style> 3 <script src="../../resources/testharness.js"></script>
4 .pass { 4 <script src="../../resources/testharnessreport.js"></script>
5 color: green;
6 font-weight: bold;
7 }
8
9 .fail {
10 color: red;
11 font-weight: bold;
12 }
13 </style>
14 </head> 5 </head>
15 <body> 6 <body>
16 <span>Tests that canvas 2d context supports 'direction' attribute: <span id="sup ported"></span></span> 7 <span>Tests that canvas 2d context supports 'direction' attribute: <span id="sup ported"></span></span>
17 <div> 8 <div>
18 <span>Tests that context.direction is 'ltr' with parent element having unspecifi ed direction: <span id="result1"></span></span><br> 9 <span>Tests that context.direction is 'ltr' with parent element having unspecifi ed direction: <span id="result1"></span></span><br>
19 <canvas id="canvas1" width=400 height=20 style="border:1px solid black"></canvas > 10 <canvas id="canvas1" width=400 height=20 style="border:1px solid black"></canvas >
20 </div> 11 </div>
21 <div dir="rtl"> 12 <div dir="rtl">
22 <span>Tests that context.direction is 'rtl' with parent element having direction as rtl: <span id="result2"></span></span><br> 13 <span>Tests that context.direction is 'rtl' with parent element having direction as rtl: <span id="result2"></span></span><br>
23 <canvas id="canvas2" width=400 height=20 style="border:1px solid black"></canvas > 14 <canvas id="canvas2" width=400 height=20 style="border:1px solid black"></canvas >
(...skipping 30 matching lines...) Expand all
54 <span>Tests that change in element's dir attribute is reflected in context.direc tion as ltr: <span id="result10"></span></span><br> 45 <span>Tests that change in element's dir attribute is reflected in context.direc tion as ltr: <span id="result10"></span></span><br>
55 <canvas id="canvas10" width=400 height=20 style="border:1px solid black"></canva s> 46 <canvas id="canvas10" width=400 height=20 style="border:1px solid black"></canva s>
56 </div> 47 </div>
57 <div> 48 <div>
58 <span>Tests that context.direction reflects the valid direction after save/resto re context operations: <span id="result11"></span></span><br> 49 <span>Tests that context.direction reflects the valid direction after save/resto re context operations: <span id="result11"></span></span><br>
59 <canvas id="canvas11" style="border:1px solid black"></canvas> 50 <canvas id="canvas11" style="border:1px solid black"></canvas>
60 </div> 51 </div>
61 <div id="results"> 52 <div id="results">
62 </div> 53 </div>
63 <script> 54 <script>
64 if (window.testRunner)
65 testRunner.dumpAsText();
66
67 var newCanvasElement = document.createElement('canvas');
68 document.getElementById('supported').textContent = newCanvasElement.getContext(' 2d').direction ? 'PASS' : 'FAIL';
69 document.getElementById('supported').className = newCanvasElement.getContext('2d ').direction ? 'pass' : 'fail';
70
71 var fontSettings = "12px 'Arial'"; 55 var fontSettings = "12px 'Arial'";
72 56
73 function appendResult(description, result) 57 function verifyDrawText(canvasId, text, expectedDirection)
74 { 58 {
75 var descriptionElement = document.createElement('span'); 59 console.log(canvasId, text, expectedDirection);
76 var resultElement = document.createElement('span');
77 descriptionElement.innerHTML = description;
78 resultElement.textContent = result;
79 resultElement.className = (result === 'PASS') ? 'pass' : 'fail';
80 descriptionElement.appendChild(resultElement);
81 document.getElementById("results").appendChild(descriptionElement);
82 document.getElementById("results").appendChild(document.createElement('br')) ;
83 }
84
85 function verifyDrawText(canvasId, resultId, text, expectedDirection)
86 {
87 var canvasElement = document.getElementById(canvasId); 60 var canvasElement = document.getElementById(canvasId);
88 var resultElement = document.getElementById(resultId);
89 var ctx = canvasElement.getContext('2d'); 61 var ctx = canvasElement.getContext('2d');
90 var width = canvasElement.width/2; 62 var width = canvasElement.width/2;
91 var height = canvasElement.height; 63 var height = canvasElement.height;
92 resultElement.textContent = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL'; 64 assert_equals(ctx.direction, expectedDirection);
93 resultElement.className = (ctx.direction == expectedDirection) ? 'pass' : 'f ail';
94 ctx.moveTo(width, 0); 65 ctx.moveTo(width, 0);
95 ctx.lineTo(width, height); 66 ctx.lineTo(width, height);
96 ctx.stroke(); 67 ctx.stroke();
97 ctx.font = fontSettings; 68 ctx.font = fontSettings;
98 ctx.fillText(text, width, height/2); 69 ctx.fillText(text, width, height/2);
99 } 70 }
100 71
101 function verifyDrawTextWithSpecifiedDirection(canvasId, resultId, text, directio n, expectedDirection) 72 function verifyDrawTextWithSpecifiedDirection(testItem)
102 { 73 {
103 var canvasElement = document.getElementById(canvasId); 74 console.log(testItem);
104 var resultElement = document.getElementById(resultId); 75 var canvasElement = document.getElementById(testItem['canvasId']);
105 var ctx = canvasElement.getContext('2d'); 76 var ctx = canvasElement.getContext('2d');
106 var width = canvasElement.width/2; 77 var width = canvasElement.width/2;
107 var height = canvasElement.height; 78 var height = canvasElement.height;
108 var currentDirection = ctx.direction; 79 var currentDirection = ctx.direction;
109 ctx.direction = direction; 80 ctx.direction = testItem['direction'];
110 resultElement.textContent = (currentDirection && (ctx.direction == expectedD irection)) ? 'PASS' : 'FAIL'; 81 assert_not_equals(currentDirection, null);
111 resultElement.className = (currentDirection && (ctx.direction == expectedDir ection)) ? 'pass' : 'fail'; 82 assert_equals(ctx.direction, testItem['expectedDirection']);
112 ctx.moveTo(width, 0); 83 ctx.moveTo(width, 0);
113 ctx.lineTo(width, height); 84 ctx.lineTo(width, height);
114 ctx.stroke(); 85 ctx.stroke();
115 ctx.font = fontSettings; 86 ctx.font = fontSettings;
116 ctx.fillText(text, width, height/2); 87 ctx.fillText(testItem['text'], width, height/2);
117 } 88 }
118 89
119 function verifyDirectionAfterReset(canvasId, text, direction, expectedDirection) 90 function verifyDirectionAfterReset(testItem)
120 { 91 {
121 var canvasElement = document.getElementById(canvasId); 92 var canvasElement = document.getElementById(testItem['canvasId']);
122 var width = canvasElement.width/2; 93 var width = canvasElement.width/2;
123 var height = canvasElement.height; 94 var height = canvasElement.height;
124 var ctx = canvasElement.getContext('2d'); 95 var ctx = canvasElement.getContext('2d');
125 ctx.direction = direction; 96 ctx.direction = testItem['direction'];
126 ctx.moveTo(width, 0); 97 ctx.moveTo(width, 0);
127 ctx.lineTo(width, height); 98 ctx.lineTo(width, height);
128 ctx.stroke(); 99 ctx.stroke();
129 ctx.font = fontSettings; 100 ctx.font = fontSettings;
130 ctx.fillText(text, width, height/2); 101 ctx.fillText(testItem['text'], width, height/2);
131 canvasElement.width = canvasElement.width + 1; 102 canvasElement.width = canvasElement.width + 1;
132 var description = 'Tests that context.reset() sets the context.direction to ' + expectedDirection + ': '; 103 assert_equals(ctx.direction, testItem['expectedDirection']);
133 var result = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL';
134 appendResult(description, result);
135 document.body.removeChild(canvasElement.parentElement); 104 document.body.removeChild(canvasElement.parentElement);
136 } 105 }
137 106
138 function verifyDirectionAfterAttributeChange(canvasId, resultId, text, newDirect ion, forParentElement) 107 function verifyDirectionAfterAttributeChange(testItem)
139 { 108 {
140 var canvasElement = document.getElementById(canvasId); 109 var canvasElement = document.getElementById(testItem['canvasId']);
141 var resultElement = document.getElementById(resultId);
142 var ctx = canvasElement.getContext('2d'); 110 var ctx = canvasElement.getContext('2d');
143 var width = canvasElement.width/2; 111 var width = canvasElement.width/2;
144 var height = canvasElement.height; 112 var height = canvasElement.height;
145 113
146 if (forParentElement) 114 if (testItem['forParentElement'])
147 canvasElement.parentElement.dir = newDirection; 115 canvasElement.parentElement.dir = testItem['newDirection'];
148 else 116 else
149 canvasElement.dir = newDirection; 117 canvasElement.dir = testItem['newDirection'];
150 resultElement.textContent = ctx.direction == newDirection ? 'PASS' : 'FAIL'; 118 assert_equals(ctx.direction, testItem['newDirection']);
151 resultElement.className = ctx.direction == newDirection ? 'pass' : 'fail';
152 ctx.moveTo(width, 0); 119 ctx.moveTo(width, 0);
153 ctx.lineTo(width, height); 120 ctx.lineTo(width, height);
154 ctx.stroke(); 121 ctx.stroke();
155 ctx.font = fontSettings; 122 ctx.font = fontSettings;
156 ctx.fillText(text, width, height/2); 123 ctx.fillText(testItem['text'], width, height/2);
157 } 124 }
158 125
159 function verifyDirectionAcrossSaveRestores(canvasId, resultId, testVector) 126 function verifyDirectionAcrossSaveRestores(canvasId, testVector)
160 { 127 {
161 var canvasElement = document.getElementById(canvasId); 128 var canvasElement = document.getElementById(canvasId);
162 var resultElement = document.getElementById(resultId);
163 var ctx = canvasElement.getContext('2d'); 129 var ctx = canvasElement.getContext('2d');
164 var width = canvasElement.width/2; 130 var width = canvasElement.width/2;
165 var height = 0; 131 var height = 0;
166 ctx.moveTo(width, 0); 132 ctx.moveTo(width, 0);
167 ctx.lineTo(width, canvasElement.height); 133 ctx.lineTo(width, canvasElement.height);
168 ctx.stroke(); 134 ctx.stroke();
169 ctx.font = fontSettings; 135 ctx.font = fontSettings;
170 var testVectorLength = testVector.length; 136 var testVectorLength = testVector.length;
171 var i = 0; 137 var i = 0;
172 for (; i < testVector.length; ++i) { 138 for (; i < testVector.length; ++i) {
173 height += 20; 139 height += 20;
174 ctx.direction = testVector[i].direction; 140 ctx.direction = testVector[i].direction;
175 ctx.fillText(testVector[i].text, width, height); 141 ctx.fillText(testVector[i].text, width, height);
176 if (i != testVectorLength - 1) 142 if (i != testVectorLength - 1)
177 ctx.save(); 143 ctx.save();
178 } 144 }
179 var validDirectionCount = 0; 145 var validDirectionCount = 0;
180 for (--i; i > 0; --i) { 146 for (--i; i > 0; --i) {
181 ctx.restore(); 147 ctx.restore();
182 if (ctx.direction == testVector[i - 1].direction) 148 if (ctx.direction == testVector[i - 1].direction)
183 validDirectionCount++; 149 validDirectionCount++;
184 } 150 }
185 resultElement.textContent = validDirectionCount == testVectorLength - 1 ? 'P ASS' : 'FAIL'; 151 assert_equals(validDirectionCount, testVectorLength - 1);
186 resultElement.className = validDirectionCount == testVectorLength - 1 ? 'pas s' : 'fail';
187 } 152 }
188 153
189 function verifyInvalidDirection(direction) 154 function verifyInvalidDirection(direction)
190 { 155 {
191 var ctx = document.createElement('canvas').getContext('2d'); 156 var ctx = document.createElement('canvas').getContext('2d');
192 var currentDirection = ctx.direction; 157 var currentDirection = ctx.direction;
193 ctx.direction = direction; 158 ctx.direction = direction;
194 var description = 'Tests that invalid direction value ' + direction + ' has no effect on the context.direction: '; 159 assert_equals(ctx.direction, currentDirection);
195 var result = (ctx.direction == currentDirection) ? 'PASS' : 'FAIL';
196 appendResult(description, result);
197 } 160 }
198 161
199 verifyDrawText('canvas1', 'result1', 'Left-to-Right text', 'ltr'); 162 test(function(t) {
200 verifyDrawText('canvas2', 'result2', 'Right-to-Left text', 'rtl');
201 163
202 verifyDrawTextWithSpecifiedDirection('canvas3', 'result3', 'Right-to-Left text', 'rtl', 'rtl'); 164 var newCanvasElement = document.createElement('canvas');
203 verifyDrawTextWithSpecifiedDirection('canvas4', 'result4', 'Left-to-Right text', 'ltr', 'ltr'); 165 assert_not_equals(newCanvasElement.getContext('2d').direction, null);
204 verifyDrawTextWithSpecifiedDirection('canvas5', 'result5', 'Left-to-Right text', 'inherit', 'ltr'); 166
205 verifyDrawTextWithSpecifiedDirection('canvas6', 'result6', 'Right-to-Left text', 'inherit', 'rtl'); 167 var drawTextTests = [
168 ['DrawTextTest1', 'canvas1', 'Left-to-Right text', 'ltr'],
169 ['DrawTextTest2', 'canvas2', 'Right-to-Left text', 'rtl'],
170 ];
171 generate_tests(verifyDrawText, drawTextTests);
172
173 var drawTextWithSpecifiedDirectionTests = [
174 ['DrawTextWithSpecifiedDirectionTest1',
Justin Novosad 2017/02/14 20:22:04 This form is excellent. Very readable, well organi
zakerinasab 2017/02/15 14:53:02 Acknowledged.
175 {canvasId: 'canvas3', text: 'Right-to-Left text', direction: 'rtl', exp ectedDirection: 'rtl'}],
176 ['DrawTextWithSpecifiedDirectionTest2',
177 {canvasId: 'canvas4', text: 'Left-to-Right text', direction: 'ltr', exp ectedDirection: 'ltr'}],
178 ['DrawTextWithSpecifiedDirectionTest3',
179 {canvasId: 'canvas5', text: 'Left-to-Right text', direction: 'inherit', expectedDirection: 'ltr'}],
180 ['DrawTextWithSpecifiedDirectionTest4',
181 {canvasId: 'canvas6', text: 'Right-to-Left text', direction: 'inherit', expectedDirection: 'rtl'}],
182 ];
183 generate_tests(verifyDrawTextWithSpecifiedDirection, drawTextWithSpecifiedDi rectionTests);
184
185 var directionAfterResetTests = [
186 ['DirectionAfterResetTest1',
187 {canvasId: 'canvas7', text: 'Right-to-Left', direction: 'rtl', expected Direction: 'ltr'}],
188 ['DirectionAfterResetTest2',
189 {canvasId: 'canvas8', text: 'Right-to-Left', direction: 'ltr', expected Direction: 'rtl'}],
190 ];
191 generate_tests(verifyDirectionAfterReset, directionAfterResetTests);
192
193 var directionAfterAttributeChangeTests = [
194 ['DirectionAfterResetTest1',
195 {canvasId: 'canvas9', text: 'Right-to-Left text', newDirection: 'rtl', forParentElement: true}],
196 ['DirectionAfterResetTest2',
197 {canvasId: 'canvas10', text: 'Left-to-Right text', newDirection: 'ltr', forParentElement: false}],
198 ];
199 generate_tests(verifyDirectionAfterAttributeChange, directionAfterAttributeC hangeTests);
200
201 verifyDirectionAcrossSaveRestores('canvas11',
202 [{ text: 'Left-to-Right text', direction: 'ltr' },
203 { text: 'Right-to-Left text', direction: 'rtl' },
204 { text: 'Right-to-Left text', direction: 'rtl' },
205 { text: 'Left-to-Right text', direction: 'ltr' },
206 { text: 'Right-to-Left text', direction: 'rtl' },
207 { text: 'Right-to-Left text', direction: 'rtl' }]);
208 var invalidDirectionTests = [
209 ['InvalidDirectionTestRTL', 'RTL'],
210 ['InvalidDirectionTestLTR', 'LTR'],
211 ['InvalidDirectionTestINHERIT', 'INHERIT'],
212 ];
213 generate_tests(verifyInvalidDirection, invalidDirectionTests);
206 214
207 verifyDirectionAfterReset('canvas7', 'Right-to-Left', 'rtl', 'ltr'); 215 }, "Verify that canvas 2d context supports 'direction' attribute.");
208 verifyDirectionAfterReset('canvas8', 'Right-to-Left', 'ltr', 'rtl');
209
210 verifyDirectionAfterAttributeChange('canvas9', 'result9', 'Right-to-Left text', 'rtl', true);
211 verifyDirectionAfterAttributeChange('canvas10', 'result10', 'Left-to-Right text' , 'ltr', false);
212
213 verifyDirectionAcrossSaveRestores('canvas11',
214 'result11',
215 [{ text: 'Left-to-Right text', direction: 'ltr ' },
216 { text: 'Right-to-Left text', direction: 'rtl ' },
217 { text: 'Right-to-Left text', direction: 'rtl ' },
218 { text: 'Left-to-Right text', direction: 'ltr ' },
219 { text: 'Right-to-Left text', direction: 'rtl ' },
220 { text: 'Right-to-Left text', direction: 'rtl ' }]);
221
222 verifyInvalidDirection('RTL');
223 verifyInvalidDirection('LTR');
224 verifyInvalidDirection('INHERIT');
225 </script> 216 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698