Update web-platform-tests to revision ea852ede3b4e0632fd453ed520b26b22692c2d92

This commit is contained in:
WPT Sync Bot 2019-06-08 10:25:33 +00:00
parent 2ab23c79a7
commit 92fa6ede85
109 changed files with 2169 additions and 873 deletions

View file

@ -256,7 +256,7 @@ jobs:
- template: tools/ci/azure/install_edge.yml
- template: tools/ci/azure/update_hosts.yml
- template: tools/ci/azure/update_manifest.yml
- script: python ./wpt run --yes --no-manifest-update --no-restart-on-unexpected --no-fail-on-unexpected --install-fonts --this-chunk $(System.JobPositionInPhase) --total-chunks $(System.TotalJobsInPhase) --chunk-type hash --log-tbpl - --log-tbpl-level info --log-wptreport $(Build.ArtifactStagingDirectory)/wpt_report_$(System.JobPositionInPhase).json --log-wptscreenshot $(Build.ArtifactStagingDirectory)/wpt_screenshot_$(System.JobPositionInPhase).txt edgechromium
- script: python ./wpt run --yes --no-manifest-update --no-restart-on-unexpected --no-fail-on-unexpected --install-fonts --this-chunk $(System.JobPositionInPhase) --total-chunks $(System.TotalJobsInPhase) --chunk-type hash --log-tbpl - --log-tbpl-level info --log-wptreport $(Build.ArtifactStagingDirectory)/wpt_report_$(System.JobPositionInPhase).json --log-wptscreenshot $(Build.ArtifactStagingDirectory)/wpt_screenshot_$(System.JobPositionInPhase).txt --channel dev edgechromium
displayName: 'Run tests (Edge Dev)'
- task: PublishBuildArtifacts@1
displayName: 'Publish results'
@ -270,7 +270,9 @@ jobs:
- job: results_safari
displayName: 'all tests (Safari)'
condition: eq(variables['Build.Reason'], 'Schedule')
condition: |
or(eq(variables['Build.Reason'], 'Schedule'),
and(eq(variables['Build.Reason'], 'Manual'), variables['run_all_safari']))
strategy:
parallel: 4 # chosen to make runtime ~2h
timeoutInMinutes: 360

View file

@ -27,23 +27,27 @@ var t = async_test("Testing actualBoundingBox");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxLeft)", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('A').actualBoundingBoxRight >= 50, "ctx.measureText('A').actualBoundingBoxRight >= 50");
_assert(ctx.measureText('A').actualBoundingBoxAscent >= 35, "ctx.measureText('A').actualBoundingBoxAscent >= 35");
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxDescent), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxDescent)", "0");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxLeft)", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('A').actualBoundingBoxRight >= 50, "ctx.measureText('A').actualBoundingBoxRight >= 50");
_assert(ctx.measureText('A').actualBoundingBoxAscent >= 35, "ctx.measureText('A').actualBoundingBoxAscent >= 35");
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxDescent), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxDescent)", "0");
_assertSame(Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft)", "0");
_assert(ctx.measureText('ABCD').actualBoundingBoxRight >= 200, "ctx.measureText('ABCD').actualBoundingBoxRight >= 200");
_assert(ctx.measureText('ABCD').actualBoundingBoxAscent >= 85, "ctx.measureText('ABCD').actualBoundingBoxAscent >= 85");
_assert(ctx.measureText('ABCD').actualBoundingBoxDescent >= 37, "ctx.measureText('ABCD').actualBoundingBoxDescent >= 37");
}), 500);
_assertSame(Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft)", "0");
_assert(ctx.measureText('ABCD').actualBoundingBoxRight >= 200, "ctx.measureText('ABCD').actualBoundingBoxRight >= 200");
_assert(ctx.measureText('ABCD').actualBoundingBoxAscent >= 85, "ctx.measureText('ABCD').actualBoundingBoxAscent >= 85");
_assert(ctx.measureText('ABCD').actualBoundingBoxDescent >= 37, "ctx.measureText('ABCD').actualBoundingBoxDescent >= 37");
}), 500);
});
});

View file

@ -27,25 +27,29 @@ var t = async_test("Testing width advances");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('Hello').advances[0]), 0, "Math.abs(ctx.measureText('Hello').advances[\""+(0)+"\"])", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('Hello').advances[1] >= 36, "ctx.measureText('Hello').advances[\""+(1)+"\"] >= 36");
_assert(ctx.measureText('Hello').advances[2] >= 58, "ctx.measureText('Hello').advances[\""+(2)+"\"] >= 58");
_assert(ctx.measureText('Hello').advances[3] >= 70, "ctx.measureText('Hello').advances[\""+(3)+"\"] >= 70");
_assert(ctx.measureText('Hello').advances[4] >= 80, "ctx.measureText('Hello').advances[\""+(4)+"\"] >= 80");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('Hello').advances[0]), 0, "Math.abs(ctx.measureText('Hello').advances[\""+(0)+"\"])", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('Hello').advances[1] >= 36, "ctx.measureText('Hello').advances[\""+(1)+"\"] >= 36");
_assert(ctx.measureText('Hello').advances[2] >= 58, "ctx.measureText('Hello').advances[\""+(2)+"\"] >= 58");
_assert(ctx.measureText('Hello').advances[3] >= 70, "ctx.measureText('Hello').advances[\""+(3)+"\"] >= 70");
_assert(ctx.measureText('Hello').advances[4] >= 80, "ctx.measureText('Hello').advances[\""+(4)+"\"] >= 80");
var tm = ctx.measureText('Hello');
_assertSame(ctx.measureText('Hello').advances[0], tm.advances[0], "ctx.measureText('Hello').advances[\""+(0)+"\"]", "tm.advances[\""+(0)+"\"]");
_assertSame(ctx.measureText('Hello').advances[1], tm.advances[1], "ctx.measureText('Hello').advances[\""+(1)+"\"]", "tm.advances[\""+(1)+"\"]");
_assertSame(ctx.measureText('Hello').advances[2], tm.advances[2], "ctx.measureText('Hello').advances[\""+(2)+"\"]", "tm.advances[\""+(2)+"\"]");
_assertSame(ctx.measureText('Hello').advances[3], tm.advances[3], "ctx.measureText('Hello').advances[\""+(3)+"\"]", "tm.advances[\""+(3)+"\"]");
_assertSame(ctx.measureText('Hello').advances[4], tm.advances[4], "ctx.measureText('Hello').advances[\""+(4)+"\"]", "tm.advances[\""+(4)+"\"]");
}), 500);
var tm = ctx.measureText('Hello');
_assertSame(ctx.measureText('Hello').advances[0], tm.advances[0], "ctx.measureText('Hello').advances[\""+(0)+"\"]", "tm.advances[\""+(0)+"\"]");
_assertSame(ctx.measureText('Hello').advances[1], tm.advances[1], "ctx.measureText('Hello').advances[\""+(1)+"\"]", "tm.advances[\""+(1)+"\"]");
_assertSame(ctx.measureText('Hello').advances[2], tm.advances[2], "ctx.measureText('Hello').advances[\""+(2)+"\"]", "tm.advances[\""+(2)+"\"]");
_assertSame(ctx.measureText('Hello').advances[3], tm.advances[3], "ctx.measureText('Hello').advances[\""+(3)+"\"]", "tm.advances[\""+(3)+"\"]");
_assertSame(ctx.measureText('Hello').advances[4], tm.advances[4], "ctx.measureText('Hello').advances[\""+(4)+"\"]", "tm.advances[\""+(4)+"\"]");
}), 500);
});
});

View file

