patch 2 - Split canvas text spacing tests into separate groups for absolute vs font-relative lengths.

Also adds a few more examples of font-relative lengths. We currently fail those
in OffscreenCanvas (see bug 1832955).

Depends on D181277

Differential Revision: https://phabricator.services.mozilla.com/D181278

bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1838905
gecko-commit: ee558fb646d4b5a7a9ae86533e990944fc11cf13
gecko-reviewers: gfx-reviewers, lsalzman
diff --git a/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.spacing.html b/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.absolute.spacing.html
similarity index 78%
rename from html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.spacing.html
rename to html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.absolute.spacing.html
index 82a0fe3..1207f84 100644
--- a/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.spacing.html
+++ b/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.absolute.spacing.html
@@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
-<title>Canvas test: 2d.text.drawing.style.spacing</title>
+<title>Canvas test: 2d.text.drawing.style.absolute.spacing</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">
 <body class="show_output">
 
-<h1>2d.text.drawing.style.spacing</h1>
-<p class="desc">Testing letter spacing and word spacing</p>
+<h1>2d.text.drawing.style.absolute.spacing</h1>
+<p class="desc">Testing letter spacing and word spacing with absolute length</p>
 
 
 <p class="output">Actual output:</p>
@@ -16,7 +16,7 @@
 
 <ul id="d"></ul>
 <script>
-var t = async_test("Testing letter spacing and word spacing");
+var t = async_test("Testing letter spacing and word spacing with absolute length");
 _addTest(function(canvas, ctx) {
 
   _assertSame(ctx.letterSpacing, '0px', "ctx.letterSpacing", "'0px'");
@@ -36,9 +36,9 @@
   _assertSame(ctx.wordSpacing, '-1px', "ctx.wordSpacing", "'-1px'");
 
   ctx.letterSpacing = '1PX';
-  ctx.wordSpacing = '1EM';
+  ctx.wordSpacing = '10PX';
   _assertSame(ctx.letterSpacing, '1px', "ctx.letterSpacing", "'1px'");
-  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+  _assertSame(ctx.wordSpacing, '10px', "ctx.wordSpacing", "'10px'");
 
 });
 </script>
diff --git a/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.font-relative.spacing.html b/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.font-relative.spacing.html
new file mode 100644
index 0000000..a232ec1
--- /dev/null
+++ b/html/canvas/element/drawing-text-to-the-canvas/2d.text.drawing.style.font-relative.spacing.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.text.drawing.style.font-relative.spacing</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">
+<body class="show_output">
+
+<h1>2d.text.drawing.style.font-relative.spacing</h1>
+<p class="desc">Testing letter spacing and word spacing with font-relative length</p>
+
+
+<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 letter spacing and word spacing with font-relative length");
+_addTest(function(canvas, ctx) {
+
+  _assertSame(ctx.letterSpacing, '0px', "ctx.letterSpacing", "'0px'");
+  _assertSame(ctx.wordSpacing, '0px', "ctx.wordSpacing", "'0px'");
+
+  ctx.letterSpacing = '1EX';
+  ctx.wordSpacing = '1EM';
+  _assertSame(ctx.letterSpacing, '1ex', "ctx.letterSpacing", "'1ex'");
+  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+
+  ctx.letterSpacing = '1ch';
+  ctx.wordSpacing = '1ic';
+  _assertSame(ctx.letterSpacing, '1ch', "ctx.letterSpacing", "'1ch'");
+  _assertSame(ctx.wordSpacing, '1ic', "ctx.wordSpacing", "'1ic'");
+
+});
+</script>
+
diff --git a/html/canvas/offscreen/text/2d.text.drawing.style.spacing.html b/html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.html
similarity index 76%
rename from html/canvas/offscreen/text/2d.text.drawing.style.spacing.html
rename to html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.html
index aa2e7ca..965d451 100644
--- a/html/canvas/offscreen/text/2d.text.drawing.style.spacing.html
+++ b/html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.html
@@ -1,16 +1,16 @@
 <!DOCTYPE html>
 <!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
-<title>OffscreenCanvas test: 2d.text.drawing.style.spacing</title>
+<title>OffscreenCanvas test: 2d.text.drawing.style.absolute.spacing</title>
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/html/canvas/resources/canvas-tests.js"></script>
 
-<h1>2d.text.drawing.style.spacing</h1>
-<p class="desc">Testing letter spacing and word spacing</p>
+<h1>2d.text.drawing.style.absolute.spacing</h1>
+<p class="desc">Testing letter spacing and word spacing with absolute length</p>
 
 
 <script>
-var t = async_test("Testing letter spacing and word spacing");
+var t = async_test("Testing letter spacing and word spacing with absolute length");
 var t_pass = t.done.bind(t);
 var t_fail = t.step_func(function(reason) {
     throw reason;
@@ -37,9 +37,9 @@
   _assertSame(ctx.wordSpacing, '-1px', "ctx.wordSpacing", "'-1px'");
 
   ctx.letterSpacing = '1PX';
-  ctx.wordSpacing = '1EM';
+  ctx.wordSpacing = '10PX';
   _assertSame(ctx.letterSpacing, '1px', "ctx.letterSpacing", "'1px'");
-  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+  _assertSame(ctx.wordSpacing, '10px', "ctx.wordSpacing", "'10px'");
   t.done();
 
 });
diff --git a/html/canvas/offscreen/text/2d.text.drawing.style.spacing.worker.js b/html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.worker.js
similarity index 78%
rename from html/canvas/offscreen/text/2d.text.drawing.style.spacing.worker.js
rename to html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.worker.js
index 938ab96..2b42b3e 100644
--- a/html/canvas/offscreen/text/2d.text.drawing.style.spacing.worker.js
+++ b/html/canvas/offscreen/text/2d.text.drawing.style.absolute.spacing.worker.js
@@ -1,12 +1,12 @@
 // DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
-// OffscreenCanvas test in a worker:2d.text.drawing.style.spacing
-// Description:Testing letter spacing and word spacing
+// OffscreenCanvas test in a worker:2d.text.drawing.style.absolute.spacing
+// Description:Testing letter spacing and word spacing with absolute length
 // Note:
 
 importScripts("/resources/testharness.js");
 importScripts("/html/canvas/resources/canvas-tests.js");
 
-var t = async_test("Testing letter spacing and word spacing");
+var t = async_test("Testing letter spacing and word spacing with absolute length");
 var t_pass = t.done.bind(t);
 var t_fail = t.step_func(function(reason) {
     throw reason;
@@ -33,9 +33,9 @@
   _assertSame(ctx.wordSpacing, '-1px', "ctx.wordSpacing", "'-1px'");
 
   ctx.letterSpacing = '1PX';
-  ctx.wordSpacing = '1EM';
+  ctx.wordSpacing = '10PX';
   _assertSame(ctx.letterSpacing, '1px', "ctx.letterSpacing", "'1px'");
-  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+  _assertSame(ctx.wordSpacing, '10px', "ctx.wordSpacing", "'10px'");
   t.done();
 });
 done();
diff --git a/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.html b/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.html
new file mode 100644
index 0000000..a3f0f71
--- /dev/null
+++ b/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.text.drawing.style.font-relative.spacing</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.text.drawing.style.font-relative.spacing</h1>
+<p class="desc">Testing letter spacing and word spacing with font-relative length</p>
+
+
+<script>
+var t = async_test("Testing letter spacing and word spacing with font-relative length");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+    throw reason;
+});
+t.step(function() {
+
+  var canvas = new OffscreenCanvas(100, 50);
+  var ctx = canvas.getContext('2d');
+
+  _assertSame(ctx.letterSpacing, '0px', "ctx.letterSpacing", "'0px'");
+  _assertSame(ctx.wordSpacing, '0px', "ctx.wordSpacing", "'0px'");
+
+  ctx.letterSpacing = '1EX';
+  ctx.wordSpacing = '1EM';
+  _assertSame(ctx.letterSpacing, '1ex', "ctx.letterSpacing", "'1ex'");
+  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+
+  ctx.letterSpacing = '1ch';
+  ctx.wordSpacing = '1ic';
+  _assertSame(ctx.letterSpacing, '1ch', "ctx.letterSpacing", "'1ch'");
+  _assertSame(ctx.wordSpacing, '1ic', "ctx.wordSpacing", "'1ic'");
+  t.done();
+
+});
+</script>
diff --git a/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.worker.js b/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.worker.js
new file mode 100644
index 0000000..cd65320
--- /dev/null
+++ b/html/canvas/offscreen/text/2d.text.drawing.style.font-relative.spacing.worker.js
@@ -0,0 +1,33 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.text.drawing.style.font-relative.spacing
+// Description:Testing letter spacing and word spacing with font-relative length
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("Testing letter spacing and word spacing with font-relative length");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+    throw reason;
+});
+t.step(function() {
+
+  var canvas = new OffscreenCanvas(100, 50);
+  var ctx = canvas.getContext('2d');
+
+  _assertSame(ctx.letterSpacing, '0px', "ctx.letterSpacing", "'0px'");
+  _assertSame(ctx.wordSpacing, '0px', "ctx.wordSpacing", "'0px'");
+
+  ctx.letterSpacing = '1EX';
+  ctx.wordSpacing = '1EM';
+  _assertSame(ctx.letterSpacing, '1ex', "ctx.letterSpacing", "'1ex'");
+  _assertSame(ctx.wordSpacing, '1em', "ctx.wordSpacing", "'1em'");
+
+  ctx.letterSpacing = '1ch';
+  ctx.wordSpacing = '1ic';
+  _assertSame(ctx.letterSpacing, '1ch', "ctx.letterSpacing", "'1ch'");
+  _assertSame(ctx.wordSpacing, '1ic', "ctx.wordSpacing", "'1ic'");
+  t.done();
+});
+done();
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
index 55597b3..676cc8e 100644
--- a/html/canvas/tools/yaml/element/drawing-text-to-the-canvas.yaml
+++ b/html/canvas/tools/yaml/element/drawing-text-to-the-canvas.yaml
@@ -668,8 +668,8 @@
         }), 500);
     });
 
-- name: 2d.text.drawing.style.spacing
-  desc: Testing letter spacing and word spacing
+- name: 2d.text.drawing.style.absolute.spacing
+  desc: Testing letter spacing and word spacing with absolute length
   code: |
     @assert ctx.letterSpacing === '0px';
     @assert ctx.wordSpacing === '0px';
@@ -688,10 +688,26 @@
     @assert ctx.wordSpacing === '-1px';
 
     ctx.letterSpacing = '1PX';
-    ctx.wordSpacing = '1EM';
+    ctx.wordSpacing = '10PX';
     @assert ctx.letterSpacing === '1px';
+    @assert ctx.wordSpacing === '10px';
+
+- name: 2d.text.drawing.style.font-relative.spacing
+  desc: Testing letter spacing and word spacing with font-relative length
+  code: |
+    @assert ctx.letterSpacing === '0px';
+    @assert ctx.wordSpacing === '0px';
+
+    ctx.letterSpacing = '1EX';
+    ctx.wordSpacing = '1EM';
+    @assert ctx.letterSpacing === '1ex';
     @assert ctx.wordSpacing === '1em';
 
+    ctx.letterSpacing = '1ch';
+    ctx.wordSpacing = '1ic';
+    @assert ctx.letterSpacing === '1ch';
+    @assert ctx.wordSpacing === '1ic';
+
 - name: 2d.text.drawing.style.nonfinite.spacing
   desc: Testing letter spacing and word spacing with nonfinite inputs
   code: |
diff --git a/html/canvas/tools/yaml/offscreen/text.yaml b/html/canvas/tools/yaml/offscreen/text.yaml
index 0907076..e375357 100644
--- a/html/canvas/tools/yaml/offscreen/text.yaml
+++ b/html/canvas/tools/yaml/offscreen/text.yaml
@@ -1136,8 +1136,8 @@
        @assert ctx.measureText('ABCD').getBaselines().hanging === 68;
     }).then(t_pass, t_fail);
 
-- name: 2d.text.drawing.style.spacing
-  desc: Testing letter spacing and word spacing
+- name: 2d.text.drawing.style.absolute.spacing
+  desc: Testing letter spacing and word spacing with absolute length
   code: |
     @assert ctx.letterSpacing === '0px';
     @assert ctx.wordSpacing === '0px';
@@ -1156,9 +1156,26 @@
     @assert ctx.wordSpacing === '-1px';
 
     ctx.letterSpacing = '1PX';
-    ctx.wordSpacing = '1EM';
+    ctx.wordSpacing = '10PX';
     @assert ctx.letterSpacing === '1px';
+    @assert ctx.wordSpacing === '10px';
+    t.done();
+
+- name: 2d.text.drawing.style.font-relative.spacing
+  desc: Testing letter spacing and word spacing with font-relative length
+  code: |
+    @assert ctx.letterSpacing === '0px';
+    @assert ctx.wordSpacing === '0px';
+
+    ctx.letterSpacing = '1EX';
+    ctx.wordSpacing = '1EM';
+    @assert ctx.letterSpacing === '1ex';
     @assert ctx.wordSpacing === '1em';
+
+    ctx.letterSpacing = '1ch';
+    ctx.wordSpacing = '1ic';
+    @assert ctx.letterSpacing === '1ch';
+    @assert ctx.wordSpacing === '1ic';
     t.done();
 
 - name: 2d.text.drawing.style.nonfinite.spacing