Add new fontBoundingBoxAscent/Descent test

Add new fontBoundingBoxAscent/Descent test with Ahem font. Firefox and Chrome follow different table to calculate the fontBoundingboxAscent and descent. Ahem is one the font that has the same information across the tables. In this cl, I add a new test using Ahem font, so that the test can work for all browsers. Bug:1129621 Change-Id: I8ef0d7c5788e79f215d763e8494c3db8941b95d8 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2416261 Reviewed-by: Fernando Serboncini <fserb@chromium.org> Reviewed-by: Aaron Krajeski <aaronhk@chromium.org> Reviewed-by: Koji Ishii <kojii@chromium.org> Commit-Queue: Yi Xu <yiyix@chromium.org> Cr-Commit-Position: refs/heads/master@{#809379}
web-platform-tests · Sep 22, 2020 · 82e6948 · 82e6948
1 parent 3cabe51
commit 82e6948
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 0 deletions.
diff --git a/html/canvas/element/drawing-text-to-the-canvas/2d.text.measure.fontBoundingBox.ahem.html b/html/canvas/element/drawing-text-to-the-canvas/2d.text.measure.fontBoundingBox.ahem.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.text.measure.fontBoundingBox.ahem</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<style>
+@font-face {
+  font-family: Ahem;
+  src: url("/fonts/Ahem.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.measure.fontBoundingBox.ahem</h1>
+<p class="desc">Testing fontBoundingBox for font ahem</p>
+
+
+<span style="font-family: Ahem; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+
+<ul id="d"></ul>
+<script>
+var t = async_test("Testing fontBoundingBox for font ahem");
+_addTest(function(canvas, ctx) {
+
+deferTest();
+var f = new FontFace("Ahem", "/fonts/Ahem.ttf");
+document.fonts.add(f);
+document.fonts.ready.then(() => {
+    step_timeout(t.step_func_done(function () {
+        ctx.font = '50px Ahem';
+        ctx.direction = 'ltr';
+        ctx.align = 'left'
+        _assertSame(ctx.measureText('A').fontBoundingBoxAscent, 40, "ctx.measureText('A').fontBoundingBoxAscent", "40");
+        _assertSame(ctx.measureText('A').fontBoundingBoxDescent, 10, "ctx.measureText('A').fontBoundingBoxDescent", "10");
+
+        _assertSame(ctx.measureText('ABCD').fontBoundingBoxAscent, 40, "ctx.measureText('ABCD').fontBoundingBoxAscent", "40");
+        _assertSame(ctx.measureText('ABCD').fontBoundingBoxDescent, 10, "ctx.measureText('ABCD').fontBoundingBoxDescent", "10");
+    }), 500);
+});
+
+
+});
+</script>
+
diff --git a/html/canvas/tools/yaml/element/drawing-text-to-the-canvas.yaml b/html/canvas/tools/yaml/element/drawing-text-to-the-canvas.yaml
@@ -665,6 +665,29 @@
         }), 500);
     });
 
+- name: 2d.text.measure.fontBoundingBox.ahem
+  desc: Testing fontBoundingBox for font ahem
+  testing:
+  - 2d.text.measure.fontBoundingBox
+  fonts:
+  - Ahem
+  code: |
+    deferTest();
+    var f = new FontFace("Ahem", "/fonts/Ahem.ttf");
+    document.fonts.add(f);
+    document.fonts.ready.then(() => {
+        step_timeout(t.step_func_done(function () {
+            ctx.font = '50px Ahem';
+            ctx.direction = 'ltr';
+            ctx.align = 'left'
+            @assert ctx.measureText('A').fontBoundingBoxAscent === 40;
+            @assert ctx.measureText('A').fontBoundingBoxDescent === 10;
+
+            @assert ctx.measureText('ABCD').fontBoundingBoxAscent === 40;
+            @assert ctx.measureText('ABCD').fontBoundingBoxDescent === 10;
+        }), 500);
+    });
+
 - name: 2d.text.measure.emHeights
   desc: Testing emHeights
   testing:

diff --git a/lint.ignore b/lint.ignore
@@ -732,6 +732,7 @@ MISSING DEPENDENCY: webxr/resources/webxr_util.js
 AHEM SYSTEM FONT: acid/acid3/test.html
 AHEM SYSTEM FONT: resource-timing/resources/all_resource_types.htm
 AHEM SYSTEM FONT: resource-timing/resources/iframe-reload-TAO.sub.html
+AHEM SYSTEM FONT: html/canvas/element/drawing-text-to-the-canvas/2d.text.measure.fontBoundingBox.ahem.html
 
 # TODO: The following should be deleted along with the Ahem web font cleanup
 # PR (https://github.com/web-platform-tests/wpt/pull/18702)