@ -27,18 +27,22 @@ var t = async_test("Testing baselines");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(Math.abs(ctx.measureText('A').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('A').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('A').getBaselines().ideographic, -39, "ctx.measureText('A').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('A').getBaselines().hanging, 68, "ctx.measureText('A').getBaselines().hanging", "68");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(Math.abs(ctx.measureText('A').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('A').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('A').getBaselines().ideographic, -39, "ctx.measureText('A').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('A').getBaselines().hanging, 68, "ctx.measureText('A').getBaselines().hanging", "68");
_assertSame(Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('ABCD').getBaselines().ideographic, -39, "ctx.measureText('ABCD').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('ABCD').getBaselines().hanging, 68, "ctx.measureText('ABCD').getBaselines().hanging", "68");
}), 500);
_assertSame(Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('ABCD').getBaselines().ideographic, -39, "ctx.measureText('ABCD').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('ABCD').getBaselines().hanging, 68, "ctx.measureText('ABCD').getBaselines().hanging", "68");
}), 500);
});
});

View file

@ -27,18 +27,22 @@ var t = async_test("Testing emHeights");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').emHeightAscent, 37.5, "ctx.measureText('A').emHeightAscent", "37.5");
_assertSame(ctx.measureText('A').emHeightDescent, 12.5, "ctx.measureText('A').emHeightDescent", "12.5");
_assertSame(ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent, 50, "ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent", "50");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').emHeightAscent, 37.5, "ctx.measureText('A').emHeightAscent", "37.5");
_assertSame(ctx.measureText('A').emHeightDescent, 12.5, "ctx.measureText('A').emHeightDescent", "12.5");
_assertSame(ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent, 50, "ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent", "50");
_assertSame(ctx.measureText('ABCD').emHeightAscent, 37.5, "ctx.measureText('ABCD').emHeightAscent", "37.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent, 12.5, "ctx.measureText('ABCD').emHeightDescent", "12.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent, 50, "ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent", "50");
}), 500);
_assertSame(ctx.measureText('ABCD').emHeightAscent, 37.5, "ctx.measureText('ABCD').emHeightAscent", "37.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent, 12.5, "ctx.measureText('ABCD').emHeightDescent", "12.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent, 50, "ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent", "50");
}), 500);
});
});

View file

@ -27,16 +27,20 @@ var t = async_test("Testing fontBoundingBox");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').fontBoundingBoxAscent, 85, "ctx.measureText('A').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('A').fontBoundingBoxDescent, 39, "ctx.measureText('A').fontBoundingBoxDescent", "39");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').fontBoundingBoxAscent, 85, "ctx.measureText('A').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('A').fontBoundingBoxDescent, 39, "ctx.measureText('A').fontBoundingBoxDescent", "39");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxAscent, 85, "ctx.measureText('ABCD').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxDescent, 39, "ctx.measureText('ABCD').fontBoundingBoxDescent", "39");
}), 500);
_assertSame(ctx.measureText('ABCD').fontBoundingBoxAscent, 85, "ctx.measureText('ABCD').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxDescent, 39, "ctx.measureText('ABCD').fontBoundingBoxDescent", "39");
}), 500);
});
});

View file

@ -14,7 +14,7 @@
<body class="show_output">
<h1>2d.text.measure.width.basic</h1>
<p class="desc"></p>
<p class="desc">The width of character is same as font used</p>
<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
@ -23,19 +23,23 @@
<ul id="d"></ul>
<script>
var t = async_test("");
var t = async_test("The width of character is same as font used");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
});
});

View file

@ -27,10 +27,14 @@ var t = async_test("The empty string has zero width");
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
});
});

View file

@ -27,16 +27,20 @@ var t = async_test("Space characters are converted to U+0020 and collapsed (per
_addTest(function(canvas, ctx) {
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
});
});

View file

@ -967,24 +967,27 @@
expected: green
- name: 2d.text.measure.width.basic
desc: The width of character is same as font used
testing:
- 2d.text.measure
fonts:
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A').width === 50;
@assert ctx.measureText('AA').width === 100;
@assert ctx.measureText('ABCD').width === 200;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A').width === 50;
@assert ctx.measureText('AA').width === 100;
@assert ctx.measureText('ABCD').width === 200;
ctx.font = '100px CanvasTest';
@assert ctx.measureText('A').width === 100;
}), 500);
ctx.font = '100px CanvasTest';
@assert ctx.measureText('A').width === 100;
}), 500);
});
- name: 2d.text.measure.width.empty
desc: The empty string has zero width
@ -994,10 +997,14 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText("").width === 0;
}), 500);
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText("").width === 0;
}), 500);
});
- name: 2d.text.measure.width.space
desc: Space characters are converted to U+0020 and collapsed (per CSS)
@ -1007,16 +1014,20 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A B').width === 150;
@assert ctx.measureText('A B').width === 150; @moz-todo
@assert ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width === 150; @moz-todo
@assert ctx.measureText('A \x0b B').width >= 200;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A B').width === 150;
@assert ctx.measureText('A B').width === 150; @moz-todo
@assert ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width === 150; @moz-todo
@assert ctx.measureText('A \x0b B').width >= 200;
@assert ctx.measureText(' AB').width === 100; @moz-todo
@assert ctx.measureText('AB ').width === 100; @moz-todo
}), 500);
@assert ctx.measureText(' AB').width === 100; @moz-todo
@assert ctx.measureText('AB ').width === 100; @moz-todo
}), 500);
});
- name: 2d.text.measure.advances
desc: Testing width advances
@ -1026,25 +1037,29 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('Hello').advances[0]) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('Hello').advances[1] >= 36;
@assert ctx.measureText('Hello').advances[2] >= 58;
@assert ctx.measureText('Hello').advances[3] >= 70;
@assert ctx.measureText('Hello').advances[4] >= 80;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('Hello').advances[0]) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('Hello').advances[1] >= 36;
@assert ctx.measureText('Hello').advances[2] >= 58;
@assert ctx.measureText('Hello').advances[3] >= 70;
@assert ctx.measureText('Hello').advances[4] >= 80;
var tm = ctx.measureText('Hello');
@assert ctx.measureText('Hello').advances[0] === tm.advances[0];
@assert ctx.measureText('Hello').advances[1] === tm.advances[1];
@assert ctx.measureText('Hello').advances[2] === tm.advances[2];
@assert ctx.measureText('Hello').advances[3] === tm.advances[3];
@assert ctx.measureText('Hello').advances[4] === tm.advances[4];
}), 500);
var tm = ctx.measureText('Hello');
@assert ctx.measureText('Hello').advances[0] === tm.advances[0];
@assert ctx.measureText('Hello').advances[1] === tm.advances[1];
@assert ctx.measureText('Hello').advances[2] === tm.advances[2];
@assert ctx.measureText('Hello').advances[3] === tm.advances[3];
@assert ctx.measureText('Hello').advances[4] === tm.advances[4];
}), 500);
});
- name: 2d.text.measure.actualBoundingBox
desc: Testing actualBoundingBox
@ -1054,23 +1069,27 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('A').actualBoundingBoxLeft) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('A').actualBoundingBoxRight >= 50;
@assert ctx.measureText('A').actualBoundingBoxAscent >= 35;
@assert Math.abs(ctx.measureText('A').actualBoundingBoxDescent) === 0;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('A').actualBoundingBoxLeft) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('A').actualBoundingBoxRight >= 50;
@assert ctx.measureText('A').actualBoundingBoxAscent >= 35;
@assert Math.abs(ctx.measureText('A').actualBoundingBoxDescent) === 0;
@assert Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft) === 0;
@assert ctx.measureText('ABCD').actualBoundingBoxRight >= 200;
@assert ctx.measureText('ABCD').actualBoundingBoxAscent >= 85;
@assert ctx.measureText('ABCD').actualBoundingBoxDescent >= 37;
}), 500);
@assert Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft) === 0;
@assert ctx.measureText('ABCD').actualBoundingBoxRight >= 200;
@assert ctx.measureText('ABCD').actualBoundingBoxAscent >= 85;
@assert ctx.measureText('ABCD').actualBoundingBoxDescent >= 37;
}), 500);
});
- name: 2d.text.measure.fontBoundingBox
desc: Testing fontBoundingBox
@ -1080,16 +1099,20 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').fontBoundingBoxAscent === 85;
@assert ctx.measureText('A').fontBoundingBoxDescent === 39;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').fontBoundingBoxAscent === 85;
@assert ctx.measureText('A').fontBoundingBoxDescent === 39;
@assert ctx.measureText('ABCD').fontBoundingBoxAscent === 85;
@assert ctx.measureText('ABCD').fontBoundingBoxDescent === 39;
}), 500);
@assert ctx.measureText('ABCD').fontBoundingBoxAscent === 85;
@assert ctx.measureText('ABCD').fontBoundingBoxDescent === 39;
}), 500);
});
- name: 2d.text.measure.emHeights
desc: Testing emHeights
@ -1099,18 +1122,22 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').emHeightAscent === 37.5;
@assert ctx.measureText('A').emHeightDescent === 12.5;
@assert ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent === 50;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').emHeightAscent === 37.5;
@assert ctx.measureText('A').emHeightDescent === 12.5;
@assert ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent === 50;
@assert ctx.measureText('ABCD').emHeightAscent === 37.5;
@assert ctx.measureText('ABCD').emHeightDescent === 12.5;
@assert ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent === 50;
}), 500);
@assert ctx.measureText('ABCD').emHeightAscent === 37.5;
@assert ctx.measureText('ABCD').emHeightDescent === 12.5;
@assert ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent === 50;
}), 500);
});
- name: 2d.text.measure.baselines
desc: Testing baselines
@ -1120,17 +1147,21 @@
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert Math.abs(ctx.measureText('A').getBaselines().alphabetic) === 0;
@assert ctx.measureText('A').getBaselines().ideographic === -39;
@assert ctx.measureText('A').getBaselines().hanging === 68;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
document.fonts.add(f);
document.fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert Math.abs(ctx.measureText('A').getBaselines().alphabetic) === 0;
@assert ctx.measureText('A').getBaselines().ideographic === -39;
@assert ctx.measureText('A').getBaselines().hanging === 68;
@assert Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic) === 0;
@assert ctx.measureText('ABCD').getBaselines().ideographic === -39;
@assert ctx.measureText('ABCD').getBaselines().hanging === 68;
}), 500);
@assert Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic) === 0;
@assert ctx.measureText('ABCD').getBaselines().ideographic === -39;
@assert ctx.measureText('ABCD').getBaselines().hanging === 68;
}), 500);
});
# TODO: shadows, alpha, composite, clip

