Feature/added jsi nterface

.gitignore

@@ -1,4 +1,14 @@
+# node generated folders
 node_modules/
 lib/
+yarn-error.log
 
+# mac temp file
 .DS_Store
+
+# Android studio file
+modules.xml
+*.iml
+vcs.xml
+workspace.xml
+

examples/native/App.js

@@ -1,37 +1,49 @@
+import { types } from '@babel/core';
 import React from 'react';
-import { StyleSheet, Alert, SafeAreaView } from 'react-native';
+import { StyleSheet, Alert, SafeAreaView, Button } from 'react-native';
 import { WebView } from 'react-native-webview';
 import { withJavascriptInterface } from 'react-native-webview-comlink';
 
+var webInterface
+
+const onButtonClick = () => {
+  console.log("onButtonClick ::");
+    // TODO
+    // if(webInterface){
+    //   console.log("onButtonClick :: webInterface is not null");
+    //   webInterface.mobileToWeb("Mobile To Web");
+    // } else {
+    //   console.log("onButtonClick :: webInterface is null");
+    // }
+}
+
+// the root obj to be exposed to web
+const jsInterface = {
+    webToMobile(event) {
+      console.log("event ::"+event);
+  },
+  setMobileInterface( webInterface ) {
+    console.log("setMobileInterface :: before "+this.webInterface)
+
+
+    setTimeout(() => {
+      webInterface("mobile to Web 1")
+    }, 2000)
+
+    setTimeout(() => {
+      webInterface("mobile to Web 2")
+    }, 4000)
+      // TODO
+      // this.webInterface = webInterface
+      // console.log("setMobileInterface :: after "+this.webInterface)
+  }
+}
 export default class App extends React.Component {
   constructor(props) {
     super(props);
 
-    // the root obj to be exposed to web
-    const rootObj = {
-      alert: (title, message, onYes, onNo) => {
-        const withCleanup = (cb) => () => {
-          cb();
-          onYes.release();
-          onNo.release();
-        };
-        Alert.alert(title, message, [
-          {
-            text: 'YES',
-            onPress: withCleanup(onYes),
-          },
-          {
-            text: 'NO',
-            onPress: withCleanup(onNo),
-          },
-        ]);
-      },
-      someMethodWithError: () =>
-        Promise.reject(Object.assign(new Error('something wrong'), { code: -1 })),
-    };
-
     // create higher-order WebView component
-    this.WebViewComponent = withJavascriptInterface(rootObj, 'MyJSInterface', {
+    this.WebViewComponent = withJavascriptInterface(jsInterface, 'CoreJSInterface', {
       forwardRef: true,
       log: true,
     })(WebView);
@@ -45,8 +57,13 @@ export default class App extends React.Component {
     // you can also use your host ip address by editting `uri`
     // const uri = 'http://<you host ip address>:3000';
     const uri = 'http://localhost:3000';
+    //const uri = 'http://172.20.10.11:3000'; // on Work Mac connected to public wifi and no proxy in emulator
+    //const uri = 'https://638082b614b0af602674e1bf--capable-lollipop-05625d.netlify.app/';
     return (
       <SafeAreaView style={styles.container}>
+        <Button style={styles.button} title='Test Button' onPress={() => {
+          onButtonClick();
+        }}/>
         <this.WebViewComponent
           style={styles.container}
           source={{ uri }}
@@ -68,4 +85,11 @@ const styles = StyleSheet.create({
   container: {
     flex: 1,
   },
+  button: {
+    flex: 1,
+  },
 });
+
+
+
+

examples/native/android/app/src/main/AndroidManifest.xml

@@ -12,6 +12,7 @@
       <activity
         android:name=".MainActivity"
         android:label="@string/app_name"
+        android:exported="true"
         android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
         android:windowSoftInputMode="adjustResize">
         <intent-filter>

examples/native/android/build.gradle

@@ -4,13 +4,14 @@ buildscript {
     ext {
         buildToolsVersion = "30.0.2"
         minSdkVersion = 21
-        compileSdkVersion = 30
-        targetSdkVersion = 30
+        compileSdkVersion = 33
+        targetSdkVersion = 33
         ndkVersion = "20.1.5948944"
     }
     repositories {
-        jcenter()
+        mavenCentral()
         google()
+        mavenLocal()
     }
     dependencies {
         classpath 'com.android.tools.build:gradle:4.2.2'
@@ -31,7 +32,7 @@ allprojects {
             url "$rootDir/../node_modules/jsc-android/dist"
         }
         google()
-        jcenter()
+        mavenCentral()
         maven { url 'https://www.jitpack.io' }
     }
 }

examples/native/android/gradle.properties

@@ -21,4 +21,4 @@ android.useAndroidX=true
 android.enableJetifier=true
 
 # Version of flipper SDK to use with React Native
-FLIPPER_VERSION=0.75.1
+FLIPPER_VERSION=0.99.0

examples/native/package.json

@@ -8,7 +8,7 @@
     "react": "^17.0.1",
     "react-native": "^0.64.2",
     "react-native-webview": "^11.13.0",
-    "react-native-webview-comlink": "^0.7.4"
+    "react-native-webview-comlink": "../../src"
   },
   "devDependencies": {
     "metro-react-native-babel-preset": "^0.66.2"