Icon on ios/Safari not working

[woodyc79]

Hello! On the iPad i always get a fallback to the Emoji with a message "Material Icons font was not loaded". I also tried hosting the font on my own.. but it does not work.

The CSS gets injected in the head, but I think the javascript query about the font does not work there

[ranbuch]

Hi @woodyc79 , sorry for the late response.

Can you provide a link? Also, maybe try to load the Material Icons font before initiating the accessibility script?

[ereztaiar]

This happened to me on chrome 94 on the production build adding

"icon": {
     "fontFaceSrc": [
                    "https://fonts.googleapis.com/icon?family=Material+Icons"
                ],
                "fontFamily": "Material Icons",
                "fontClass": "material-icons",
                "useEmojis": false
}

to the options resolved my issue

[infograf768]

Simplest way to solve the issue in the js is correcting the error:

It should be fontFamily:"Material+Icons", and not fontFamily:"Material Icons",

[woodyc79]

Sorry I lost this out of view ;-) I wrote a webpack configuration that copies the needed files from the node directory into my project and also replaces some of the source code - so its possible to have the accessibility icon at my own sidemenu and also returns always true in "isFontLoaded" ;-)

Thank you for your valuable tips!