Here we the browser is adding the font (via `@font-face`) and we are manually adding the font with `font-display` set to `fallback`. Manually added font comes after the CSS.
Note the `status: "loaded"` is now on the font that has been manually added. So our font injected via the CSS Font Loading API overules the 'CSS-Connected' font.
Console output for this is:
FontFace
display: "auto"
family: "\"montserratbold_italic\""
featureSettings: "normal"
loaded: Promise { <state>: "pending" }
status: "unloaded"
stretch: "normal"
style: "normal"
unicodeRange: "U+0-10FFFF"
variant: "normal"
variationSettings: "normal"
weight: "normal"
<prototype>: FontFacePrototype { load: load(), family: Getter & Setter, style: Getter & Setter, … }
FontFace
display: "fallback"
family: "montserratbold_italic"
featureSettings: "normal"
loaded: Promise { <state>: "fulfilled", <value>: FontFace }
status: "loaded"
stretch: "normal"
style: "normal"
unicodeRange: "U+0-10FFFF"
variant: "normal"
variationSettings: "normal"
weight: "700"
<prototype>: FontFacePrototype { load: load(), family: Getter & Setter, style: Getter & Setter, … }