@exodus/react-native-webview 11.26.1-exodus.27 → 11.26.1-exodus.28

package/.github/workflows/ios-ci.yml

@@ -0,0 +1,31 @@
+name: iOS
+on: [push, pull_request]
+jobs:
+  build:
+    runs-on: macos-12
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2.5.1
+        with:
+          node-version: 16
+      - name: Cache /node_modules
+        uses: actions/cache@v2
+        with:
+          path: node_modules
+          key: ${{ runner.os }}-yarn-${{ hashFiles('yarn.lock') }}
+      - name: Install npm dependencies
+        run: yarn --frozen-lockfile
+      - name: Install Pods
+        run: pod install
+        working-directory: example/ios
+      - name: Build iOS test app
+        run: |
+          device_name='iPhone 13'
+          device=$(xcrun simctl list devices "${device_name}" available | grep "${device_name} (")
+          re='\(([-0-9A-Fa-f]+)\)'
+          [[ $device =~ $re ]] || exit 1
+          xcodebuild -workspace WebviewExample.xcworkspace -scheme ReactTestApp -destination "platform=iOS Simulator,id=${BASH_REMATCH[1]}" CODE_SIGNING_ALLOWED=NO COMPILER_INDEX_STORE_ENABLE=NO build
+        working-directory: example/ios
+    timeout-minutes: 60

package/.github/workflows/scripts/install-vs-features.ps1

@@ -0,0 +1,108 @@
+param (
+	[Parameter(Mandatory=$true)]
+	[string[]] $Components,
+
+	[uri] $InstallerUri = "https://download.visualstudio.microsoft.com/download/pr/c4fef23e-cc45-4836-9544-70e213134bc8/1ee5717e9a1e05015756dff77eb27d554a79a6db91f2716d836df368381af9a1/vs_Enterprise.exe",
+
+	[string] $VsInstaller = "${env:System_DefaultWorkingDirectory}\vs_Enterprise.exe",
+
+	[string] $VsInstallOutputDir = "${env:System_DefaultWorkingDirectory}\vs",
+
+	[System.IO.FileInfo] $VsInstallPath = "${env:ProgramFiles(x86)}\Microsoft Visual Studio\2019\Enterprise",
+
+	[System.IO.FileInfo] $VsInstallerPath = "${env:ProgramFiles(x86)}\Microsoft Visual Studio\Installer",
+
+	[switch] $Collect = $false,
+
+	[switch] $Cleanup = $false,
+
+	[switch] $UseWebInstaller = $false
+)
+
+$Components | ForEach-Object {
+	$componentList += '--add', $_
+}
+
+$LocalVsInstaller = "$VsInstallerPath\vs_installershell.exe"
+
+$UseWebInstaller = $UseWebInstaller -or -not (Test-Path -Path "$LocalVsInstaller")
+
+if ($UseWebInstaller) {
+	Write-Host "Downloading web installer..."
+
+	Invoke-WebRequest -Method Get `
+		-Uri $InstallerUri `
+		-OutFile $VsInstaller
+
+	New-Item -ItemType directory -Path $VsInstallOutputDir
+
+	Write-Host "Running web installer to download requested components..."
+
+	Start-Process `
+		-FilePath "$VsInstaller" `
+		-ArgumentList ( `
+			'--layout', "$VsInstallOutputDir",
+			'--wait',
+			'--norestart',
+			'--quiet' + `
+			$componentList
+		) `
+		-Wait `
+		-PassThru
+
+	Write-Host "Running downloaded VS installer to add requested components..."
+
+	Start-Process `
+		-FilePath "$VsInstallOutputDir\vs_Enterprise.exe" `
+		-ArgumentList (
+			'modify',
+			'--installPath', "`"$VsInstallPath`"" ,
+			'--wait',
+			'--norestart',
+			'--quiet' + `
+			$componentList
+		) `
+		-Wait `
+		-PassThru `
+		-OutVariable returnCode
+
+	if ($Cleanup) {
+		Write-Host "Cleaning up..."
+
+		Remove-Item -Path $VsInstaller
+		Remove-Item -Path $VsInstallOutputDir -Recurse
+	}
+	
+} else {
+	Write-Host "Running local installer to add requested components..."
+
+	Start-Process `
+		-FilePath "$LocalVsInstaller" `
+		-ArgumentList (
+			'modify',
+			'--installPath', "`"$VsInstallPath`"" ,
+			'--norestart',
+			'--quiet' + `
+			$componentList
+		) `
+		-Wait `
+		-OutVariable returnCode
+}
+
+if ($Collect) {
+	Invoke-WebRequest -Method Get `
+		-Uri 'https://download.microsoft.com/download/8/3/4/834E83F6-C377-4DCE-A757-69A418B6C6DF/Collect.exe' `
+		-OutFile ${env:System_DefaultWorkingDirectory}\Collect.exe
+
+	# Should generate ${env:Temp}\vslogs.zip
+	Start-Process `
+		-FilePath "${env:System_DefaultWorkingDirectory}\Collect.exe" `
+		-Wait `
+		-PassThru
+
+	New-Item -ItemType Directory -Force ${env:System_DefaultWorkingDirectory}\vslogs
+	Expand-Archive -Path ${env:TEMP}\vslogs.zip -DestinationPath ${env:System_DefaultWorkingDirectory}\vslogs\
+
+	Write-Host "VC versions after installation:"
+	Get-ChildItem -Name "$VsInstallPath\VC\Tools\MSVC\"
+}

