Possible Unhandled Promise Rejection (id: 0):
Error: document is not defined in Window,
when i call the authenticate method of useMoralis hook
if anyone already faced and fixed it please help me guys!
Can you give more info about your project e.g. your package.json dependencies and your Moralis code.
package.json
{
"dependencies": {
"@eva-design/eva": "^2.1.1",
"@react-native-async-storage/async-storage": "1.17.11",
"@react-native-masked-view/masked-view": "^0.2.8",
"@react-navigation/native": "^6.1.1",
"@react-navigation/native-stack": "^6.9.6",
"@tradle/react-native-http": "^2.0.0",
"@ui-kitten/components": "^5.1.2",
"@walletconnect/react-native-dapp": "1.6.6",
"@walletconnect/web3-provider": "^1.6.6",
"base-64": "1.0.0",
"buffer": "6.0.3",
"events": "^1.0.0",
"expo": "^47.0.0",
"expo-linear-gradient": "^12.0.1",
"expo-splash-screen": "~0.17.5",
"expo-status-bar": "~1.4.2",
"https-browserify": "~0.0.0",
"localstorage-polyfill": "^1.0.1",
"moralis": "^2.9.0",
"moralis-v1": "^1.11.0",
"node-libs-browser": "2.2.1",
"path-browserify": "0.0.0",
"react": "18.1.0",
"react-dom": "18.1.0",
"react-moralis": "^1.4.2",
"react-native": "0.70.5",
"react-native-animatable": "^1.3.3",
"react-native-crypto": "2.2.0",
"react-native-dotenv": "2.4.3",
"react-native-get-random-values": "1.5.0",
"react-native-localhost": "1.0.0",
"react-native-os": "^1.0.1",
"react-native-paper": "^5.0.1",
"react-native-qrcode-svg": "^6.1.2",
"react-native-randombytes": "^3.0.0",
"react-native-safe-area-context": "^4.4.1",
"react-native-screens": "^3.18.2",
"react-native-stream": "0.1.9",
"react-native-svg": "9.6.4",
"react-native-web": "^0.18.10",
"readable-stream": "1.0.33",
"stream-browserify": "^1.0.0",
"url": "~0.10.1",
"web3": "1.3.1"
},
"devDependencies": {
"@babel/core": "7.15.5",
"@babel/plugin-proposal-private-property-in-object": "7.15.4",
"@babel/preset-env": "7.15.6",
"@babel/preset-typescript": "7.15.0",
"@expo/webpack-config": "^0.17.3",
"@nomiclabs/hardhat-ethers": "^2.0.1",
"@nomiclabs/hardhat-waffle": "^2.0.1",
"@openzeppelin/contracts": "^4.3.0",
"@types/jest": "^26.0.20",
"@types/node": "14.14.22",
"@types/react": "~18.0.24",
"@types/react-native": "~0.70.6",
"@typescript-eslint/eslint-plugin": "^4.0.1",
"@typescript-eslint/parser": "^4.0.1",
"app-root-path": "3.0.0",
"babel-jest": "27.2.3",
"chai": "^4.2.0",
"chokidar": "3.5.1",
"commitizen": "4.2.3",
"cz-conventional-changelog": "^3.2.0",
"dotenv": "8.2.0",
"enzyme": "3.11.0",
"enzyme-adapter-react-16": "1.15.7",
"eslint": "^7.8.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-eslint-comments": "^3.2.0",
"eslint-plugin-functional": "^3.0.2",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-react": "7.22.0",
"eslint-plugin-react-native": "3.10.0",
"ethereum-waffle": "^3.2.1",
"gh-pages": "^3.2.3",
"hardhat": "2.0.6",
"husky": "4.3.8",
"jest": "26.6.3",
"lint-staged": "10.5.3",
"platform-detect": "3.0.1",
"prettier": "2.2.1",
"react-test-renderer": "18.2.0",
"ts-node": "9.1.1",
"typescript": "^4.6.3"
},
"scripts": {
"start": "expo start --dev-client",
"android": "expo run:android",
"ios": "expo run:ios",
"web": "node_modules/.bin/ts-node scripts/web",
"audit": "npx yarn-audit-fix",
"test": "npx hardhat test && jest",
"web:deploy": "expo build:web && gh-pages -d web-build",
"postinstall": "npx rn-nodeify --install crypto,http,https,os,assert,url,stream,events --yarn"
},
"version": "1.0.0",
"private": true,
"name": "gameapp",
"homepage": "https://cawfree.github.io/create-react-native-dapp",
"license": "MIT",
"contributors": [
{
"name": "@cawfree",
"url": "https://github.com/cawfree"
}
],
"keywords": [
"react",
"react-native",
"blockchain",
"dapp",
"ethereum",
"web3",
"starter",
"react-native-web"
],
"react-native": {
"stream": "stream-browserify",
"crypto": "react-native-crypto",
"path": "path-browserify",
"process": "node-libs-browser/mock/process",
"http": "@tradle/react-native-http",
"https": "https-browserify",
"os": "react-native-os",
"_stream_transform": "readable-stream/transform",
"_stream_readable": "readable-stream/readable",
"_stream_writable": "readable-stream/writable",
"_stream_duplex": "readable-stream/duplex",
"_stream_passthrough": "readable-stream/passthrough"
},
"jest": {
"preset": "react-native",
"testMatch": [
"**/__tests__/frontend/**/*.[jt]s?(x)"
],
"transformIgnorePatterns": [
"node_modules/(?!@ngrx|(?!deck.gl)|ng-dynamic)"
]
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"husky": {
"hooks": {
"prepare-commit-msg": "exec < /dev/tty && git cz --hook",
"pre-commit": "lint-staged && tsc",
"pre-push": "test"
}
},
"lint-staged": {
"*.{ts,tsx,js,jsx}": "eslint --fix --ext '.ts,.tsx,.js,.jsx' -c .eslintrc.json"
},
"browser": {
"stream": "stream-browserify",
"crypto": "react-native-crypto",
"path": "path-browserify",
"process": "node-libs-browser/mock/process",
"http": "@tradle/react-native-http",
"https": "https-browserify",
"os": "react-native-os",
"_stream_transform": "readable-stream/transform",
"_stream_readable": "readable-stream/readable",
"_stream_writable": "readable-stream/writable",
"_stream_duplex": "readable-stream/duplex",
"_stream_passthrough": "readable-stream/passthrough"
}
}
Login screen
import { useMoralis } from 'react-moralis';
import { useWalletConnect } from '@walletconnect/react-native-dapp';
import { enableViaWalletConnect } from '../Moralis/enableViaWalletConnect';
import { View } from 'react-native';
import { Button } from 'react-native';
export const Login=()=>{
const connector = useWalletConnect();
const {
authenticate,
authError,
Moralis,
} = useMoralis();
const handleAuth = () => {
Moralis.enableWeb3 = enableViaWalletConnect;
authenticate({ connector }).then((res) => {
if (authError) {
console.log('authError', authError);
} else {
console.log('success', res);
}
});
};
return(
<View
style={{flex:1,justifyContent: 'center',alignItems:'center'}}
>
<Button
title='Loging'
onPress={handleAuth}
/>
</View>
)
}
enableViaWalletConnect.js
import WalletConnect from '@walletconnect/client';
import Web3 from 'web3';
import { AbstractProvider } from 'web3-core';
import { JsonRpcPayload, JsonRpcResponse } from 'web3-core-helpers';
// eslint-disable-next-line functional/prefer-readonly-type
export async function enableViaWalletConnect({
connector,
}: {
connector: WalletConnect;
}) {
// @ts-ignore
const { connector: newConnector } = await connector.connect();
const makeJsonRpcResponse = (
payload: JsonRpcPayload,
result: any,
error?: Error
): JsonRpcResponse => ({
id: +payload.id,
jsonrpc: payload.jsonrpc,
result,
error: error ? error.message : undefined,
});
const abstractProvider: AbstractProvider = {
sendAsync: (payload, callback) => {
newConnector
.sendCustomRequest(payload)
.then((result) => callback(null, makeJsonRpcResponse(payload, result)))
.catch((error) =>
callback(error, makeJsonRpcResponse(payload, null, error))
);
},
send: (payload, callback) => {
newConnector
.sendCustomRequest(payload)
.then((result) => callback(null, makeJsonRpcResponse(payload, result)))
.catch((error) =>
callback(error, makeJsonRpcResponse(payload, null, error))
);
},
connected: newConnector.connected,
};
const web3 = new Web3(AbstractProvider);
return web3;
}
this code opens my wallet and ask for connect , when click on connect button it returns on my app and
give error “Promise handle rejection : document is not defined in Window”
at handleAuth
promise ends with no authError
and my wallet address store in connector.accounts,
but Moralis.isAuthenticated is still false & Moralis.user is null
React Native : document is not defined in Window
that is solved, I was doing a mistake
I was used AbstractProvider in place of abstractProvider in enableViaWalletConnect.js file
after changing that i will get another error ,
“rejection Error: Missing web3 instance, make sure to call Moralis.enableWeb3() or Moralis.authenticate()”
1 Like