Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
[CSS Fonts] Implement the from-font value for font-size-adjust
https://bugs.webkit.org/show_bug.cgi?id=254790 Reviewed by Myles C. Maxfield and Tim Nguyen. The 'from-font' value is newly added to CSS Font Module Level 5 [1], which allows the browser to automatically determine a font-size-adjust value based on the primary font. This change implements it. The following tests have merged into the latest WPT [2] and are backported in this patch. Test: imported/w3c/web-platform-tests/css/css-fonts/font-size-adjust-013.html imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-computed.html imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-invalid.html imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-valid.html [1] https://www.w3.org/TR/css-fonts-5/#valdef-font-size-adjust-from-font [2] web-platform-tests/wpt#39380 * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/font-size-adjust-013-expected.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/font-size-adjust-013.html: Added. * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-computed-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-computed.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-invalid-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-invalid.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-valid-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/parsing/font-size-adjust-valid.html: * Source/WebCore/css/CSSProperties.json: * Source/WebCore/css/CSSValueKeywords.in: * Source/WebCore/css/ComputedStyleExtractor.cpp: (WebCore::fontSizeAdjustFromStyle): * Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp: (WebCore::CSSPropertyParserHelpers::consumeFontSizeAdjust): * Source/WebCore/platform/graphics/FontSizeAdjust.h: (WebCore::FontSizeAdjust::operator== const): (WebCore::operator<<): * Source/WebCore/style/StyleBuilderConverter.h: (WebCore::Style::BuilderConverter::convertFontSizeAdjust): * Source/WebCore/style/StyleFontSizeFunctions.cpp: (WebCore::Style::aspectValueOfPrimaryFont): * Source/WebCore/style/StyleFontSizeFunctions.h: Canonical link: https://commits.webkit.org/262800@main
- Loading branch information
1 parent
7279cac
commit 0f2621d
Showing
16 changed files
with
339 additions
and
23 deletions.
There are no files selected for viewing
58 changes: 58 additions & 0 deletions
58
LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/font-size-adjust-013-expected.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,58 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>CSS Test: font-size-adjust property</title> | ||
<link rel="help" href="https://www.w3.org/TR/css-fonts-5/#font-size-adjust-prop"> | ||
<meta name="assert" content="Test whether from-font automatically determines a font-size-adjust value based on the primary font."> | ||
<style> | ||
@font-face { | ||
font-family: 'primary-font-ahem-ex-500'; | ||
src: url('./resources/ahem-ex-500.otf'); | ||
} | ||
@font-face { | ||
font-family: 'secondary-font-ahem-ex-250'; | ||
src: url('./resources/ahem-ex-250.otf'); | ||
} | ||
.test { | ||
font-family: 'primary-font-ahem-ex-500', 'secondary-font-ahem-ex-250'; | ||
font-size: 50px; | ||
color: peru; | ||
height: 50px; | ||
margin-bottom: 24px; | ||
} | ||
.tall-inline-block { | ||
display: inline-block; | ||
height: 100px; | ||
} | ||
.description { | ||
font-family: serif; | ||
font-size: 16px; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div> | ||
<div class="description"> | ||
1. Same glyphs, two 'x' in different spans with two different fonts. The primary font (AhemEx500) has a double aspect value (i.e., x-height/size = 0.5) of the secondary font (AhemEx250). The right glyph is adjusted with font-size-adjust: from-font, so it should be the same size as the left one. | ||
</div> | ||
<div class="test"> | ||
<span>xx</span> | ||
</div> | ||
</div> | ||
<div> | ||
<div class="description"> | ||
2. Different glyphs 'x' and 'A' in the same span, with two fonts <em>without</em> font-size-adjust. As the primary font does not contain 'A' (U+0041), so the right glyph 'A' falls back to the secondary font. The right glyph should be smaller than the left one. | ||
</div> | ||
<div class="test"><span>xA</span></div> | ||
</div> | ||
<div> | ||
<div class="description"> | ||
3. Different glyphs 'x' and 'A' in the same span, with two fonts and font-size-adjust: from-font. The right glyph 'A' cannot be rendered by the primary font, so it individually falls back to the secondary font. However, it should be the same size as the left glyph due to font-size-adjust: from-font. | ||
</div> | ||
<div class="test"> | ||
<!-- We are inserting a tall inline-block here to make the position of the baseline independent of the adjusted glyph since on the ref test we don't use font-size-adjust but font-size --> | ||
<span>xx<span class="tall-inline-block"></span></span> | ||
</div> | ||
</div> | ||
</html> |
62 changes: 62 additions & 0 deletions
62
LayoutTests/imported/w3c/web-platform-tests/css/css-fonts/font-size-adjust-013.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,62 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>CSS Test: font-size-adjust property</title> | ||
<link rel="match" href="font-size-adjust-013-ref.html"> | ||
<link rel="help" href="https://www.w3.org/TR/css-fonts-5/#font-size-adjust-prop"> | ||
<meta name="assert" content="Test whether from-font automatically determines a font-size-adjust value based on the primary font."> | ||
<style> | ||
@font-face { | ||
font-family: 'primary-font-ahem-ex-500'; | ||
src: url('./resources/ahem-ex-500.otf'); | ||
} | ||
@font-face { | ||
font-family: 'secondary-font-ahem-ex-250'; | ||
src: url('./resources/ahem-ex-250.otf'); | ||
} | ||
.adjusted { | ||
font-size-adjust: from-font; | ||
} | ||
.test { | ||
font-family: 'primary-font-ahem-ex-500', 'secondary-font-ahem-ex-250'; | ||
font-size: 50px; | ||
color: peru; | ||
height: 50px; | ||
margin-bottom: 24px; | ||
} | ||
.tall-inline-block { | ||
display: inline-block; | ||
height: 100px; | ||
} | ||
.description { | ||
font-family: serif; | ||
font-size: 16px; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div> | ||
<div class="description"> | ||
1. Same glyphs, two 'x' in different spans with two different fonts. The primary font (AhemEx500) has a double aspect value (i.e., x-height/size = 0.5) of the secondary font (AhemEx250). The right glyph is adjusted with font-size-adjust: from-font, so it should be the same size as the left one. | ||
</div> | ||
<div class="test"> | ||
<span>x</span><span class="adjusted">x</span> | ||
</div> | ||
</div> | ||
<div> | ||
<div class="description"> | ||
2. Different glyphs 'x' and 'A' in the same span, with two fonts <em>without</em> font-size-adjust. As the primary font does not contain 'A' (U+0041), so the right glyph 'A' falls back to the secondary font. The right glyph should be smaller than the left one. | ||
</div> | ||
<div class="test"><span>xA</span></div> | ||
</div> | ||
<div> | ||
<div class="description"> | ||
3. Different glyphs 'x' and 'A' in the same span, with two fonts and font-size-adjust: from-font. The right glyph 'A' cannot be rendered by the primary font, so it individually falls back to the secondary font. However, it should be the same size as the left glyph due to font-size-adjust: from-font. | ||
</div> | ||
<div class="test"> | ||
<!-- We are inserting a tall inline-block here to make the position of the baseline independent of the adjusted glyph since on the ref test we don't use font-size-adjust but font-size --> | ||
<span class="adjusted">xA<span class="tall-inline-block"></span></span> | ||
</div> | ||
</div> | ||
</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
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
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
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
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
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
Oops, something went wrong.