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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 468483003: Implement canvas2d direction attribute (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 3 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 | LayoutTests/fast/canvas/canvas-direction-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <html>
2 <head>
3 <style>
4 .pass {
5 color: green;
6 font-weight: bold;
7 }
8
9 .fail {
10 color: red;
11 font-weight: bold;
12 }
13 </style>
14 </head>
15 <body>
16 <span>Tests that canvas 2d context supports 'direction' attribute: <span id="sup ported"></span></span>
17 <div>
18 <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 >
20 </div>
21 <div dir="rtl">
22 <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 >
24 </div>
25 <div>
26 <span>Tests that context.direction is overridden by 'rtl' with parent element ha ving unspecified direction: <span id="result3"></span></span><br>
27 <canvas id="canvas3" width=400 height=20 style="border:1px solid black"></canvas >
28 </div>
29 <div dir="rtl">
30 <span>Tests that context.direction is overridden by 'ltr' with parent element ha ving direction as rtl: <span id="result4"></span></span><br>
31 <canvas id="canvas4" width=400 height=20 style="border:1px solid black"></canvas >
32 </div>
33 <div>
34 <span>Tests that context.direction is overridden by 'inherit' with parent elemen t having unspecified direction: <span id="result5"></span></span><br>
35 <canvas id="canvas5" width=400 height=20 style="border:1px solid black"></canvas >
36 </div>
37 <div dir="rtl">
38 <span>Tests that context.direction is overridden by 'inherit' with parent elemen t having direction as rtl: <span id="result6"></span></span><br>
39 <canvas id="canvas6" width=400 height=20 style="border:1px solid black"></canvas >
40 </div>
41 <div>
42 <span>Tests that context.reset sets the direction as ltr<span id="result7"></spa n></span><br>
43 <canvas id="canvas7" width=400 height=20 style="border:1px solid black"></canvas >
44 </div>
45 <div dir="rtl">
46 <span>Tests that context.reset sets the direction as rtl<span id="result8"></spa n></span><br>
47 <canvas id="canvas8" width=400 height=20 style="border:1px solid black"></canvas >
48 </div>
49 <div>
50 <span>Tests that change in element's dir attribute is reflected in context.direc tion as rtl: <span id="result9"></span></span><br>
51 <canvas id="canvas9" width=400 height=20 style="border:1px solid black"></canvas >
52 </div>
53 <div dir="rtl">
54 <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>
56 </div>
57 <div>
58 <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>
60 </div>
61 <div id="results">
62 </div>
63 <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'";
72
73 function appendResult(description, result)
74 {
75 var descriptionElement = document.createElement('span');
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);
88 var resultElement = document.getElementById(resultId);
89 var ctx = canvasElement.getContext('2d');
90 var width = canvasElement.width/2;
91 var height = canvasElement.height;
92 resultElement.textContent = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL';
93 resultElement.className = (ctx.direction == expectedDirection) ? 'pass' : 'f ail';
94 ctx.moveTo(width, 0);
95 ctx.lineTo(width, height);
96 ctx.stroke();
97 ctx.font = fontSettings;
98 ctx.fillText(text, width, height/2);
99 }
100
101 function verifyDrawTextWithSpecifiedDirection(canvasId, resultId, text, directio n, expectedDirection)
102 {
103 var canvasElement = document.getElementById(canvasId);
104 var resultElement = document.getElementById(resultId);
105 var ctx = canvasElement.getContext('2d');
106 var width = canvasElement.width/2;
107 var height = canvasElement.height;
108 var currentDirection = ctx.direction;
109 ctx.direction = direction;
110 resultElement.textContent = (currentDirection && (ctx.direction == expectedD irection)) ? 'PASS' : 'FAIL';
111 resultElement.className = (currentDirection && (ctx.direction == expectedDir ection)) ? 'pass' : 'fail';
112 ctx.moveTo(width, 0);
113 ctx.lineTo(width, height);
114 ctx.stroke();
115 ctx.font = fontSettings;
116 ctx.fillText(text, width, height/2);
117 }
118
119 function verifyDirectionAfterReset(canvasId, text, direction, expectedDirection)
120 {
121 var canvasElement = document.getElementById(canvasId);
122 var width = canvasElement.width/2;
123 var height = canvasElement.height;
124 var ctx = canvasElement.getContext('2d');
125 ctx.direction = direction;
126 ctx.moveTo(width, 0);
127 ctx.lineTo(width, height);
128 ctx.stroke();
129 ctx.font = fontSettings;
130 ctx.fillText(text, width, height/2);
131 canvasElement.width = canvasElement.width + 1;
132 var description = 'Tests that context.reset() sets the context.direction to ' + expectedDirection + ': ';
133 var result = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL';
134 appendResult(description, result);
135 document.body.removeChild(canvasElement.parentElement);
136 }
137
138 function verifyDirectionAfterAttributeChange(canvasId, resultId, text, newDirect ion, forParentElement)
139 {
140 var canvasElement = document.getElementById(canvasId);
141 var resultElement = document.getElementById(resultId);
142 var ctx = canvasElement.getContext('2d');
143 var width = canvasElement.width/2;
144 var height = canvasElement.height;
145
146 if (forParentElement)
147 canvasElement.parentElement.dir = newDirection;
148 else
149 canvasElement.dir = newDirection;
150 resultElement.textContent = ctx.direction == newDirection ? 'PASS' : 'FAIL';
151 resultElement.className = ctx.direction == newDirection ? 'pass' : 'fail';
152 ctx.moveTo(width, 0);
153 ctx.lineTo(width, height);
154 ctx.stroke();
155 ctx.font = fontSettings;
156 ctx.fillText(text, width, height/2);
157 }
158
159 function verifyDirectionAcrossSaveRestores(canvasId, resultId, testVector)
160 {
161 var canvasElement = document.getElementById(canvasId);
162 var resultElement = document.getElementById(resultId);
163 var ctx = canvasElement.getContext('2d');
164 var width = canvasElement.width/2;
165 var height = 0;
166 ctx.moveTo(width, 0);
167 ctx.lineTo(width, canvasElement.height);
168 ctx.stroke();
169 ctx.font = fontSettings;
170 var testVectorLength = testVector.length;
171 var i = 0;
172 for (; i < testVector.length; ++i) {
173 height += 20;
174 ctx.direction = testVector[i].direction;
175 ctx.fillText(testVector[i].text, width, height);
176 if (i != testVectorLength - 1)
177 ctx.save();
178 }
179 var validDirectionCount = 0;
180 for (--i; i > 0; --i) {
181 ctx.restore();
182 if (ctx.direction == testVector[i - 1].direction)
183 validDirectionCount++;
184 }
185 resultElement.textContent = validDirectionCount == testVectorLength - 1 ? 'P ASS' : 'FAIL';
186 resultElement.className = validDirectionCount == testVectorLength - 1 ? 'pas s' : 'fail';
187 }
188
189 function verifyInvalidDirection(direction)
190 {
191 var ctx = document.createElement('canvas').getContext('2d');
192 var currentDirection = ctx.direction;
193 ctx.direction = direction;
194 var description = 'Tests that invalid direction value ' + direction + ' has no effect on the context.direction: ';
195 var result = (ctx.direction == currentDirection) ? 'PASS' : 'FAIL';
196 appendResult(description, result);
197 }
198
199 verifyDrawText('canvas1', 'result1', 'Left-to-Right text', 'ltr');
200 verifyDrawText('canvas2', 'result2', 'Right-to-Left text', 'rtl');
201
202 verifyDrawTextWithSpecifiedDirection('canvas3', 'result3', 'Right-to-Left text', 'rtl', 'rtl');
203 verifyDrawTextWithSpecifiedDirection('canvas4', 'result4', 'Left-to-Right text', 'ltr', 'ltr');
204 verifyDrawTextWithSpecifiedDirection('canvas5', 'result5', 'Left-to-Right text', 'inherit', 'ltr');
205 verifyDrawTextWithSpecifiedDirection('canvas6', 'result6', 'Right-to-Left text', 'inherit', 'rtl');
206
207 verifyDirectionAfterReset('canvas7', 'Right-to-Left', 'rtl', 'ltr');
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>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/canvas/canvas-direction-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698