Log WebView User JS errors

packages/react-native-webview/src/ext-specs/NativeDdLogs.ts

@@ -0,0 +1,25 @@
+/*
+ * Unless explicitly stated otherwise all files in this repository are licensed under the Apache License Version 2.0.
+ * This product includes software developed at Datadog (https://www.datadoghq.com/).
+ * Copyright 2016-Present Datadog, Inc.
+ */
+
+/* eslint-disable @typescript-eslint/ban-types */
+import type { TurboModule } from 'react-native';
+import { TurboModuleRegistry } from 'react-native';
+
+/**
+ * Do not import this Spec directly, use DdNativeLogsType instead.
+ */
+export interface Spec extends TurboModule {
+    readonly getConstants: () => {};
+    /**
+     * Send a log with ERROR level.
+     * @param message: The message to send.
+     * @param context: The additional context to send.
+     */
+    readonly error: (message: string, context: Object) => Promise<void>;
+}
+
+// eslint-disable-next-line import/no-default-export
+export default TurboModuleRegistry.get<Spec>('DdLogs');

packages/react-native-webview/src/index.tsx

@@ -7,6 +7,7 @@ import type { WebViewMessageEvent, WebViewProps } from 'react-native-webview';
 import { WebView as RNWebView } from 'react-native-webview';
 import React, { forwardRef, useCallback } from 'react';
 
+import NativeDdLogs from './ext-specs/NativeDdLogs';
 import { NativeDdWebView } from './specs/NativeDdWebView';
 import type { DatadogMessageFormat } from './utils/format-utils';
 import { wrapJsCodeInTryAndCatch } from './utils/format-utils';
@@ -37,6 +38,7 @@ const WebViewComponent = (props: Props, ref: React.Ref<RNWebView<Props>>) => {
                     ddMessage.message != null &&
                     (props.logUserCodeErrors ?? false)
                 ) {
+                    NativeDdLogs?.error(ddMessage.message, {});
                     // TODO: Log Error through Turbo Registry native call.
                     // DdLogs.error(ddMessage.message, 'USER_CODE_WEBVIEW_ERROR');
                 }