package/.github/workflows/stale.yml

@@ -0,0 +1,17 @@
+name: "Close stale issues and PRs"
+on:
+  schedule:
+  - cron: "0 0 * * *"
+
+jobs:
+  stale:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/stale@v3.0.14
+      with:
+        repo-token: ${{ secrets.GITHUB_TOKEN }}
+        stale-issue-message: 'Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like _still searching for solutions_ and if you found one, please open a pull request! You have 7 days until this gets closed automatically'
+        stale-pr-message: 'Hello 👋, this PR has been opened for more than 2 months with no activity on it. If you think this is a mistake please comment and ping a maintainer to get this merged ASAP! Thanks for contributing! You have 7 days until this gets closed automatically'
+        exempt-issue-label: 'Keep opened'
+        exempt-pr-label: 'Keep opened'
+        remove-stale-when-updated: true

package/.gitignore

@@ -0,0 +1,62 @@
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+.xcode.env
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+Pods/
+
+# Android/IJ
+#
+.idea
+*.iml
+.gradle
+local.properties
+lib/android/src/main/gen
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+package-lock.json
+
+# Rubygem bundles
+#
+bundles/
+
+# VS Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+android/gradle
+android/gradlew
+android/gradlew.bat
+
+lib/
+.classpath
+.project
+.settings/
+msbuild.binlog
+example/msbuild.binlog

package/.prettierrc.js

@@ -0,0 +1,10 @@
+// https://prettier.io/docs/en/options.html
+
+module.exports = {
+  // Enables semicolons at the end of statements
+  semi: true,
+  // Formats strings with single quotes ('') instead of quotes ("")
+  singleQuote: true,
+  // Adds a trailing comma at the end of all lists (including function arguments)
+  trailingComma: 'all',
+};

package/.releaserc

@@ -0,0 +1,15 @@
+{
+  "plugins": [
+    "@semantic-release/commit-analyzer",
+    "@semantic-release/release-notes-generator",
+    "@semantic-release/npm",
+    "@semantic-release/github",
+    [
+      "@semantic-release/git",
+      {
+        "assets": "package.json",
+        "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}"
+      }
+    ]
+  ]
+}

package/.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ]
+}

package/android/.gradle/buildOutputCleanup/cache.properties

@@ -0,0 +1,2 @@
+#Mon Sep 02 09:44:40 CEST 2024
+gradle.version=8.9

package/apple/RNCWebView.m

@@ -580,6 +580,14 @@ RCTAutoInsetsProtocol>
   }
 }
 #endif
