Detecting Warnings from new FontFace.load() / document.fonts.add()

32 Views Asked by At

I am building an electron app that allows users to provide paths to local font files. Sometimes warnings are cast when loading these font files dynamically, in which case the local fonts are not applied and a default font is displayed instead. I am hoping to be able to detect these warnings so that I can notify the user by rendering something on-screen. Is it therefore possible to detect these warnings?

To be clear, these are not errors thrown by the promise, but warnings. Notably, OTS stands for OpenType Sanitize.

Failed to decode downloaded font: <URL>

OTS parsing error: invalid sfntVersion: 333319

OTS parsing error: CFF : Failed to parse table

OTS parsing error: invalid sfntVersion: 1097032549

OTS parsing error: incorrect file size in WOFF header

OTS parsing error: OS/2: Failed to parse table

OTS parsing error: maxp: Failed to parse table

OTS parsing error: cmap: Failed to parse table

OTS parsing error: head: Failed to parse table

OTS parsing error: Failed to convert WOFF 2.0 font to SFNT

  fontList.forEach(font => {
    const
      ff = new FontFace(`_${font.newFileName}`, `url('${font.newFilePath.replace(/\\/g, '/')}')`),
      fontItem = fontItemTemplate.content.cloneNode(true),
      fontNameElement = fontItem.querySelector('.font-name')
    ff.load()
    .then(
      () => {

        document.fonts.add(ff)

        // SOMEHOW DETECT WARNINGS
        // TO DISPLAY NOTIFICATION

        fontNameElement.style.setProperty('--font-family', `_${font.newFileName}`)
        fontNameElement.style.fontFamily = 'var(--font-family)'
        fontNameElement.textContent = font.ogFileName
        middle.appendChild(fontItem)
      },
      error => {
        console.error('ERROR LOADING @FONT-FACE:', error)
      }
    )
  })
0

There are 0 best solutions below