View file

@ -1,20 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-max-size (reference)</title>
<title>math-script-level (reference)</title>
<meta charset="utf-8">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
font: 12px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 355px.</p>
<p>Test passes if you see a square of side 12px.</p>
<div class="container">
<div style="font-size: 355px">X</div>
<div>
<div>X</div>
</div>
</div>
</body>
</html>

View file

@ -1,23 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-max-size</title>
<title>math-script-level clamping</title>
<meta charset="utf-8">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
<meta name="assert" content="The clamping of font-size implied by font-min-size and font-max-size must apply after the change due to math-script-level.">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3739">
<meta name="assert" content="Clamping due to browser's min font size only affects the used size.">
<link rel="match" href="math-script-level-font-size-clamping-001.tentative-ref.html">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
font: 12px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 355px.</p>
<div class="container" style="font-size: 500px">
<div style="math-script-level: add(1); font-max-size: 480px">X</div>
<p>Test passes if you see a square of side 12px.</p>
<div class="container"><!-- Initial size is 12px. -->
<div style="math-script-level: add(8);"><!-- Size is 12*.71^8 = 0.7749042374949131 < 1px. -->
<div style="math-script-level: add(-8);">X</div><!-- back to 12px. -->
</div>
</div>
</body>
</html>

View file

@ -1,20 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-min-size (reference)</title>
<meta charset="utf-8">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 520px.</p>
<div class="container">
<div style="font-size: 520px">X</div>
</div>
</body>
</html>

View file

@ -1,23 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level ; font-min-size</title>
<meta charset="utf-8">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
<meta name="assert" content="The clamping of font-size implied by font-min-size and font-max-size must apply after the change due to math-script-level.">
<link rel="match" href="math-script-level-font-size-clamping-002.tentative-ref.html">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 520px.</p>
<div class="container" style="font-size: 500px">
<div style="math-script-level: add(1); font-min-size: 520px;">X</div>
</div>
</body>
</html>

View file

@ -1,24 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-max-size (reference)</title>
<meta charset="utf-8">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 71px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 71px.</p>
<div class="container">
<div>
<div>
<div>X</div>
</div>
</div>
</div>
</body>
</html>

View file

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-max-size</title>
<meta charset="utf-8">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3739">
<meta name="assert" content="font-max-size only affects the used size.">
<link rel="match" href="math-script-level-font-size-clamping-003.tentative-ref.html">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 71px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 71px.</p>
<div class="container"><!-- Initial size is 71px. -->
<div style="math-script-level: add(-1);"><!-- Size is 71/.71 = 100px. -->
<div style="font-max-size: 90px"><!-- This only affects used size. -->
<div style="math-script-level: add(1);">X</div><!-- back to 71px. -->
</div>
</div>
</div>
</body>
</html>

View file

@ -1,24 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-min-size (reference)</title>
<meta charset="utf-8">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 100px.</p>
<div class="container">
<div>
<div>
<div>X</div>
</div>
</div>
</div>
</body>
</html>

View file

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>math-script-level and font-min-size</title>
<meta charset="utf-8">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3739">
<meta name="assert" content="font-min-size only affects the used size.">
<link rel="match" href="math-script-level-font-size-clamping-004.tentative-ref.html">
<style>
.container {
/* Ahem font does not have a MATH table so the font-size scale factor
is always 0.71^{computed - inherited math script level} */
font: 100px/1 Ahem;
}
</style>
</head>
<body>
<p>Test passes if you see a square of side 100px.</p>
<div class="container"><!-- Initial size is 100px. -->
<div style="math-script-level: add(1);"><!-- Size is 100*.71 = 71px. -->
<div style="font-min-size: 90px"><!-- This only affects used size. -->
<div style="math-script-level: add(-1);">X</div><!-- back to 100px. -->
</div>
</div>
</div>
</body>
</html>

View file

@ -7,7 +7,7 @@
<meta name="assert" content="grid-template-columns supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -7,7 +7,7 @@
<meta name="assert" content="grid-template-rows supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<link rel="author" href="mailto:atotic@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="help" href="https://crbug.com/967977">
<meta name="assert" content="zero width inline abspos container with borders does not cause a crash">
<style>
</style>
<span style="border-bottom:1px solid; filter:blur(2px);">
<div style="position:absolute"></div>
</span>
<script>
document.body.offsetTop;
test(() => {
}, 'test passes if it does not crash');
</script>

