I have a piece of javascript code that retrieves the "font-family" of a DOM node.

window.getComputedStyle(element).getPropertyValue(font-family)
>> '"IBM Plex Sans", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"'

One thing I'd like to do, is to find every font on the page (which I'll do by traversing the DOM and using the code above), and then constructing an object that shows where each font is being loaded from.

For example, for IBM Plex Sans, I'd like to be able to create an object that looks like this:

{
  IBMPlexSans {
    url: mysite.cdn.asdfdsaf;
    font-style: normal,
    font-weight: 400
  }
}

Any ideas on how I would go about this? In short, I'm wondering if there's any way in javascript to check where each font is being loaded from.

Thanks!