forked from Floorp-Projects/Floorp
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bug 1808180 - Test for the interaction of font-size-adjust with font-…
…relative units. r=emilio This fails without the fix in the preceding patch; it also fails (along with other existing tests) in browsers that don't support font-size-adjust at all. Differential Revision: https://phabricator.services.mozilla.com/D165843
- Loading branch information
Showing
4 changed files
with
125 additions
and
0 deletions.
There are no files selected for viewing
17 changes: 17 additions & 0 deletions
17
testing/web-platform/tests/css/css-fonts/font-size-adjust-order-001-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,17 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>CSS Fonts reference</title> | ||
<style> | ||
div { | ||
margin: 10px; | ||
font: 20px monospace; | ||
background: yellow; | ||
width: 10ch; | ||
font-size-adjust: 1.0; | ||
} | ||
</style> | ||
<body> | ||
<p>Test passes if both blocks render the same, and there is no red:</p> | ||
<div>The quick brown fox jumps over the lazy dog</div> | ||
<div>The quick brown fox jumps over the lazy dog</div> | ||
</body> |
42 changes: 42 additions & 0 deletions
42
testing/web-platform/tests/css/css-fonts/font-size-adjust-order-001.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> | ||
<meta charset="utf-8"> | ||
<title>CSS Fonts Test: font-size-adjust effect on font-dependent units</title> | ||
<link rel="author" title="Jonathan Kew" href="mailto:[email protected]"> | ||
<link rel="help" title="2.6 Relative sizing: the font-size-adjust property" | ||
href="https://drafts.csswg.org/css-fonts/#font-size-adjust-prop"> | ||
<link rel="help" title="6.1.1. Font-relative Lengths: the em, rem, ex, rex, cap, rcap, ch, rch, ic, ric, lh, rlh units" | ||
href="https://drafts.csswg.org/css-values-4/#font-relative-lengths"> | ||
<meta name="assert" content="font-size-adjust affects the size of the 'ch' unit consistently regardless of the ordering of properties."> | ||
<link rel="match" href="font-size-adjust-order-001-ref.html"> | ||
<style> | ||
div { | ||
margin: 10px; | ||
font: 20px monospace; | ||
background: yellow; | ||
} | ||
#bg { | ||
width: 12ch; | ||
height: 2em; | ||
background: red; | ||
position: absolute; | ||
z-index: -1; | ||
} | ||
#test1 { | ||
/* Size the font by its ex-height; this will enlarge the glyphs | ||
so the red background block is hidden. */ | ||
font-size-adjust: 1.0; | ||
width: 10ch; | ||
} | ||
#test2 { | ||
/* This should work exactly the same. */ | ||
width: 10ch; | ||
font-size-adjust: 1.0; | ||
} | ||
</style> | ||
<body> | ||
<p>Test passes if both blocks render the same, and there is no red:</p> | ||
<div id="bg"></div> | ||
<div id="test1">The quick brown fox jumps over the lazy dog</div> | ||
<div id="bg"></div> | ||
<div id="test2">The quick brown fox jumps over the lazy dog</div> | ||
</body> |
26 changes: 26 additions & 0 deletions
26
testing/web-platform/tests/css/css-fonts/font-size-adjust-units-001-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,26 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>CSS Fonts reference</title> | ||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
<style> | ||
div { | ||
margin: 10px; | ||
font: 100px/1 Ahem; | ||
font-size-adjust: 0.8; /* this matches Ahem's ex-height metric */ | ||
background: orange; | ||
width: 2ch; | ||
height: 1ex; | ||
} | ||
#test1 { | ||
background: blue; | ||
} | ||
#test2 { | ||
background: blue; | ||
} | ||
</style> | ||
<body> | ||
<p>Test passes if the blue rectangles are both the same size as the orange one.</p> | ||
<div id="test1"></div> | ||
<div id="test2"></div> | ||
<div></div> | ||
</body> |
40 changes: 40 additions & 0 deletions
40
testing/web-platform/tests/css/css-fonts/font-size-adjust-units-001.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,40 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>CSS Fonts Test: font-size-adjust effect on font-dependent units</title> | ||
<link rel="author" title="Jonathan Kew" href="mailto:[email protected]"> | ||
<link rel="help" title="2.6 Relative sizing: the font-size-adjust property" | ||
href="https://drafts.csswg.org/css-fonts/#font-size-adjust-prop"> | ||
<link rel="help" title="6.1.1. Font-relative Lengths: the em, rem, ex, rex, cap, rcap, ch, rch, ic, ric, lh, rlh units" | ||
href="https://drafts.csswg.org/css-values-4/#font-relative-lengths"> | ||
<meta name="assert" content="Font-relative units like ch and ex are affected by font-size-adjust, | ||
because they are derived from metrics of the _used_ font."> | ||
<link rel="match" href="font-size-adjust-units-001-ref.html"> | ||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
<style> | ||
div { | ||
margin: 10px; | ||
font: 100px/1 Ahem; | ||
font-size-adjust: 0.8; /* this matches Ahem's ex-height metric */ | ||
background: orange; | ||
width: 2ch; | ||
height: 1ex; | ||
} | ||
#test1 { | ||
background: blue; | ||
font-size-adjust: 0.4; | ||
width: 4ch; | ||
height: 2ex; | ||
} | ||
#test2 { | ||
background: blue; | ||
font-size-adjust: 1.6; | ||
width: 1ch; | ||
height: 0.5ex; | ||
} | ||
</style> | ||
<body> | ||
<p>Test passes if the blue rectangles are both the same size as the orange one.</p> | ||
<div id="test1"></div> | ||
<div id="test2"></div> | ||
<div></div> | ||
</body> |