TypeError when adding images
We are hitting a bug where mapbox-gl is generating an exception by trying to call this.style.addImage where style is undefined.
Unfortunately I haven't been able to reproduce this in a dev environment, and only have our sentry logs for info. I suspect it is a race whereby react-map-gl is trying to load images before the map has finished loading. Here is a typical trace from sentry:
TypeError - Cannot read property 'addImage' of undefined
./node_modules/mapbox-gl/dist/mapbox-gl.js in addImage at line 33:293299
{snip} n=t.browser.getImageData(i),s=n.width,l=n.height,c=n.data;this.style.addImage(e,{data:new t.RGBAImage({width:s,height:l},c),pixelRatio:r,sd {snip}
./node_modules/@urbica/react-map-gl/dist/react-map-gl.esm.js in e at line 1:16823
{snip} image,r=e.pixelRatio,n=e.sdf;this._loadImage(o,function(e){return t._map.addImage(t._id,e,{pixelRatio:r,sdf:n})})},r.componentDidUpdate=func {snip}
I am happy to keep debugging this to a find a fix and create a PR, but need some feedback about how you think it should be handled.
react-map-gl Image has a guard for this situation in componentWillUnmount (!this_map.getStyle()), which could be replicated in componentDidUpdate and componentDidMount.
Or is there a higher level check needed before trying to create children - I guess this situation could be hit by other components?
Hi @oselz! Thanks for filling the issue for this. We will try to figure it out as soon as we can.
/cc @device25
@oselz thank you for your feedback. Could you please give more information about this bug? – os – browser
@device25 we have seen this on both Windows 10 & Mac OSX, Chrome 78.