+
+- (NSMutableDictionary<NSString *, id> *)baseEventWithScriptMessage:(WKScriptMessage *)message {
+    NSMutableDictionary<NSString *, id> *event = [self baseEvent];
+    NSString *messageOriginURL = message.frameInfo.request.URL.absoluteString ?: @"";
+    event[@"url"] = messageOriginURL;
+    return event;
+}
+
 /**
  * This method is called whenever JavaScript running within the web view calls:
  *   - window.webkit.messageHandlers[MessageHandlerName].postMessage
@@ -589,13 +597,13 @@ RCTAutoInsetsProtocol>
 {
   if ([message.name isEqualToString:HistoryShimName]) {
     if (_onLoadingFinish) {
-      NSMutableDictionary<NSString *, id> *event = [self baseEvent];
+      NSMutableDictionary<NSString *, id> *event = [self baseEventWithScriptMessage:message];
       [event addEntriesFromDictionary: @{@"navigationType": message.body}];
       _onLoadingFinish(event);
     }
   } else if ([message.name isEqualToString:MessageHandlerName]) {
     if (_onMessage) {
-      NSMutableDictionary<NSString *, id> *event = [self baseEvent];
+      NSMutableDictionary<NSString *, id> *event = [self baseEventWithScriptMessage:message];
       [event addEntriesFromDictionary: @{@"data": message.body}];
       _onMessage(event);
     }

package/babel.config.js

@@ -0,0 +1,11 @@
+module.exports = function(api) {
+  api && api.cache(false);
+  return {
+    env: {
+      test: {
+        presets: ['module:metro-react-native-babel-preset'],
+      },
+    },
+    presets: ['module:metro-react-native-babel-preset'],
+  };
+};

package/bin/setup

@@ -0,0 +1,26 @@
+#! /bin/bash
+
+# Node installed?
+if ! [ -x "$(command -v node)" ]; then
+  echo 'Error: node is not installed.' >&2
+
+  if ! [ -x "$(command -v brew)" ]; then
+    echo 'Go here to install: https://nodejs.org/en/download/'
+  fi
+
+  if [ -x "$(command -v brew)" ]; then
+    echo 'You have Homebrew installed, so run "brew install node".'
+  fi
+  
+  exit 1
+fi
+
+# React Native installed?
+if ! [ -x "$(command -v react-native)" ]; then
+  echo 'Error: React Native is not installed.' >&2
+  echo 'Go here: https://reactnative.dev/docs/getting-started.html' >&2
+  echo 'Use the "Building Projects With Native Code" option.'
+  exit 1
+fi
+
+# TODO: Automate setup on new machines

package/docs/Contributing.md

@@ -0,0 +1,102 @@
+# Contributing to React Native WebView
+
+First off, _thank you_ for considering contributing to the React Native Community. The community-supported packages are only possible because of amazing people like you.
+
+Secondly, we'd like the contribution experience to be as good as possible. While we are a small all-volunteer team, we are happy to hear feedback about your experience, and if we can make the docs or experience better please let us know.
+
+## How to test changes
+
+After you fork the repo, clone it to your machine, and make your changes, you'll want to test them in an app.
+
+There are two methods of testing:
+1) Testing within a clone of react-native-webview
+2) Testing in a new `react-native init` project
+
+### Testing within react-native-webview
+
+#### For all platforms:
+
+```sh
+yarn install
+```
+
+#### For Android:
+
+```sh
+yarn android
+```
+
+The Android example app will built, the Metro Bundler will launch, and the example app will be installed and started in the Android emulator.
+
+#### For iOS:
+
+```sh
+pod install --project-directory=ios
+yarn ios
+```
+
+The iOS example app will be built, the Metro bundler will launch, and the example app will be installed and started in the Simulator.
+
+#### For macOS:
+
+```sh
+pod install --project-directory=macos
+yarn macos
+```
+
+The macOS example app will be built, the Metro bundler will launch, and the example app will be installed and started.
+
+#### For Windows:
+
+```sh
+yarn windows
+```
+
+The Windows example app will be built, the Metro bundler will launch, and the example app will be installed and started.
+
+### Testing in a new `react-native init` project
+
+In a new `react-native init` project, do this:
+
+```
+$ yarn add ../react-native-webview
+$ react-native link react-native-webview
+```
+
+You may run into a problem where the `jest-haste-map` module map says react-native was added twice:
+
+```
+Loading dependency graph...(node:32651) UnhandledPromiseRejectionWarning: Error: jest-haste-map: Haste module naming collision:
+  Duplicate module name: react-native
+  Paths: /Users/myuser/TestApp/node_modules/react-native/package.json collides with /Users/myuser/TestApp/node_modules/react-native-webview/node_modules/react-native/package.json
+```
+
+Just remove the second path like this:
+
+```
+$ rm -rf ./node_modules/react-native-webview/node_modules/react-native
+```
+
+And then re-run the packager:
+
+```
+$ react-native start --reset-cache
+```
+
+When you make a change, you'll probably need to unlink, remove, re-add, and re-link `react-native-webview`:
+
+```
+$ react-native unlink react-native-webview && yarn remove react-native-webview
+$ yarn add ../react-native-webview && react-native link react-native-webview
+```
+
+## Notes
+
+- We use TypeScript.
+- After pulling this repo and installing all dependencies, you can run tests using the command: `yarn ci`
+
+## Translations
+
+This file is available at:
+
+- [Brazilian portuguese](Contributing.portuguese.md)

package/docs/Custom-Android.md

@@ -0,0 +1,222 @@
+While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code.
+
+Before you do this, you should be familiar with the concepts in [native UI components](https://reactnative.dev/docs/native-components-android). You should also familiarise yourself with the [native code for web views](https://github.com/react-native-webview/react-native-webview/blob/master/android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java), as you will have to use this as a reference when implementing new features—although a deep understanding is not required.
+
+## Native Code
+
+To get started, you'll need to create a subclass of `RNCWebViewManager`, `RNCWebView`, and `RNCWebViewClient`. In your view manager, you'll then need to override:
+
+- `createReactWebViewInstance`
+- `getName`
+- `addEventEmitters`
+
+```java
+@ReactModule(name = CustomWebViewManager.REACT_CLASS)
+public class CustomWebViewManager extends RNCWebViewManager {
+  /* This name must match what we're referring to in JS */
+  protected static final String REACT_CLASS = "RCTCustomWebView";
+
+  protected static class CustomWebViewClient extends RNCWebViewClient { }
+
+  protected static class CustomWebView extends RNCWebView {
+    public CustomWebView(ThemedReactContext reactContext) {
+      super(reactContext);
+    }
+  }
+
+  @Override
+  protected RNCWebView createRNCWebViewInstance(ThemedReactContext reactContext) {
+    return new CustomWebView(reactContext);
+  }
+
+  @Override
+  public String getName() {
+    return REACT_CLASS;
+  }
+
+  @Override
+  protected void addEventEmitters(ThemedReactContext reactContext, WebView view) {
+    view.setWebViewClient(new CustomWebViewClient());
+  }
+}
+```
+
+You'll need to follow the usual steps to [register the module](https://reactnative.dev/docs/native-modules-android#register-the-module-android-specific).
+
+### Adding New Properties
+
+To add a new property, you'll need to add it to `CustomWebView`, and then expose it in `CustomWebViewManager`.
+
+```java
+public class CustomWebViewManager extends RNCWebViewManager {
+  ...
+
+  protected static class CustomWebView extends RNCWebView {
+    public CustomWebView(ThemedReactContext reactContext) {
+      super(reactContext);
+    }
+
+    protected @Nullable String mFinalUrl;
+
+    public void setFinalUrl(String url) {
+        mFinalUrl = url;
+    }
+
+    public String getFinalUrl() {
+        return mFinalUrl;
+    }
+  }
+
+  ...
+
+  @ReactProp(name = "finalUrl")
+  public void setFinalUrl(WebView view, String url) {
+    ((CustomWebView) view).setFinalUrl(url);
+  }
+}
+```
+
+### Adding New Events
+
+For events, you'll first need to make create event subclass.
+
+```java
+// NavigationCompletedEvent.java
+public class NavigationCompletedEvent extends Event<NavigationCompletedEvent> {
+  private WritableMap mParams;
+
+  public NavigationCompletedEvent(int viewTag, WritableMap params) {
+    super(viewTag);
+    this.mParams = params;
+  }
+
+  @Override
+  public String getEventName() {
+    return "navigationCompleted";
+  }
+
+  @Override
+  public void dispatch(RCTEventEmitter rctEventEmitter) {
+    init(getViewTag());
+    rctEventEmitter.receiveEvent(getViewTag(), getEventName(), mParams);
+  }
+}
+```
+
+You can trigger the event in your web view client. You can hook existing handlers if your events are based on them.
+
+You should refer to [RNCWebViewManager.java](https://github.com/react-native-webview/react-native-webview/blob/master/android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java) in the react-native-webview codebase to see what handlers are available and how they are implemented. You can extend any methods here to provide extra functionality.
+
+```java
+public class NavigationCompletedEvent extends Event<NavigationCompletedEvent> {
+  private WritableMap mParams;
+
+  public NavigationCompletedEvent(int viewTag, WritableMap params) {
+    super(viewTag);
+    this.mParams = params;
+  }
+
+  @Override
+  public String getEventName() {
+    return "navigationCompleted";
+  }
+
+  @Override
+  public void dispatch(RCTEventEmitter rctEventEmitter) {
+    init(getViewTag());
+    rctEventEmitter.receiveEvent(getViewTag(), getEventName(), mParams);
+  }
+}
+
+// CustomWebViewManager.java
+protected static class CustomWebViewClient extends RNCWebViewClient {
+  @Override
+  public boolean shouldOverrideUrlLoading(WebView view, String url) {
+    boolean shouldOverride = super.shouldOverrideUrlLoading(view, url);
+    String finalUrl = ((CustomWebView) view).getFinalUrl();
+
+    if (!shouldOverride && url != null && finalUrl != null && new String(url).equals(finalUrl)) {
+      final WritableMap params = Arguments.createMap();
+      dispatchEvent(view, new NavigationCompletedEvent(view.getId(), params));
+    }
+
+    return shouldOverride;
+  }
+}
+```
+
+Finally, you'll need to expose the events in `CustomWebViewManager` through `getExportedCustomDirectEventTypeConstants`. Note that currently, the default implementation returns `null`, but this may change in the future.
+
+```java
+public class CustomWebViewManager extends RNCWebViewManager {
+  ...
+
+  @Override
+  public @Nullable
+  Map getExportedCustomDirectEventTypeConstants() {
+    Map<String, Object> export = super.getExportedCustomDirectEventTypeConstants();
+    if (export == null) {
+      export = MapBuilder.newHashMap();
+    }
+    export.put("navigationCompleted", MapBuilder.of("registrationName", "onNavigationCompleted"));
+    return export;
+  }
+}
+```
+
+## JavaScript Interface
+
+To use your custom web view, you may want to create a class for it. Your class must return a `WebView` component with the prop `nativeConfig.component` set to your native component (see below).
+
+To get your native component, you must use `requireNativeComponent`: the same as for regular custom components.
+
+```javascript
+import React, { Component } from 'react';
+import { requireNativeComponent } from 'react-native';
+import { WebView } from 'react-native-webview';
+
+export default class CustomWebView extends Component {
+  render() {
+    return (
+      <WebView {...this.props} nativeConfig={{ component: RCTCustomWebView }} />
+    );
+  }
+}
+
+const RCTCustomWebView = requireNativeComponent('RCTCustomWebView');
+```
+
+If you want to add custom props to your native component, you can use `nativeConfig.props` on the web view.
+
+For events, the event handler must always be set to a function. This means it isn't safe to use the event handler directly from `this.props`, as the user might not have provided one. The standard approach is to create a event handler in your class, and then invoking the event handler given in `this.props` if it exists.
+
+If you are unsure how something should be implemented from the JS side, look at [WebView.android.tsx](https://github.com/react-native-webview/react-native-webview/blob/master/src/WebView.android.tsx) in the React Native WebView source.
+
+```javascript
+export default class CustomWebView extends Component {
+  _onNavigationCompleted = (event) => {
+    const { onNavigationCompleted } = this.props;
+    onNavigationCompleted && onNavigationCompleted(event);
+  };
+
+  render() {
+    return (
+      <WebView
+        {...this.props}
+        nativeConfig={{
+          component: RCTCustomWebView,
+          props: {
+            finalUrl: this.props.finalUrl,
+            onNavigationCompleted: this._onNavigationCompleted,
+          },
+        }}
+      />
+    );
+  }
+}
+```
+## Translations
+
+This file is available at:
+
+- [Brazilian portuguese](Custom-Android.portuguese.md)