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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified 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, 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | LayoutTests/fast/canvas/canvas-direction-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/canvas/canvas-direction.html
diff --git a/LayoutTests/fast/canvas/canvas-direction.html b/LayoutTests/fast/canvas/canvas-direction.html
new file mode 100644
index 0000000000000000000000000000000000000000..bf576b2c22c41326411202c2919ff88549516624
--- /dev/null
+++ b/LayoutTests/fast/canvas/canvas-direction.html
@@ -0,0 +1,225 @@
+<html>
+<head>
+<style>
+.pass {
+ color: green;
+ font-weight: bold;
+}
+
+.fail {
+ color: red;
+ font-weight: bold;
+}
+</style>
+</head>
+<body>
+<span>Tests that canvas 2d context supports 'direction' attribute: <span id="supported"></span></span>
+<div>
+<span>Tests that context.direction is 'ltr' with parent element having unspecified direction: <span id="result1"></span></span><br>
+<canvas id="canvas1" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div dir="rtl">
+<span>Tests that context.direction is 'rtl' with parent element having direction as rtl: <span id="result2"></span></span><br>
+<canvas id="canvas2" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div>
+<span>Tests that context.direction is overridden by 'rtl' with parent element having unspecified direction: <span id="result3"></span></span><br>
+<canvas id="canvas3" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div dir="rtl">
+<span>Tests that context.direction is overridden by 'ltr' with parent element having direction as rtl: <span id="result4"></span></span><br>
+<canvas id="canvas4" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div>
+<span>Tests that context.direction is overridden by 'inherit' with parent element having unspecified direction: <span id="result5"></span></span><br>
+<canvas id="canvas5" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div dir="rtl">
+<span>Tests that context.direction is overridden by 'inherit' with parent element having direction as rtl: <span id="result6"></span></span><br>
+<canvas id="canvas6" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div>
+<span>Tests that context.reset sets the direction as ltr<span id="result7"></span></span><br>
+<canvas id="canvas7" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div dir="rtl">
+<span>Tests that context.reset sets the direction as rtl<span id="result8"></span></span><br>
+<canvas id="canvas8" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div>
+<span>Tests that change in element's dir attribute is reflected in context.direction as rtl: <span id="result9"></span></span><br>
+<canvas id="canvas9" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div dir="rtl">
+<span>Tests that change in element's dir attribute is reflected in context.direction as ltr: <span id="result10"></span></span><br>
+<canvas id="canvas10" width=400 height=20 style="border:1px solid black"></canvas>
+</div>
+<div>
+<span>Tests that context.direction reflects the valid direction after save/restore context operations: <span id="result11"></span></span><br>
+<canvas id="canvas11" style="border:1px solid black"></canvas>
+</div>
+<div id="results">
+</div>
+<script>
+if (window.testRunner)
+ testRunner.dumpAsText();
+
+var newCanvasElement = document.createElement('canvas');
+document.getElementById('supported').textContent = newCanvasElement.getContext('2d').direction ? 'PASS' : 'FAIL';
+document.getElementById('supported').className = newCanvasElement.getContext('2d').direction ? 'pass' : 'fail';
+
+var fontSettings = "12px 'Arial'";
+
+function appendResult(description, result)
+{
+ var descriptionElement = document.createElement('span');
+ var resultElement = document.createElement('span');
+ descriptionElement.innerHTML = description;
+ resultElement.textContent = result;
+ resultElement.className = (result === 'PASS') ? 'pass' : 'fail';
+ descriptionElement.appendChild(resultElement);
+ document.getElementById("results").appendChild(descriptionElement);
+ document.getElementById("results").appendChild(document.createElement('br'));
+}
+
+function verifyDrawText(canvasId, resultId, text, expectedDirection)
+{
+ var canvasElement = document.getElementById(canvasId);
+ var resultElement = document.getElementById(resultId);
+ var ctx = canvasElement.getContext('2d');
+ var width = canvasElement.width/2;
+ var height = canvasElement.height;
+ resultElement.textContent = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL';
+ resultElement.className = (ctx.direction == expectedDirection) ? 'pass' : 'fail';
+ ctx.moveTo(width, 0);
+ ctx.lineTo(width, height);
+ ctx.stroke();
+ ctx.font = fontSettings;
+ ctx.fillText(text, width, height/2);
+}
+
+function verifyDrawTextWithSpecifiedDirection(canvasId, resultId, text, direction, expectedDirection)
+{
+ var canvasElement = document.getElementById(canvasId);
+ var resultElement = document.getElementById(resultId);
+ var ctx = canvasElement.getContext('2d');
+ var width = canvasElement.width/2;
+ var height = canvasElement.height;
+ var currentDirection = ctx.direction;
+ ctx.direction = direction;
+ resultElement.textContent = (currentDirection && (ctx.direction == expectedDirection)) ? 'PASS' : 'FAIL';
+ resultElement.className = (currentDirection && (ctx.direction == expectedDirection)) ? 'pass' : 'fail';
+ ctx.moveTo(width, 0);
+ ctx.lineTo(width, height);
+ ctx.stroke();
+ ctx.font = fontSettings;
+ ctx.fillText(text, width, height/2);
+}
+
+function verifyDirectionAfterReset(canvasId, text, direction, expectedDirection)
+{
+ var canvasElement = document.getElementById(canvasId);
+ var width = canvasElement.width/2;
+ var height = canvasElement.height;
+ var ctx = canvasElement.getContext('2d');
+ ctx.direction = direction;
+ ctx.moveTo(width, 0);
+ ctx.lineTo(width, height);
+ ctx.stroke();
+ ctx.font = fontSettings;
+ ctx.fillText(text, width, height/2);
+ canvasElement.width = canvasElement.width + 1;
+ var description = 'Tests that context.reset() sets the context.direction to ' + expectedDirection + ': ';
+ var result = (ctx.direction == expectedDirection) ? 'PASS' : 'FAIL';
+ appendResult(description, result);
+ document.body.removeChild(canvasElement.parentElement);
+}
+
+function verifyDirectionAfterAttributeChange(canvasId, resultId, text, newDirection, forParentElement)
+{
+ var canvasElement = document.getElementById(canvasId);
+ var resultElement = document.getElementById(resultId);
+ var ctx = canvasElement.getContext('2d');
+ var width = canvasElement.width/2;
+ var height = canvasElement.height;
+
+ if (forParentElement)
+ canvasElement.parentElement.dir = newDirection;
+ else
+ canvasElement.dir = newDirection;
+ resultElement.textContent = ctx.direction == newDirection ? 'PASS' : 'FAIL';
+ resultElement.className = ctx.direction == newDirection ? 'pass' : 'fail';
+ ctx.moveTo(width, 0);
+ ctx.lineTo(width, height);
+ ctx.stroke();
+ ctx.font = fontSettings;
+ ctx.fillText(text, width, height/2);
+}
+
+function verifyDirectionAcrossSaveRestores(canvasId, resultId, testVector)
+{
+ var canvasElement = document.getElementById(canvasId);
+ var resultElement = document.getElementById(resultId);
+ var ctx = canvasElement.getContext('2d');
+ var width = canvasElement.width/2;
+ var height = 0;
+ ctx.moveTo(width, 0);
+ ctx.lineTo(width, canvasElement.height);
+ ctx.stroke();
+ ctx.font = fontSettings;
+ var testVectorLength = testVector.length;
+ var i = 0;
+ for (; i < testVector.length; ++i) {
+ height += 20;
+ ctx.direction = testVector[i].direction;
+ ctx.fillText(testVector[i].text, width, height);
+ if (i != testVectorLength - 1)
+ ctx.save();
+ }
+ var validDirectionCount = 0;
+ for (--i; i > 0; --i) {
+ ctx.restore();
+ if (ctx.direction == testVector[i - 1].direction)
+ validDirectionCount++;
+ }
+ resultElement.textContent = validDirectionCount == testVectorLength - 1 ? 'PASS' : 'FAIL';
+ resultElement.className = validDirectionCount == testVectorLength - 1 ? 'pass' : 'fail';
+}
+
+function verifyInvalidDirection(direction)
+{
+ var ctx = document.createElement('canvas').getContext('2d');
+ var currentDirection = ctx.direction;
+ ctx.direction = direction;
+ var description = 'Tests that invalid direction value ' + direction + ' has no effect on the context.direction: ';
+ var result = (ctx.direction == currentDirection) ? 'PASS' : 'FAIL';
+ appendResult(description, result);
+}
+
+verifyDrawText('canvas1', 'result1', 'Left-to-Right text', 'ltr');
+verifyDrawText('canvas2', 'result2', 'Right-to-Left text', 'rtl');
+
+verifyDrawTextWithSpecifiedDirection('canvas3', 'result3', 'Right-to-Left text', 'rtl', 'rtl');
+verifyDrawTextWithSpecifiedDirection('canvas4', 'result4', 'Left-to-Right text', 'ltr', 'ltr');
+verifyDrawTextWithSpecifiedDirection('canvas5', 'result5', 'Left-to-Right text', 'inherit', 'ltr');
+verifyDrawTextWithSpecifiedDirection('canvas6', 'result6', 'Right-to-Left text', 'inherit', 'rtl');
+
+verifyDirectionAfterReset('canvas7', 'Right-to-Left', 'rtl', 'ltr');
+verifyDirectionAfterReset('canvas8', 'Right-to-Left', 'ltr', 'rtl');
+
+verifyDirectionAfterAttributeChange('canvas9', 'result9', 'Right-to-Left text', 'rtl', true);
+verifyDirectionAfterAttributeChange('canvas10', 'result10', 'Left-to-Right text', 'ltr', false);
+
+verifyDirectionAcrossSaveRestores('canvas11',
+ 'result11',
+ [{ text: 'Left-to-Right text', direction: 'ltr' },
+ { text: 'Right-to-Left text', direction: 'rtl' },
+ { text: 'Right-to-Left text', direction: 'rtl' },
+ { text: 'Left-to-Right text', direction: 'ltr' },
+ { text: 'Right-to-Left text', direction: 'rtl' },
+ { text: 'Right-to-Left text', direction: 'rtl' }]);
+
+verifyInvalidDirection('RTL');
+verifyInvalidDirection('LTR');
+verifyInvalidDirection('INHERIT');
+</script>
« 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