Basemap styles service broken labels and / or icons after 4.28
Using the javascript API in a react / nextjs app, we have intermittent issues with the "navigation" basemap labels and icons.
These issues started occurring for us after switching to the basemap styles service ( "streets" -> "arcgis/navigation")
The sequence is the map loads, we initially see the arcgis/navigation basemap with the labels blurred. Then, the font file is downloaded, and the labels (sometimes - see interceptor workaround below) draw correctly.
These issues are intermittent - sometimes they do not happen, sometimes they happen on every load. Sometimes they occur on certain pages of the app, but not others (despite the esri logic being identical)
Every tested version after 4.28.10 including next has these issues. They occur in both chrome and firefox.
Adding an http interceptor to prevent the fonts from being cached seems to fix the label issues most of the time, but not all.
This causes the fonts to need to be downloaded every time. To me this indicates something is broken with timing.
This unfortunately does not fix the black box city location icons. We have not found a way to recover from this issue, or even determine via code the issue occurs.
There is nothing notable about how the map view is constructed (code below is wrapped in useEffect)
This would have been a support ticket, except it is not reproducible with vanilla JS.
This is a similar post:
Can anyone give any tips for getting around this issue?