View file

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>filter interpolation</title>
<link rel="help" href="https://drafts.fxtf.org/filter-effects/#FilterProperty">
<meta name="assert" content="Matching lists interpolate.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
color: blue;
}
</style>
</head>
<body>
<script>
'use strict';
test_interpolation({
property: 'filter',
from: 'hue-rotate(0deg) blur(6px)',
to: 'hue-rotate(180deg) blur(10px)'
}, [
{at: -0.5, expect: 'hue-rotate(-90deg) blur(4px)'},
{at: 0, expect: 'hue-rotate(0deg) blur(6px)'},
{at: 0.25, expect: 'hue-rotate(45deg) blur(7px)'},
{at: 0.5, expect: 'hue-rotate(90deg) blur(8px)'},
{at: 1, expect: 'hue-rotate(180deg) blur(10px)'},
{at: 1.5, expect: 'hue-rotate(270deg) blur(12px)'}
]);
// Matching lists with differing units:
test_interpolation({
property: 'filter',
from: 'hue-rotate(80deg) blur(6mm)',
to: 'hue-rotate(100grad) blur(1cm)'
}, [
{at: -0.5, expect: 'hue-rotate(75deg) blur(4mm)'},
{at: 0, expect: 'hue-rotate(80deg) blur(6mm)'},
{at: 0.25, expect: 'hue-rotate(82.5deg) blur(7mm)'},
{at: 0.5, expect: 'hue-rotate(85deg) blur(8mm)'},
{at: 1, expect: 'hue-rotate(90deg) blur(10mm)'},
{at: 1.5, expect: 'hue-rotate(95deg) blur(12mm)'}
]);
</script>
</body>
</html>

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>filter interpolation</title>
<link rel="help" href="https://drafts.fxtf.org/filter-effects/#FilterProperty">
<meta name="assert" content="Partially matching lists interpolate.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
color: blue;
}
</style>
</head>
<body>
<script>
'use strict';
test_interpolation({
property: 'filter',
from: 'none',
to: 'opacity(0.5) hue-rotate(180deg)',
}, [
{at: -0.5, expect: 'opacity(1) hue-rotate(-90deg)'},
{at: 0.25, expect: 'opacity(0.875) hue-rotate(45deg)'},
{at: 0.5, expect: 'opacity(0.75) hue-rotate(90deg)'},
{at: 1, expect: 'opacity(0.5) hue-rotate(180deg)'},
{at: 1.5, expect: 'opacity(0.25) hue-rotate(270deg)'},
]);
test_interpolation({
property: 'filter',
from: 'blur(6px)',
to: 'blur(10px) hue-rotate(180deg)'
}, [
{at: -0.5, expect: 'blur(4px) hue-rotate(-90deg)'},
{at: 0.25, expect: 'blur(7px) hue-rotate(45deg)'},
{at: 0.5, expect: 'blur(8px) hue-rotate(90deg)'},
{at: 1, expect: 'blur(10px) hue-rotate(180deg)'},
{at: 1.5, expect: 'blur(12px) hue-rotate(270deg)'},
]);
// Mismatched lists:
test_no_interpolation({
property: 'filter',
from: 'grayscale(0) blur(0px)',
to: 'blur(10px)'
});
</script>
</body>
</html>

View file

