-
Notifications
You must be signed in to change notification settings - Fork 2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bug 1645975 [wpt PR 24162] - Add test to check painting order of mrow…
…-like elements., a=testonly Automatic update from web-platform-tests Add test to check painting order of mrow-like elements. (#24162) https://github.com/mathml-refresh/mathml/issues/52 -- wpt-commits: 307056c29ae77cbd65e4b994fc0383d8cd9b9ed3 wpt-pr: 24162
- Loading branch information
1 parent
aef9a56
commit 6e18b2c
Showing
2 changed files
with
125 additions
and
0 deletions.
There are no files selected for viewing
83 changes: 83 additions & 0 deletions
83
testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-painting-order-ref.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,83 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>mrow painting order (reference)</title> | ||
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
| <style> | ||
| .container { | ||
| position: absolute; | ||
| left: 2em; | ||
| top: 10em; | ||
| } | ||
| math { | ||
| font: 50px/1 Ahem; | ||
| } | ||
| .hidden { | ||
| visibility: hidden; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <p>This test passes if there is no red and content is stacked such that</p> | ||
| <ul> | ||
| <li>foreground (dark colors) is above background (light colors)</li> | ||
| <li>yellow foreground is above green foreground which is itself above blue foreground</li> | ||
| <li>yellow background is above green background which is itself above blue background</li> | ||
| </ul> | ||
| <!-- Paint lightblue background --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mrow style="background: lightblue"><mn class="hidden">XXÉ</mn></mrow> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| <!-- Paint lightgreen background --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn class="hidden">XXÉX</mn> | ||
| <mrow style="background: lightgreen; margin-inline-start: -3em"><mn style="visibility: hidden">p XXÉ</mn></mrow> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| <!-- Paint lightyellow background --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn class="hidden">XXÉX</mn> | ||
| <mn class="hidden" style="margin-inline-start: -3em">p XXÉX</mn> | ||
| <mrow style="background: lightyellow; margin-inline-start: -3em"><mn style="visibility: hidden">p X</mn></mrow> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| <!-- Paint blue foreground --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn style="color: blue;">XXÉ</mn> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| <!-- Paint green foreground --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn class="hidden">XXÉX</mn> | ||
| <mn style="color: green; margin-inline-start: -3em">p XXÉ</mn> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| <!-- Paint yellow foreground --> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn class="hidden">XXÉX</mn> | ||
| <mn class="hidden" style="margin-inline-start: -3em">p XXÉX</mn> | ||
| <mn style="color: yellow; margin-inline-start: -3em">p X</mn> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| </body> | ||
| </html> |
42 changes: 42 additions & 0 deletions
42
testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-painting-order.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>mrow painting order</title> | ||
| <link rel="help" href="https://www.w3.org/TR/MathML3/chapter3.html#presm.mfenced"> | ||
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stacking-contexts"> | ||
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#horizontally-group-sub-expressions-mrow"> | ||
| <meta name="assert" content="Verify in which order the children paint"> | ||
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
| <link rel="match" href="mrow-painting-order-ref.html"> | ||
| <style> | ||
| .container { | ||
| position: absolute; | ||
| left: 2em; | ||
| top: 10em; | ||
| } | ||
| math { | ||
| font: 50px/1 Ahem; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <p>This test passes if there is no red and content is stacked such that</p> | ||
| <ul> | ||
| <li>foreground (dark colors) is above background (light colors)</li> | ||
| <li>yellow foreground is above green foreground which is itself above blue foreground</li> | ||
| <li>yellow background is above green background which is itself above blue background</li> | ||
| </ul> | ||
| <div class="container"> | ||
| <math> | ||
| <mrow> | ||
| <mn style="color: blue; background: lightblue">XXÉ</mn> | ||
| <mn style="color: red">X</mn> | ||
| <mn style="color: green; background: lightgreen; margin-inline-start: -3em">p XXÉ</mn> | ||
| <mn style="color: red">X</mn> | ||
| <mn style="color: yellow; background: lightyellow; margin-inline-start: -3em">p X</mn> | ||
| </mrow> | ||
| </math> | ||
| </div> | ||
| </body> | ||
| </html> |