Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-fonts/synthetic-bold-combining-mark-001.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>CSS Fonts test: synthetic bold does not separate a combining mark from its base</title>
<link rel="author" title="Brent Fulgham" href="mailto:bfulgham@apple.com">
<link rel="match" href="synthetic-bold-combining-mark-001-ref.html">
<meta name="assert" content="When a bold weight is synthesized for a family with no bold face, the synthesis must not displace a combining mark relative to the base it is attached to, even when the font positions the mark with a GPOS mark-to-base anchor rather than with glyph advances.">
<style>
/* /fonts/mark-anchor-test.ttf has a single Regular face, so requesting bold
makes the UA synthesize one. Each glyph is a full-width bar in its own
horizontal band: 'A' is the bottom bar, U+0301 the middle bar, U+0300 the top
bar, and the marks are zero-advance glyphs anchored directly above their base.
'B' draws the bottom and middle bars as one glyph and 'C' draws all three.
Both the test and the reference request bold, so whatever the UA's synthesis
does -- widen the advance and smear, stroke the outline, something else -- it
is applied to both sides equally, and the comparison tests only that the mark
stayed on its base. The test therefore does not depend on the synthesized
offset having any particular value.
Generated by css/css-text/tools/generate-mark-anchor-font.py. */
@font-face {
font-family: "mark-anchor-test";
src: url("/fonts/mark-anchor-test.ttf") format("truetype");
}
div {
font-family: "mark-anchor-test";
/* Small enough that all three groups fit inside the 800x600 reference
viewport, so every bar is actually compared. */
font-size: 100px;
line-height: 150px;
font-weight: bold;
font-synthesis: weight;
white-space: nowrap;
}
</style>
<p>Test passes if every black bar below is exactly as wide as, and left-aligned
with, the bars above and below it in the same group — two groups in the
middle row — and no bar is offset to the right of the others.</p>
<!-- One base, one mark. -->
<div>Á</div>
<!-- Two clusters, so any displacement would accumulate across them. -->
<div>ÁÁ</div>
<!-- Two marks on one base; each takes its position from the same base. -->
<div>Á̀</div>
</html>