@ -0,0 +1,138 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>filter interpolation</title>
<link rel="help" href="https://drafts.fxtf.org/filter-effects/#FilterProperty">
<meta name="assert" content="lacuna matches spec.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
color: blue;
}
</style>
</head>
<body>
<script>
'use strict';
test_interpolation({
property: 'filter',
from: 'none', // lacuna is 0px
to: 'blur(10px)'
}, [
{at: -1, expect: 'blur(0px)'}, // Negative values are not allowed.
{at: 0.5, expect: 'blur(5px)'},
{at: 1, expect: 'blur(10px)'},
{at: 1.5, expect: 'blur(15px)'}
]);
test_interpolation({
property: 'filter',
from: 'brightness(0)',
to: 'none' // lacuna is 1
}, [
{at: -1, expect: 'brightness(0)'}, // Negative values are not allowed.
{at: 0, expect: 'brightness(0)'},
{at: 0.5, expect: 'brightness(0.5)'},
{at: 1.5, expect: 'brightness(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'contrast(0)',
to: 'none' // lacuna is 1
}, [
{at: -1, expect: 'contrast(0)'}, // Negative values are not allowed.
{at: 0, expect: 'contrast(0)'},
{at: 0.5, expect: 'contrast(0.5)'},
{at: 1.5, expect: 'contrast(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'none', // lacuna is drop-shadow(0px 0px 0px transparent)
to: 'drop-shadow(20px 10px green)'
}, [
{at: -1, expect: 'drop-shadow(-20px -10px transparent)'},
{at: 0.5, expect: 'drop-shadow(10px 5px rgba(0, 128, 0, 0.5))'},
{at: 1, expect: 'drop-shadow(20px 10px green)'},
{at: 1.5, expect: 'drop-shadow(30px 15px #00C000)'}
]);
test_interpolation({
property: 'filter',
from: 'none', // lacuna is 0
to: 'grayscale(1)'
}, [
{at: -1, expect: 'grayscale(0)'}, // Negative values are not allowed.
{at: 0.5, expect: 'grayscale(0.5)'},
{at: 1, expect: 'grayscale(1)'},
{at: 1.5, expect: 'grayscale(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'none', // lacuna is 0deg
to: 'hue-rotate(360deg)'
}, [
{at: -1, expect: 'hue-rotate(-360deg)'},
{at: 0.5, expect: 'hue-rotate(180deg)'},
{at: 1, expect: 'hue-rotate(360deg)'},
{at: 1.5, expect: 'hue-rotate(540deg)'}
]);
test_interpolation({
property: 'filter',
from: 'none', // lacuna is 0
to: 'invert(1)'
}, [
{at: -1, expect: 'invert(0)'}, // Negative values are not allowed.
{at: 0.5, expect: 'invert(0.5)'},
{at: 1, expect: 'invert(1)'},
{at: 1.5, expect: 'invert(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'opacity(0)',
to: 'none' // lacuna is 1
}, [
{at: -1, expect: 'opacity(0)'}, // Negative values are not allowed.
{at: 0, expect: 'opacity(0)'},
{at: 0.5, expect: 'opacity(0.5)'},
{at: 1.5, expect: 'opacity(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'saturate(0)',
to: 'none' // lacuna is 1
}, [
{at: -1, expect: 'saturate(0)'}, // Negative values are not allowed.
{at: 0, expect: 'saturate(0)'},
{at: 0.5, expect: 'saturate(0.5)'},
{at: 1.5, expect: 'saturate(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'none', // lacuna is 0
to: 'sepia(1)'
}, [
{at: -1, expect: 'sepia(0)'}, // Negative values are not allowed.
{at: 0.5, expect: 'sepia(0.5)'},
{at: 1, expect: 'sepia(1)'},
{at: 1.5, expect: 'sepia(1)'} // Should clamp values to 1.
]);
test_no_interpolation({
property: 'filter',
from: 'url("#svgfilter")',
to: 'none', // lacuna is not defined
});
</script>
</body>
</html>

View file

@ -0,0 +1,142 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>filter interpolation</title>
<link rel="help" href="https://drafts.fxtf.org/filter-effects/#FilterProperty">
<meta name="assert" content="Default value when omitted matches spec.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
color: blue;
}
</style>
</head>
<body>
<script>
'use strict';
test_interpolation({
property: 'filter',
from: 'blur()', // Default value when omitted is 0px.
to: 'blur(10px)'
}, [
{at: -1, expect: 'blur(0px)'}, // Negative values are not allowed.
{at: 0, expect: 'blur()'},
{at: 0.5, expect: 'blur(5px)'},
{at: 1, expect: 'blur(10px)'},
{at: 1.5, expect: 'blur(15px)'}
]);
test_interpolation({
property: 'filter',
from: 'brightness(0)',
to: 'brightness()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'brightness(0)'}, // Negative values are not allowed.
{at: 0, expect: 'brightness(0)'},
{at: 0.5, expect: 'brightness(0.5)'},
{at: 1, expect: 'brightness()'},
{at: 1.5, expect: 'brightness(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'contrast(0)',
to: 'contrast()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'contrast(0)'}, // Negative values are not allowed.
{at: 0, expect: 'contrast(0)'},
{at: 0.5, expect: 'contrast(0.5)'},
{at: 1, expect: 'contrast()'},
{at: 1.5, expect: 'contrast(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'drop-shadow(0px 0px)', // The default value for omitted values is missing length values set to 0 and the missing used color is taken from the color property.
to: 'drop-shadow(20px 10px 30px green)'
}, [
{at: -1, expect: 'drop-shadow(-20px -10px blue)'},
{at: 0, expect: 'drop-shadow(0px 0px blue)'},
{at: 0.5, expect: 'drop-shadow(10px 5px 15px rgb(0, 64, 128))'},
{at: 1, expect: 'drop-shadow(20px 10px 30px green)'},
{at: 1.5, expect: 'drop-shadow(30px 15px 45px rgb(0, 192, 0))'}
]);
test_interpolation({
property: 'filter',
from: 'grayscale(0)',
to: 'grayscale()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'grayscale(0)'}, // Negative values are not allowed.
{at: 0, expect: 'grayscale(0)'},
{at: 0.5, expect: 'grayscale(0.5)'},
{at: 1, expect: 'grayscale()'},
{at: 1.5, expect: 'grayscale(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'hue-rotate()', // Default value when omitted is 0deg.
to: 'hue-rotate(360deg)'
}, [
{at: -1, expect: 'hue-rotate(-360deg)'},
{at: 0, expect: 'hue-rotate()'},
{at: 0.5, expect: 'hue-rotate(180deg)'},
{at: 1, expect: 'hue-rotate(360deg)'},
{at: 1.5, expect: 'hue-rotate(540deg)'}
]);
test_interpolation({
property: 'filter',
from: 'invert(0)',
to: 'invert()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'invert(0)'}, // Negative values are not allowed.
{at: 0, expect: 'invert(0)'},
{at: 0.5, expect: 'invert(0.5)'},
{at: 1, expect: 'invert()'},
{at: 1.5, expect: 'invert(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'opacity(0)',
to: 'opacity()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'opacity(0)'}, // Negative values are not allowed.
{at: 0, expect: 'opacity(0)'},
{at: 0.5, expect: 'opacity(0.5)'},
{at: 1, expect: 'opacity()'},
{at: 1.5, expect: 'opacity(1)'} // Should clamp values to 1.
]);
test_interpolation({
property: 'filter',
from: 'saturate(0)',
to: 'saturate()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'saturate(0)'}, // Negative values are not allowed.
{at: 0, expect: 'saturate(0)'},
{at: 0.5, expect: 'saturate(0.5)'},
{at: 1, expect: 'saturate()'},
{at: 1.5, expect: 'saturate(1.5)'}
]);
test_interpolation({
property: 'filter',
from: 'sepia(0)',
to: 'sepia()' // Default value when omitted is 1.
}, [
{at: -1, expect: 'sepia(0)'}, // Negative values are not allowed.
{at: 0, expect: 'sepia(0)'},
{at: 0.5, expect: 'sepia(0.5)'},
{at: 1, expect: 'sepia()'},
{at: 1.5, expect: 'sepia(1)'} // Should clamp values to 1.
]);
</script>
</body>
</html>

View file

@ -25,7 +25,7 @@ test_computed_value("backdrop-filter", "blur()", "blur(0px)");
test_computed_value("backdrop-filter", "brightness(0)");
test_computed_value("backdrop-filter", "brightness(300%)", "brightness(3)");
test_computed_value("backdrop-filter", "brightness()", "brightness(0)");
test_computed_value("backdrop-filter", "brightness()", "brightness(1)");
test_computed_value("backdrop-filter", "contrast(0)");
test_computed_value("backdrop-filter", "contrast(300%)", "contrast(3)");
@ -42,7 +42,7 @@ test_computed_value("backdrop-filter", "hue-rotate()", "hue-rotate(0deg)");
test_computed_value("backdrop-filter", "invert(0)");
test_computed_value("backdrop-filter", "invert(100%)", "invert(1)");
test_computed_value("backdrop-filter", "invert()", "invert(0)");
test_computed_value("backdrop-filter", "invert()", "invert(1)");
test_computed_value("backdrop-filter", "opacity(0)");
test_computed_value("backdrop-filter", "opacity(100%)", "opacity(1)");

View file

@ -35,6 +35,7 @@ test_computed_value("filter", "drop-shadow(1px 2px)", "drop-shadow(rgb(0, 255, 0
test_computed_value("filter", "drop-shadow(rgb(4, 5, 6) 1px 2px 0px)");
test_computed_value("filter", "grayscale(50%)", "grayscale(0.5)");
test_computed_value("filter", "grayscale(2)", "grayscale(1)");
test_computed_value("filter", "grayscale()", "grayscale(1)");
test_computed_value("filter", "hue-rotate(90deg)");
@ -42,10 +43,12 @@ test_computed_value("filter", "hue-rotate()", "hue-rotate(0deg)");
test_computed_value("filter", "invert(0)");
test_computed_value("filter", "invert(100%)", "invert(1)");
test_computed_value("filter", "invert(2)", "invert(1)");
test_computed_value("filter", "invert()", "invert(1)");
test_computed_value("filter", "opacity(0)");
test_computed_value("filter", "opacity(100%)", "opacity(1)");
test_computed_value("filter", "opacity(2)", "opacity(1)");
test_computed_value("filter", "opacity()", "opacity(1)");
test_computed_value("filter", "saturate(0)");
@ -54,6 +57,7 @@ test_computed_value("filter", "saturate()", "saturate(1)");
test_computed_value("filter", "sepia(0)");
test_computed_value("filter", "sepia(100%)", "sepia(1)");
test_computed_value("filter", "sepia(2)", "sepia(1)");
test_computed_value("filter", "sepia()", "sepia(1)");
test_computed_value("filter", 'blur(10px) url("https://www.example.com/picture.svg#f") contrast(20) brightness(30)');

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/mediaqueries-5/#forced-colors" />
<script type="text/javascript" src="/resources/testharness.js"></script>
<script type="text/javascript" src="/resources/testharnessreport.js"></script>
<script type="text/javascript" src="resources/matchmedia-utils.js"></script>
<script>
query_should_be_css_parseable("(forced-colors)");
query_should_be_css_parseable("(forced-colors: none)");
query_should_be_css_parseable("(forced-colors: active)");
query_should_not_be_css_parseable("(forced-colors: 0)");
query_should_not_be_css_parseable("(forced-colors: no-preference)");
query_should_not_be_css_parseable("(forced-colors: 10px)");
query_should_not_be_css_parseable("(forced-colors: active 0)");
query_should_not_be_css_parseable("(forced-colors: none active)");
query_should_not_be_css_parseable("(forced-colors: active/none)");
query_should_be_js_parseable("(forced-colors)");
query_should_be_js_parseable("(forced-colors: none)");
query_should_be_js_parseable("(forced-colors: active)");
query_should_not_be_js_parseable("(forced-colors: 0)");
query_should_not_be_js_parseable("(forced-colors: no-preference)");
query_should_not_be_js_parseable("(forced-colors: 10px)");
query_should_not_be_js_parseable("(forced-colors: active 0)");
query_should_not_be_js_parseable("(forced-colors: none active)");
query_should_not_be_js_parseable("(forced-colors: active/none)");
test(() => {
let booleanContext = window.matchMedia("(forced-colors)");
let none = window.matchMedia("(forced-colors: none)");
assert_equals(booleanContext.matches, !none.matches);
}, "Check that none evaluates to false in the boolean context");
</script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-anchor supports <position> animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
width: 500px;

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-distance supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-position supports <position> animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
width: 500px;

View file

@ -8,7 +8,7 @@
<meta name="assert" content="offset-rotate supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
</head>
<body>
<script>

View file

@ -1,66 +0,0 @@
'use strict';
function test_interpolation(settings, expectations) {
// Returns a timing function that at 0.5 evaluates to progress.
function timingFunction(progress) {
if (progress === 0)
return 'steps(1, end)';
if (progress === 1)
return 'steps(1, start)';
var y = (8 * progress - 1) / 6;
return 'cubic-bezier(0, ' + y + ', 1, ' + y + ')';
}
test(function(){
assert_true(CSS.supports(settings.property, settings.from), 'Value "' + settings.from + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, settings.to), 'Value "' + settings.to + '" is supported by ' + settings.property);
}, '"' + settings.from + '" and "' + settings.to + '" are valid ' + settings.property + ' values');
for (var i = 0; i < expectations.length; ++i) {
var progress = expectations[i].at;
var expectation = expectations[i].expect;
var animationId = 'anim' + i;
var targetId = 'target' + i;
var referenceId = 'reference' + i;
test(function(){
assert_true(CSS.supports(settings.property, expectation), 'Value "' + expectation + '" is supported by ' + settings.property);
var stylesheet = document.createElement('style');
stylesheet.textContent =
'#' + targetId + ' {\n' +
' animation: 2s ' + timingFunction(progress) + ' -1s paused ' + animationId + ';\n' +
'}\n' +
'@keyframes ' + animationId + ' {\n' +
' 0% { ' + settings.property + ': ' + settings.from + '; }\n' +
' 100% { ' + settings.property + ': ' + settings.to + '; }\n' +
'}\n' +
'#' + referenceId + ' {\n' +
' ' + settings.property + ': ' + expectation + ';\n' +
'}\n';
document.head.appendChild(stylesheet);
var target = document.createElement('div');
target.id = targetId;
document.body.appendChild(target);
var reference = document.createElement('div');
reference.id = referenceId;
document.body.appendChild(reference);
reference.style = '';
assert_equals(getComputedStyle(target)[settings.property], getComputedStyle(reference)[settings.property]);
}, (settings.test_prefix ? settings.test_prefix : "") +
'Animation between "' + settings.from + '" and "' + settings.to +
'" at progress ' + progress);
}
}
function test_no_interpolation(settings) {
var expectatFrom = [-1, 0, 0.125].map(function (progress) {
return {at: progress, expect: settings.from};
});
var expectatTo = [0.875, 1, 2].map(function (progress) {
return {at: progress, expect: settings.to};
});
test_interpolation(settings, expectatFrom.concat(expectatTo));
}

View file

@ -11,8 +11,8 @@ function test_interpolation(settings, expectations) {
}
test(function(){
assert_true(CSS.supports(settings.property, settings.from), 'Value "' + settings.from + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, settings.to), 'Value "' + settings.to + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, settings.from), 'From value "' + settings.from + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, settings.to), 'To value "' + settings.to + '" is supported by ' + settings.property);
}, '"' + settings.from + '" and "' + settings.to + '" are valid ' + settings.property + ' values');
for (var i = 0; i < expectations.length; ++i) {
@ -22,7 +22,7 @@ function test_interpolation(settings, expectations) {
var targetId = 'target' + i;
var referenceId = 'reference' + i;
test(function(){
assert_true(CSS.supports(settings.property, expectation), 'Value "' + expectation + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, expectation), 'Expectation value "' + expectation + '" is supported by ' + settings.property);
var stylesheet = document.createElement('style');
stylesheet.textContent =

View file

@ -1,7 +1,7 @@
<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/motion/animation/resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<title> 'layout-animations' Policy : Correct behavior for affected and unaffected properties when
feature is disabled.
</title>

View file

@ -1,7 +1,7 @@
<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/motion/animation/resources/interpolation-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<title> 'layout-animations' Policy : Correct behavior for affected and unaffected properties when
feature is enabled.
</title>

View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
<title>OffscreenCanvas test: 2d.text.measure.actualBoundingBox</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.actualBoundingBox</h1>
<p class="desc">Testing actualBoundingBox for OffscreenCanvas</p>
<script>
var t = async_test("Testing actualBoundingBox for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxLeft)", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('A').actualBoundingBoxRight >= 50, "ctx.measureText('A').actualBoundingBoxRight >= 50");
_assert(ctx.measureText('A').actualBoundingBoxAscent >= 35, "ctx.measureText('A').actualBoundingBoxAscent >= 35");
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxDescent), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxDescent)", "0");
_assertSame(Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft)", "0");
_assert(ctx.measureText('ABCD').actualBoundingBoxRight >= 200, "ctx.measureText('ABCD').actualBoundingBoxRight >= 200");
_assert(ctx.measureText('ABCD').actualBoundingBoxAscent >= 85, "ctx.measureText('ABCD').actualBoundingBoxAscent >= 85");
_assert(ctx.measureText('ABCD').actualBoundingBoxDescent >= 37, "ctx.measureText('ABCD').actualBoundingBoxDescent >= 37");
}), 500);
});
t.done();
});
</script>

