I’m having an issue using react native paper on Firefox. Even in the snack example on web I get the following error:
A mutation operation was attempted on a database that did not allow mutations.
Evaluating module://react-native-paper.js
Evaluating module://App.js.js
Loading module://App.js
In a production app that works fine on Chrome I find that all the react native paper icons do not appear on Firefox. And the console shows the same error shown in Snack above.
This is on Firefox and Chrome. But this workaround is not needed on Android or iOS or when running locally with expo start --web. So I think that’s separate from the “mutation” error you’re seeing.
I see the problem on https://snack.expo.io. Meaning on Firefox I can’t run the default Expo example. I’m running Firefox on Linux by the way. Yes I am aware of the icons issue. This Firefox issue is independent of any icons though.
Sorry, I forgot it was you that found the issue the other day.
Searching for the error turns up some possibilities.
If you type about:config in the location bar and search for dom.indexedDB.enabled, is it set to false? I assume there’s something in the preferences that corresponds to that setting, but off hand I don’t know what it is. Mine is set to true.
There’s also a mention of “may have set to block offline storage for all sites in the permissions manager which disables IndexedDB” in this one:
There’s also some mention of Tor and private browsing possibly disabling IndexedDB and the above setting no longer being available:
EDIT: Indeed, if I browse to snack.expo.io in a Private window I get the “mutation” error and the web preview shows an error.
The icons not appearing is a separate issue from IndexedDB not working for you and I believe the IndexedDB issue is either a Firefox configuration issue or maybe another issue with your Firefox profile.
Vector icons are working in Firefox (and Chrome. I haven’t tested other browsers.) as long as you include them directly. It’s only via React Native Paper in snack that they are not working.
React Native Paper icons are working fine for me locally. The bug report you linked to is about the icons not showing when serving the app locally. Not specifically from snack.
Can you create a new Firefox profile and test it with the new profile? (I still expect the React Native Paper icons not to work in snack, since that is a separate issue, but I suspect the “mutation” issue will have disappeared.)
Hello! Thanks for the clarification. I agree that the IndexedDB issue is separate from the icons issue.
I have encountered the React Native Paper icons issue outside of snack. I noticed that the icons issue goes away when I do not load fonts. Specifically, the icons do show up with the following code, but only while the require() line is commented out: