mirror of
https://github.com/servo/servo.git
synced 2025-08-11 16:35:33 +01:00
Update web-platform-tests to revision ea852ede3b4e0632fd453ed520b26b22692c2d92
This commit is contained in:
parent
2ab23c79a7
commit
92fa6ede85
109 changed files with 2169 additions and 873 deletions
|
@ -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
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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)");
|
||||
|
|
|
@ -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)');
|
||||
|
|
|
@ -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>
|
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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));
|
||||
}
|
|
@ -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 =
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
|
@ -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();
|
|
@ -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>
|
|
@ -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();
|
|
@ -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>
|
|
@ -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();
|
|
@ -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>
|
|
@ -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();
|
|
@ -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>
|
|
@ -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();
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
});
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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';
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue