Fix test 2d.text.draw.baseline.ideographic.html

The ideographic baseline is defined as follows:
https://drafts.csswg.org/css-writing-modes-4/#line-under: the
line-relative “bottom” or descender side. (The side underlines are
typically drawn on.)

I attached result here:
https://bugs.chromium.org/p/chromium/issues/detail?id=1066953#c14
(It's with font 50 and draw at height 50)

I think this test case is wrong: The test case draws text at ideographic
under baseline at height 31.25, so that text is draw above 31.25 and
leaves 31.25 to 50 to be at its original color (red for test). The test
tests if the resulting rect, rect(0, 0, 50, 100), to be all green.

I think the test needs to know the location of the green rectangle and
move it down. The test is updated.

Bug: 1066953
Change-Id: I2b9c029a439fd8a19343dc826b70b1bc1c95b60e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4615191
Commit-Queue: Yi Xu <[email protected]>
Reviewed-by: Justin Novosad <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1158349}

Author: Yi Xu

html/canvas/element/text-styles/2d.text.draw.baseline.ideographic.html

@@ -33,7 +33,7 @@ <h1>2d.text.draw.baseline.ideographic</h1>
       ctx.fillRect(0, 0, 100, 50);
       ctx.fillStyle = '#0f0';
       ctx.textBaseline = 'ideographic';
-      ctx.fillText('CC', 0, 31.25);
+      ctx.fillText('CC', 0, 81.25);
       _assertPixelApprox(canvas, 5,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 95,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 25,25, 0,255,0,255, 2);

html/canvas/offscreen/text/2d.text.draw.baseline.ideographic.html

@@ -30,7 +30,7 @@ <h1>2d.text.draw.baseline.ideographic</h1>
       ctx.fillRect(0, 0, 100, 50);
       ctx.fillStyle = '#0f0';
       ctx.textBaseline = 'ideographic';
-      ctx.fillText('CC', 0, 31.25);
+      ctx.fillText('CC', 0, 81.25);
       _assertPixelApprox(canvas, 5,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 95,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 25,25, 0,255,0,255, 2);

html/canvas/offscreen/text/2d.text.draw.baseline.ideographic.worker.js

@@ -26,7 +26,7 @@ t.step(function() {
       ctx.fillRect(0, 0, 100, 50);
       ctx.fillStyle = '#0f0';
       ctx.textBaseline = 'ideographic';
-      ctx.fillText('CC', 0, 31.25);
+      ctx.fillText('CC', 0, 81.25);
       _assertPixelApprox(canvas, 5,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 95,5, 0,255,0,255, 2);
       _assertPixelApprox(canvas, 25,25, 0,255,0,255, 2);

html/canvas/tools/yaml/element/text-styles.yaml

@@ -296,7 +296,7 @@
         ctx.fillRect(0, 0, 100, 50);
         ctx.fillStyle = '#0f0';
         ctx.textBaseline = 'ideographic';
-        ctx.fillText('CC', 0, 31.25);
+        ctx.fillText('CC', 0, 81.25);
         @assert pixel 5,5 ==~ 0,255,0,255;
         @assert pixel 95,5 ==~ 0,255,0,255;
         @assert pixel 25,25 ==~ 0,255,0,255;

html/canvas/tools/yaml/offscreen/text.yaml

@@ -614,7 +614,7 @@
         ctx.fillRect(0, 0, 100, 50);
         ctx.fillStyle = '#0f0';
         ctx.textBaseline = 'ideographic';
-        ctx.fillText('CC', 0, 31.25);
+        ctx.fillText('CC', 0, 81.25);
         @assert pixel 5,5 ==~ 0,255,0,255;
         @assert pixel 95,5 ==~ 0,255,0,255;
         @assert pixel 25,25 ==~ 0,255,0,255;