View file

@ -0,0 +1,42 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.actualBoundingBox
// Description:Testing actualBoundingBox for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Testing actualBoundingBox for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxLeft)", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('A').actualBoundingBoxRight >= 50, "ctx.measureText('A').actualBoundingBoxRight >= 50");
_assert(ctx.measureText('A').actualBoundingBoxAscent >= 35, "ctx.measureText('A').actualBoundingBoxAscent >= 35");
_assertSame(Math.abs(ctx.measureText('A').actualBoundingBoxDescent), 0, "Math.abs(ctx.measureText('A').actualBoundingBoxDescent)", "0");
_assertSame(Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft), 0, "Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft)", "0");
_assert(ctx.measureText('ABCD').actualBoundingBoxRight >= 200, "ctx.measureText('ABCD').actualBoundingBoxRight >= 200");
_assert(ctx.measureText('ABCD').actualBoundingBoxAscent >= 85, "ctx.measureText('ABCD').actualBoundingBoxAscent >= 85");
_assert(ctx.measureText('ABCD').actualBoundingBoxDescent >= 37, "ctx.measureText('ABCD').actualBoundingBoxDescent >= 37");
}), 500);
});
t.done();
});
done();

View file

@ -0,0 +1,48 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
<title>OffscreenCanvas test: 2d.text.measure.advances</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.advances</h1>
<p class="desc">Testing width advances for OffscreenCanvas</p>
<script>
var t = async_test("Testing width advances for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('Hello').advances[0]), 0, "Math.abs(ctx.measureText('Hello').advances[\""+(0)+"\"])", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('Hello').advances[1] >= 36, "ctx.measureText('Hello').advances[\""+(1)+"\"] >= 36");
_assert(ctx.measureText('Hello').advances[2] >= 58, "ctx.measureText('Hello').advances[\""+(2)+"\"] >= 58");
_assert(ctx.measureText('Hello').advances[3] >= 70, "ctx.measureText('Hello').advances[\""+(3)+"\"] >= 70");
_assert(ctx.measureText('Hello').advances[4] >= 80, "ctx.measureText('Hello').advances[\""+(4)+"\"] >= 80");
var tm = ctx.measureText('Hello');
_assertSame(ctx.measureText('Hello').advances[0], tm.advances[0], "ctx.measureText('Hello').advances[\""+(0)+"\"]", "tm.advances[\""+(0)+"\"]");
_assertSame(ctx.measureText('Hello').advances[1], tm.advances[1], "ctx.measureText('Hello').advances[\""+(1)+"\"]", "tm.advances[\""+(1)+"\"]");
_assertSame(ctx.measureText('Hello').advances[2], tm.advances[2], "ctx.measureText('Hello').advances[\""+(2)+"\"]", "tm.advances[\""+(2)+"\"]");
_assertSame(ctx.measureText('Hello').advances[3], tm.advances[3], "ctx.measureText('Hello').advances[\""+(3)+"\"]", "tm.advances[\""+(3)+"\"]");
_assertSame(ctx.measureText('Hello').advances[4], tm.advances[4], "ctx.measureText('Hello').advances[\""+(4)+"\"]", "tm.advances[\""+(4)+"\"]");
}), 500);
});
t.done();
});
</script>

View file

@ -0,0 +1,44 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.advances
// Description:Testing width advances for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Testing width advances for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
_assertSame(Math.abs(ctx.measureText('Hello').advances[0]), 0, "Math.abs(ctx.measureText('Hello').advances[\""+(0)+"\"])", "0");
// Different platforms may render text slightly different.
_assert(ctx.measureText('Hello').advances[1] >= 36, "ctx.measureText('Hello').advances[\""+(1)+"\"] >= 36");
_assert(ctx.measureText('Hello').advances[2] >= 58, "ctx.measureText('Hello').advances[\""+(2)+"\"] >= 58");
_assert(ctx.measureText('Hello').advances[3] >= 70, "ctx.measureText('Hello').advances[\""+(3)+"\"] >= 70");
_assert(ctx.measureText('Hello').advances[4] >= 80, "ctx.measureText('Hello').advances[\""+(4)+"\"] >= 80");
var tm = ctx.measureText('Hello');
_assertSame(ctx.measureText('Hello').advances[0], tm.advances[0], "ctx.measureText('Hello').advances[\""+(0)+"\"]", "tm.advances[\""+(0)+"\"]");
_assertSame(ctx.measureText('Hello').advances[1], tm.advances[1], "ctx.measureText('Hello').advances[\""+(1)+"\"]", "tm.advances[\""+(1)+"\"]");
_assertSame(ctx.measureText('Hello').advances[2], tm.advances[2], "ctx.measureText('Hello').advances[\""+(2)+"\"]", "tm.advances[\""+(2)+"\"]");
_assertSame(ctx.measureText('Hello').advances[3], tm.advances[3], "ctx.measureText('Hello').advances[\""+(3)+"\"]", "tm.advances[\""+(3)+"\"]");
_assertSame(ctx.measureText('Hello').advances[4], tm.advances[4], "ctx.measureText('Hello').advances[\""+(4)+"\"]", "tm.advances[\""+(4)+"\"]");
}), 500);
});
t.done();
});
done();

