TL;DR：是否可以在网站（Chrome）上查看 * 可用 * 字体？

我使用Chrome操作系统，它不允许你在系统上安装自定义字体。
为了解决这个问题，我创建了一个Chrome扩展程序，可以将我想要的字体添加到网页中：

"content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"], 
      "css" : ["fonts.css"]
    }
  ],
  "web_accessible_resources": [
    {
        "resources": ["fonts/*.ttf", "fonts/*.woff2"],
        "matches": ["http://*/*", "https://*/*"]
    }
  ]

CSS只是定义了font-face：

@font-face {
  font-family: 'Hack';
  src: url('chrome-extension://__MSG_@@extension_id__/fonts/hack-regular.woff2');
  font-weight: 400;
  font-style: normal;
}

code { font-family: 'Hack', monospace !important; }
pre { font-family: 'Hack', monospace !important; }
:root { --monospace-font-family: 'Hack'; }

最后的css规则是无关紧要的（我认为）。
一般来说，这在类似于vscode-remote的网站上运行得很好，它让我在设置中选择字体。然而，我发现我公司的一个内部网站不允许我这样做。
我看到了计算的css，它指定了我的字体，但显然没有找到：

font-family: Hack, "Comic Sans MS", monospace;

我还看到css规则被一个“注入的样式表”应用（但是我不能调试那个样式表，因为它来自一个扩展。
基本上，我有我的字体在其他网站上工作。我有我的css正在安装，我有我的字体正在使用，为什么它不加载？.
我检查了网络标签，它甚至没有被下载（因为它是在其他网站）。