1687162 - MIT Technology Review rendering error if gfx.downloadable_fonts.otl_validation is true

Status: RESOLVED MOVED

(Web Compatibility :: Site Reports, defect)

Description

[Kan-Ru Chen [:kanru] (UTC+9)]

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:86.0) Gecko/20100101 Firefox/86.0

Steps to reproduce:

Open an article on https://www.technologyreview.com

For example:
https://www.technologyreview.com/2021/01/16/1016264/covid-vaccine-acceptance-us-county/

Actual results:

The content part is displayed as bold sans serif font.

There is errors in the web console:

downloadable font: Layout: bad start coverage index. (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: Failed to parse backtrack coverage 0 in chain context format 3 (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: Failed to parse chaining context format 3 subtable (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: Failed to parse lookup subtable 5 (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: Failed to parse subtable 0 (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: Failed to parse lookup 7 (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: GSUB: Failed to parse lookup list table (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: GSUB: Failed to parse table (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: rejected by sanitizer (font-family: "Independent" style:normal weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-regular.woff
downloadable font: Layout: bad start coverage index. (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: Layout: Failed to parse backtrack coverage 0 in chain context format 3 (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: Layout: Failed to parse chaining context format 3 subtable (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: Layout: Failed to parse lookup subtable 5 (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: Layout: Failed to parse subtable 0 (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: Layout: Failed to parse lookup 7 (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: GSUB: Failed to parse lookup list table (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: GSUB: Failed to parse table (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff
downloadable font: rejected by sanitizer (font-family: "Independent" style:italic weight:400 stretch:100 src index:0) source: https://cdn.technologyreview.com/_/fonts/independent-italic.woff

Works after disable gfx.downloadable_fonts.otl_validation

Comment 1

[Jonathan Kew [:jfkthame]]

This is a site issue. They have @font-face rules such as

@font-face {
 font-family:Independent;
 font-style:normal;
 font-weight:400;
 src:url(https://cdn.technologyreview.com/_/fonts/independent-regular.woff) format("woff"),
 url(https://cdn.technologyreview.com/_/fonts/nhaasgroteskdsstd-95blk.ttf) format("truetype")
}

Note how if the WOFF file fails to load (which it does, due to the validation errors shown), the next source offered is a TTF file, but it's an entirely different font: it's the "black" face of NeueHaasGrotesk. So that's what appears.

So, two issues. First, their "Independent" font resources are invalid (perhaps due to bad subsetting?), and will be rejected if strict OpenType validation is enabled; and second, their @font-face rules have a mixed-up src list (there are several such rules, where the "fallback" .ttf is not at all appropriate for the desired style).