View file

@ -0,0 +1,41 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
<title>OffscreenCanvas test: 2d.text.measure.baselines</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.baselines</h1>
<p class="desc">Testing baselines for OffscreenCanvas</p>
<script>
var t = async_test("Testing baselines for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(Math.abs(ctx.measureText('A').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('A').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('A').getBaselines().ideographic, -39, "ctx.measureText('A').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('A').getBaselines().hanging, 68, "ctx.measureText('A').getBaselines().hanging", "68");
_assertSame(Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('ABCD').getBaselines().ideographic, -39, "ctx.measureText('ABCD').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('ABCD').getBaselines().hanging, 68, "ctx.measureText('ABCD').getBaselines().hanging", "68");
}), 500);
});
t.done();
});
</script>

View file

@ -0,0 +1,37 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.baselines
// Description:Testing baselines for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Testing baselines for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(Math.abs(ctx.measureText('A').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('A').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('A').getBaselines().ideographic, -39, "ctx.measureText('A').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('A').getBaselines().hanging, 68, "ctx.measureText('A').getBaselines().hanging", "68");
_assertSame(Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic), 0, "Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic)", "0");
_assertSame(ctx.measureText('ABCD').getBaselines().ideographic, -39, "ctx.measureText('ABCD').getBaselines().ideographic", "-39");
_assertSame(ctx.measureText('ABCD').getBaselines().hanging, 68, "ctx.measureText('ABCD').getBaselines().hanging", "68");
}), 500);
});
t.done();
});
done();

View file

@ -0,0 +1,41 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
<title>OffscreenCanvas test: 2d.text.measure.emHeights</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.emHeights</h1>
<p class="desc">Testing emHeights for OffscreenCanvas</p>
<script>
var t = async_test("Testing emHeights for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').emHeightAscent, 37.5, "ctx.measureText('A').emHeightAscent", "37.5");
_assertSame(ctx.measureText('A').emHeightDescent, 12.5, "ctx.measureText('A').emHeightDescent", "12.5");
_assertSame(ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent, 50, "ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent", "50");
_assertSame(ctx.measureText('ABCD').emHeightAscent, 37.5, "ctx.measureText('ABCD').emHeightAscent", "37.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent, 12.5, "ctx.measureText('ABCD').emHeightDescent", "12.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent, 50, "ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent", "50");
}), 500);
});
t.done();
});
</script>

View file

@ -0,0 +1,37 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.emHeights
// Description:Testing emHeights for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Testing emHeights for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').emHeightAscent, 37.5, "ctx.measureText('A').emHeightAscent", "37.5");
_assertSame(ctx.measureText('A').emHeightDescent, 12.5, "ctx.measureText('A').emHeightDescent", "12.5");
_assertSame(ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent, 50, "ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent", "50");
_assertSame(ctx.measureText('ABCD').emHeightAscent, 37.5, "ctx.measureText('ABCD').emHeightAscent", "37.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent, 12.5, "ctx.measureText('ABCD').emHeightDescent", "12.5");
_assertSame(ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent, 50, "ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent", "50");
}), 500);
});
t.done();
});
done();

View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
<title>OffscreenCanvas test: 2d.text.measure.fontBoundingBox</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.fontBoundingBox</h1>
<p class="desc">Testing fontBoundingBox for OffscreenCanvas</p>
<script>
var t = async_test("Testing fontBoundingBox for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').fontBoundingBoxAscent, 85, "ctx.measureText('A').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('A').fontBoundingBoxDescent, 39, "ctx.measureText('A').fontBoundingBoxDescent", "39");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxAscent, 85, "ctx.measureText('ABCD').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxDescent, 39, "ctx.measureText('ABCD').fontBoundingBoxDescent", "39");
}), 500);
});
t.done();
});
</script>

View file

@ -0,0 +1,35 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.fontBoundingBox
// Description:Testing fontBoundingBox for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Testing fontBoundingBox for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
_assertSame(ctx.measureText('A').fontBoundingBoxAscent, 85, "ctx.measureText('A').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('A').fontBoundingBoxDescent, 39, "ctx.measureText('A').fontBoundingBoxDescent", "39");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxAscent, 85, "ctx.measureText('ABCD').fontBoundingBoxAscent", "85");
_assertSame(ctx.measureText('ABCD').fontBoundingBoxDescent, 39, "ctx.measureText('ABCD').fontBoundingBoxDescent", "39");
}), 500);
});
t.done();
});
done();

View file

@ -6,26 +6,31 @@
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.width.basic</h1>
<p class="desc"></p>
<p class="desc">The width of character is same as font used for OffscreenCanvas</p>
<script>
var t = async_test("");
var t = async_test("The width of character is same as font used for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
});
t.done();

View file

@ -1,27 +1,32 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.width.basic
// Description:
// Description:The width of character is same as font used for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("");
var t = async_test("The width of character is same as font used for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
_assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
_assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
ctx.font = '100px CanvasTest';
_assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
}), 500);
});
t.done();

View file

@ -6,21 +6,26 @@
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.width.empty</h1>
<p class="desc">The empty string has zero width</p>
<p class="desc">The empty string has zero width for OffscreenCanvas</p>
<script>
var t = async_test("The empty string has zero width");
var t = async_test("The empty string has zero width for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
});
t.done();

View file

@ -1,22 +1,27 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.width.empty
// Description:The empty string has zero width
// Description:The empty string has zero width for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("The empty string has zero width");
var t = async_test("The empty string has zero width for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
}), 500);
});
t.done();

View file

@ -6,27 +6,32 @@
<script src="/common/canvas-tests.js"></script>
<h1>2d.text.measure.width.space</h1>
<p class="desc">Space characters are converted to U+0020 and collapsed (per CSS)</p>
<p class="desc">Space characters are converted to U+0020 and collapsed (per CSS) for OffscreenCanvas</p>
<script>
var t = async_test("Space characters are converted to U+0020 and collapsed (per CSS)");
var t = async_test("Space characters are converted to U+0020 and collapsed (per CSS) for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
});
t.done();

View file

@ -1,28 +1,33 @@
// DO NOT EDIT! This test has been generated by tools/gentest.py.
// OffscreenCanvas test in a worker:2d.text.measure.width.space
// Description:Space characters are converted to U+0020 and collapsed (per CSS)
// Description:Space characters are converted to U+0020 and collapsed (per CSS) for OffscreenCanvas
// Note:
importScripts("/resources/testharness.js");
importScripts("/common/canvas-tests.js");
var t = async_test("Space characters are converted to U+0020 and collapsed (per CSS)");
var t = async_test("Space characters are converted to U+0020 and collapsed (per CSS) for OffscreenCanvas");
t.step(function() {
var offscreenCanvas = new OffscreenCanvas(100, 50);
var ctx = offscreenCanvas.getContext('2d');
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150");
_assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150");
_assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200");
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
_assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100");
_assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100");
}), 500);
});
t.done();

View file

@ -10186,52 +10186,208 @@
expected: green
- name: 2d.text.measure.width.basic
desc: The width of character is same as font used for OffscreenCanvas
testing:
- 2d.text.measure
fonts:
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A').width === 50;
@assert ctx.measureText('AA').width === 100;
@assert ctx.measureText('ABCD').width === 200;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A').width === 50;
@assert ctx.measureText('AA').width === 100;
@assert ctx.measureText('ABCD').width === 200;
ctx.font = '100px CanvasTest';
@assert ctx.measureText('A').width === 100;
}), 500);
ctx.font = '100px CanvasTest';
@assert ctx.measureText('A').width === 100;
}), 500);
});
- name: 2d.text.measure.width.empty
desc: The empty string has zero width
desc: The empty string has zero width for OffscreenCanvas
testing:
- 2d.text.measure
fonts:
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText("").width === 0;
}), 500);
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText("").width === 0;
}), 500);
});
- name: 2d.text.measure.width.space
desc: Space characters are converted to U+0020 and collapsed (per CSS)
desc: Space characters are converted to U+0020 and collapsed (per CSS) for OffscreenCanvas
testing:
- 2d.text.measure.spaces
fonts:
- CanvasTest
code: |
deferTest();
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A B').width === 150;
@assert ctx.measureText('A B').width === 150; @moz-todo
@assert ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width === 150; @moz-todo
@assert ctx.measureText('A \x0b B').width >= 200;
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
@assert ctx.measureText('A B').width === 150;
@assert ctx.measureText('A B').width === 150; @moz-todo
@assert ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width === 150; @moz-todo
@assert ctx.measureText('A \x0b B').width >= 200;
@assert ctx.measureText(' AB').width === 100; @moz-todo
@assert ctx.measureText('AB ').width === 100; @moz-todo
}), 500);
@assert ctx.measureText(' AB').width === 100; @moz-todo
@assert ctx.measureText('AB ').width === 100; @moz-todo
}), 500);
});
- name: 2d.text.measure.advances
desc: Testing width advances for OffscreenCanvas
testing:
- 2d.text.measure.advances
fonts:
- CanvasTest
code: |
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('Hello').advances[0]) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('Hello').advances[1] >= 36;
@assert ctx.measureText('Hello').advances[2] >= 58;
@assert ctx.measureText('Hello').advances[3] >= 70;
@assert ctx.measureText('Hello').advances[4] >= 80;
var tm = ctx.measureText('Hello');
@assert ctx.measureText('Hello').advances[0] === tm.advances[0];
@assert ctx.measureText('Hello').advances[1] === tm.advances[1];
@assert ctx.measureText('Hello').advances[2] === tm.advances[2];
@assert ctx.measureText('Hello').advances[3] === tm.advances[3];
@assert ctx.measureText('Hello').advances[4] === tm.advances[4];
}), 500);
});
- name: 2d.text.measure.actualBoundingBox
desc: Testing actualBoundingBox for OffscreenCanvas
testing:
- 2d.text.measure.actualBoundingBox
fonts:
- CanvasTest
code: |
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
ctx.baseline = 'alphabetic'
// Some platforms may return '-0'.
@assert Math.abs(ctx.measureText('A').actualBoundingBoxLeft) === 0;
// Different platforms may render text slightly different.
@assert ctx.measureText('A').actualBoundingBoxRight >= 50;
@assert ctx.measureText('A').actualBoundingBoxAscent >= 35;
@assert Math.abs(ctx.measureText('A').actualBoundingBoxDescent) === 0;
@assert Math.abs(ctx.measureText('ABCD').actualBoundingBoxLeft) === 0;
@assert ctx.measureText('ABCD').actualBoundingBoxRight >= 200;
@assert ctx.measureText('ABCD').actualBoundingBoxAscent >= 85;
@assert ctx.measureText('ABCD').actualBoundingBoxDescent >= 37;
}), 500);
});
- name: 2d.text.measure.fontBoundingBox
desc: Testing fontBoundingBox for OffscreenCanvas
testing:
- 2d.text.measure.fontBoundingBox
fonts:
- CanvasTest
code: |
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').fontBoundingBoxAscent === 85;
@assert ctx.measureText('A').fontBoundingBoxDescent === 39;
@assert ctx.measureText('ABCD').fontBoundingBoxAscent === 85;
@assert ctx.measureText('ABCD').fontBoundingBoxDescent === 39;
}), 500);
});
- name: 2d.text.measure.emHeights
desc: Testing emHeights for OffscreenCanvas
testing:
- 2d.text.measure.emHeights
fonts:
- CanvasTest
code: |
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert ctx.measureText('A').emHeightAscent === 37.5;
@assert ctx.measureText('A').emHeightDescent === 12.5;
@assert ctx.measureText('A').emHeightDescent + ctx.measureText('A').emHeightAscent === 50;
@assert ctx.measureText('ABCD').emHeightAscent === 37.5;
@assert ctx.measureText('ABCD').emHeightDescent === 12.5;
@assert ctx.measureText('ABCD').emHeightDescent + ctx.measureText('ABCD').emHeightAscent === 50;
}), 500);
});
- name: 2d.text.measure.baselines
desc: Testing baselines for OffscreenCanvas
testing:
- 2d.text.measure.baselines
fonts:
- CanvasTest
code: |
deferTest();
var f = new FontFace("CanvasTest", "/fonts/CanvasTest.ttf");
let fonts = (self.fonts ? self.fonts : document.fonts);
fonts.add(f);
fonts.ready.then(() => {
step_timeout(t.step_func_done(function () {
ctx.font = '50px CanvasTest';
ctx.direction = 'ltr';
ctx.align = 'left'
@assert Math.abs(ctx.measureText('A').getBaselines().alphabetic) === 0;
@assert ctx.measureText('A').getBaselines().ideographic === -39;
@assert ctx.measureText('A').getBaselines().hanging === 68;
@assert Math.abs(ctx.measureText('ABCD').getBaselines().alphabetic) === 0;
@assert ctx.measureText('ABCD').getBaselines().ideographic === -39;
@assert ctx.measureText('ABCD').getBaselines().hanging === 68;
}), 500);
});
# TODO: shadows, alpha, composite, clip

View file

@ -48,7 +48,9 @@ async_test((t) => {
// 8. This is the second message we receive, from the second load.
// Since the allowpaymentrequest flag was not set, we expect an exception.
assert_equals(e.data.message, 'Exception', 'after navigation');
assert_array_equals(e.data.details, [true /* ex instanceof DOMException*/, 18 /* ex.code */, 'SecurityError' /* ex.name */], 'after navigation');
assert_equals(4, e.data.details.length);
// The last entry is the error stacktrace. Ignore it in comparison.
assert_array_equals(e.data.details.slice(0, 3), [true /* ex instanceof DOMException*/, 18 /* ex.code */, 'SecurityError' /* ex.name */], 'after navigation');
t.done();
}
});

View file

@ -24,7 +24,9 @@ async_test((t) => {
window.onmessage = t.step_func_done((e) => {
assert_equals(e.data.message, 'Exception');
assert_array_equals(e.data.details, [true /* ex instanceof DOMException */, DOMException.SECURITY_ERR, 'SecurityError']);
assert_equals(4, e.data.details.length);
// The last entry is the error stacktrace. Ignore it in comparison.
assert_array_equals(e.data.details.slice(0, 3), [true /* ex instanceof DOMException */, DOMException.SECURITY_ERR, 'SecurityError']);
});
document.body.appendChild(iframe);

View file

@ -23,7 +23,9 @@ async_test((t) => {
i++;
if (i === 1) {
assert_equals(e.data.message, 'Exception', 'before navigation');
assert_array_equals(e.data.details, [true /* ex instanceof DOMException*/, 18 /* ex.code */, 'SecurityError' /* ex.name */], 'before navigation');
assert_equals(4, e.data.details.length);
// The last entry is the error stacktrace. Ignore it in comparison.
assert_array_equals(e.data.details.slice(0, 3), [true /* ex instanceof DOMException*/, 18 /* ex.code */, 'SecurityError' /* ex.name */], 'before navigation');
// Navigate the iframe. This will fire a second 'load' event on the iframe.
iframe.contentWindow.location.href = iframe.src + '?2';