-
Notifications
You must be signed in to change notification settings - Fork 150
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Invariant Violation: Failed to call into JavaScript module method WebViewMessageHandler1.onMessage() #357
Comments
hi, @ashutoshkumar160 |
yes when i am editing it i can see full code , but when posting comment few lines are disappearing .. let me try in message |
this contains the sample code , just change the file extension to tsx from txt |
@YanYuanFE i have added the code file by changing its file type from tsx to txt |
same error for me
iOS: OK |
@YanYuanFE are you testing this on mac or windows? i am using windows and it is not working with the above dependencies mentioned in package.json and the sample code given in the sign.txt. |
The problem you are running into has to do with WebView, more specificaly with the onMessage={} prop in WebView, version 13.6.4 works fine on IOS but not on android. if you force the peerDependencie of the signature-canvas for the react-native-webview to be 10.10.2 it will work on android but not on ios. context: |
Hi, I have just run into this issue. After installing webview in my expo project this error stopped. I installed it with I'd love to provide some insight as to why or if this actually fixes the issue but I'm quite new to expo and react native 😅 . If someone could shed some light into this I would appreciate it. |
it will be good if you can share your package.json .. As for me it is not working even after installing the webview |
i tried by downgrading webview version but sadly i am running into same issue , once i start drawing it throws an error |
I was having the same issue. I also tried removing react-native-webview and installing it again through Can you check if you have the same in your package.json file? |
If you build the app with the latest version of react-native-webview using gradle it works fine, it just does not work in expo for me. |
react-native-webview gets installed with react-native-sigantuer-canvas as a peer dependency. you will have to force install a specific version if you want to change webview. |
I attach the package.json file: Notes:
|
i'm fix this use "react-native-webview": "^13.6.4" import Signature from "react-native-signature-canvas"; |
Invariant Violation: Failed to call into JavaScript module method WebViewMessageHandler1.onMessage(). Module has not been registered as callable.
Bridgeless Mode: false. Registered callable JavaScript modules (n = 12): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, HMRClient, AppRegistry, RCTEventEmitter, RNCWebViewMessagingModule.
A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there
is an early initialization error when loading React Native., js engine: hermes
Steps to Reproduce :
followed the steps mentioned in docs after pre requisites (steps 1 -7)- https://docs.expo.dev/router/installation/
code is :::
`import React, { useState } from "react";
import { StyleSheet, Text, View, Image } from "react-native";
import Signature from "react-native-signature-canvas";
const SignatureScreen = () => {
const [signature, setSign] = useState(null);
const handleOK = (signature: React.SetStateAction) => {
console.log(signature);
setSign(signature);
};
const handleEmpty = () => {
console.log("Empty");
};
const style =
.m-signature-pad--footer .button { background-color: red; color: #FFF; }
;return (
<View style={{ flex: 1 }}>
{signature ? (
<Image
resizeMode={"contain"}
style={{ width: 335, height: 114 }}
source={{ uri: signature }}
/>
) : null}
);
};
const styles = StyleSheet.create({
preview: {
width: 335,
height: 114,
backgroundColor: "#F8F8F8",
justifyContent: "center",
alignItems: "center",
marginTop: 15,
},
previewText: {
color: "#FFF",
fontSize: 14,
height: 40,
lineHeight: 40,
paddingLeft: 10,
paddingRight: 10,
backgroundColor: "#69B2FF",
width: 120,
textAlign: "center",
marginTop: 10,
},
});
export default SignatureScreen;
`
package.json is :::
{ "name": "demoapp1", "version": "1.0.0", "main": "expo-router/entry", "scripts": { "start": "expo start", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web" }, "dependencies": { "expo": "~50.0.14", "expo-constants": "~15.4.5", "expo-linking": "~6.2.2", "expo-router": "~3.4.8", "expo-status-bar": "~1.11.1", "react": "18.2.0", "react-native": "0.73.6", "react-native-safe-area-context": "4.8.2", "react-native-screens": "~3.29.0", "react-native-signature-canvas": "^4.7.2", "react-native-webview": "^13.8.4" }, "devDependencies": { "@babel/core": "^7.20.0", "@types/react": "~18.2.45", "typescript": "^5.1.3" }, "private": true }
The text was updated successfully, but these errors were encountered: