React-native-web: [iOS Safari] Images with tintColor do not render predictably

Created on 2 Apr 2019  路  4Comments  路  Source: necolas/react-native-web

The problem

It appears that the images rendered by RNWeb in mobile safari do not show up.
Additionally the tint color will sometimes not render (if you cause some re-render)

Repro

Expected:

Screen Shot 2019-04-02 at 11 19 11 PM

iOS mobile safari:

IMG_58875F9559E4-1

Most helpful comment

It looks like the changes of the tintColor is not reflected in Safari

I forked the above's repro and add 2 seconds interval of changing the color of the tintColor
in the firefox and chrome, they are working fine, but not Safari

Even if I inspect the feflood html attribute, its flood-color value is not changing

https://codesandbox.io/s/rnweb-tint-color-tdcv7

All 4 comments

It appears that the images rendered by RNWeb in mobile safari do not show up.

I suspect I would have heard about that from Twitter :) Do you have an example of that independent from the tint color?

Additionally the tint color will sometimes not render (if you cause some re-render)

I won't have time to look into this myself but can review a PR

It looks like the changes of the tintColor is not reflected in Safari

I forked the above's repro and add 2 seconds interval of changing the color of the tintColor
in the firefox and chrome, they are working fine, but not Safari

Even if I inspect the feflood html attribute, its flood-color value is not changing

https://codesandbox.io/s/rnweb-tint-color-tdcv7

Similar issue with safari. I'm getting proper tintColor on first load, but on page refresh the tintColor isn't coloring anymore

I'm seeing this on React Navigation too. My back button's tint color is white, but sometimes it goes black. After some debugging it seems to be the same as this problem, somewhere around here:

https://github.com/react-navigation/react-navigation/blob/1c4bd6813bc6f5151fd2d99a0245331ff5631c38/packages/stack/src/views/Header/HeaderBackButton.tsx#L77-L85

I made a hacky fix by changing the colour of the PNG file and replacing it in postinstall, but of course this isn't ideal.

Was this page helpful?
0 / 5 - 0 ratings