My dapp is working well when it is opened with Chrome. However, when it is opened with the Facebook Messenger in-app browser or the MetaMask in-app browser, the app seems to crash and only display a blank screen.
I'm using React JS but I have absolutely no idea what could be the problem. I also don't know if it is possible to debug and get the log of the app when it is opened from the Messenger in-app browser.
Would be great if someone could give me some hints on how to fix a problem like that.
Thank you,
package.json
{
"name": "dp",
"version": "1.0.0",
"description": "dp",
"directories": {
"test": "test"
},
"dependencies": {
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@metamask/detect-provider": "^1.2.0",
"axios": "^0.21.1",
"bootstrap": "^4.6.0",
"bootstrap-icons": "^1.5.0",
"browser-image-compression": "^1.0.15",
"compressorjs": "^1.0.7",
"crypto-price": "0.0.6",
"css-loader": "^6.2.0",
"dom-loaded": "^3.0.0",
"firebase": "^8.9.1",
"firebase-admin": "^9.11.1",
"get-orientation": "^1.1.2",
"image-compressor": "^2.0.3",
"imagemin": "^8.0.1",
"imagemin-jpegtran": "^7.0.0",
"imagemin-pngquant": "^9.0.2",
"mdb-ui-kit": "^3.9.0",
"react-bootstrap": "^1.6.1",
"react-device-detect": "^1.17.0",
"react-dom": "^17.0.2",
"react-easy-crop": "^3.5.2",
"react-gallery-picker": "^1.1.2",
"react-image-gallery": "^1.2.7",
"react-images-upload": "^1.2.8",
"react-images-uploading": "^3.1.3",
"react-load-screen": "0.0.12",
"react-loader-spinner": "^4.0.0",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.3",
"react-upload-gallery": "^0.2.0",
"react-window-dimensions": "^1.0.2",
"uuid": "^8.3.2",
"web3": "^1.5.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"author": "",
"license": "ISC",
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"devDependencies": {
"@openzeppelin/contracts": "^3.3.0"
}
}