Error evaluating injectedJavaScript

[sonytooo]

Hi,
It seems that I have this error only on a ios simulator. It works on real devices (both Android and ios). Tested with Expo version: "33.0.0" and WebView (react-native-webview) version > 5.0.0.

The only thing I've noticed is that the error message appears with a little delay after the building of the bundle is finished. It works fine when I import the WebView from react-native but crashes with the react-native-webview library. Do you have any ideas?

[jsamr]

@sonytooo The injected script is here: src/HTMLTable/script.ts. Indeed, there is no return type used.

Can you provide a minimal reproduction? Are you using WKWebView or UIWebView?

[jsamr]

@sonytooo I see two related issues from react-native-webview:

• Error evaluating injectedJavaScript: This is possibly due to an unsupported return type. Try adding true to the end of your injectedJavaScript string. react-native-webview/react-native-webview#502
• Error evaluating injectedJavaScript: This is possibly due to an unsupported return type. Try adding true to the end of your injectedJavaScript string. react-native-webview/react-native-webview#341

They suggest executing code in a closure. I'll add a patch, and you'll be able to test and tell me if the error remains.

[jsamr]

@sonytooo please try npm install react-native-render-html-table-bridge@0.4.0-rc.1 and tell me if the bug persists.

[jsamr]

@sonytooo any news?

[janrop]

After upgrading to 0.4.0-rc.1 the issue seems to persist.

Error evaluating injectedJavaScript: This is possibly due to an unsupported return type. Try adding true to the end of your injectedJavaScript string.

__45-[ABI33_0_0RNCWKWebView evaluateJS:thenCall:]_block_invoke
    ABI33_0_0RNCWKWebView.m:767
WTF::Function<void (API::SerializedScriptValue*, bool, WebCore::ExceptionDetails const&, WebKit::CallbackBase::Error)>::CallableWrapper<-[WKWebView _evaluateJavaScript:forceUserGesture:completionHandler:]::$_0>::call(API::SerializedScriptValue*, bool, WebCore::ExceptionDetails const&, WebKit::CallbackBase::Error)
WebKit::GenericCallback<API::SerializedScriptValue*, bool, WebCore::ExceptionDetails const&>::performCallbackWithReturnValue(API::SerializedScriptValue*, bool, WebCore::ExceptionDetails const&)
WebKit::WebPageProxy::scriptValueCallback(IPC::DataReference const&, bool, WebCore::ExceptionDetails const&, WebKit::CallbackID)
WebKit::WebPageProxy::didReceiveMessage(IPC::Connection&, IPC::Decoder&)
IPC::MessageReceiverMap::dispatchMessage(IPC::Connection&, IPC::Decoder&)
WebKit::WebProcessProxy::didReceiveMessage(IPC::Connection&, IPC::Decoder&)
IPC::Connection::dispatchMessage(std::__1::unique_ptr<IPC::Decoder, std::__1::default_delete<IPC::Decoder> >)
IPC::Connection::dispatchIncomingMessages()
WTF::RunLoop::performWork()
WTF::RunLoop::performWork(void*)
__CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION__
__CFRunLoopDoSources0
__CFRunLoopRun
CFRunLoopRunSpecific
GSEventRunModal
UIApplicationMain
main
start

I tried clearing my packager cache and I am using the Minimal working example

[superKalo]

@jsamr thank you for a fix in v0.4.0-rc.1! I confirm, problem is resolved on our end with this version! :)

PS: My colleague @sonytooo says thanks too! Sorry that he couldn't reply to you earlier.

[janrop]

@jsamr thank you for a fix in v0.4.0-rc.1! I confirm, problem is resolved on our end with this version! :)

PS: My colleague @sonytooo says thanks too! Sorry that he couldn't reply to you earlier.

Could you tell me your other dependencies versions?
I am still experiencing the issue on:

expo: "^33.0.0"
react-native-render-html": "^4.1.2"
react-native-render-html-table-bridge": "^0.4.0-rc.2"
react-native-snap-carousel": "^3.6.0"
react-native-webview": "^5.8.1"

[superKalo]

Could you tell me your other dependencies versions?
I am still experiencing the issue on:

expo: "^33.0.0"
react-native-render-html": "^4.1.2"
react-native-render-html-table-bridge": "^0.4.0-rc.2"
react-native-snap-carousel": "^3.6.0"
react-native-webview": "^5.8.1"

Same for everything, except we don'h have react-native-snap-carousel and we are using react-native-webview at v5.12.1. Try to update it maybe?

One more thing is that we're using fixed versions of these libs. Maybe this helps:

"expo": "33.0.0",
"react-native-render-html": "4.1.2",
"react-native-render-html-table-bridge": "0.4.0-rc.1",
"react-native-webview": "5.12.1",

I assume you know, but make sure you start your project with expo r -c, so that the old version is not cached by some chance.

[janrop]

Unfortunately I am still getting the same error, even after using the exact same dependencies.

This ist my components displaying the html:

import React, {PureComponent} from 'react';
import { View, Text } from 'react-native';
import HTML from 'react-native-render-html';
import { IGNORED_TAGS, alterNode, makeTableRenderer } from 'react-native-render-html-table-bridge';
import WebView from 'react-native-webview';
import styles from '../constants/Styles';
import Colors from '../constants/Colors';

const config = {
    WebViewComponent: WebView
};

const renderers = {
  table: makeTableRenderer(config)
};

const htmlConfig = {
  alterNode,
  renderers,
  ignoredTags: IGNORED_TAGS,
  tagsStyles: styles.htmlStyles,
  listsPrefixesRenderers: {
    ol: (htmlAttribs, children, convertedCSSStyles, passProps) => {
      return (
        <Text allowFontScaling={passProps.allowFontScaling} style={{
          marginRight: 5,
          marginTop: 1,
          fontSize: 14,
          color: Colors.app.text
        }}>{ passProps.index + 1 })</Text>
      )
    },
    ul: (htmlAttribs, children, convertedCSSStyles, passProps) => {
      return (
        <View style={{
          marginRight: 10,
          width: 14 / 2.8,
          height: 14 / 2.8,
          marginTop: 14 / 2 + 1,
          borderRadius: 14 / 2.8,
          backgroundColor: Colors.app.text
        }} />
      );
    }
  }
};

export default class Html extends PureComponent {
  render() {
    const { html } = this.props;
    console.log(html);
    return (
      <HTML html={html} {...htmlConfig}/>
    )
  }
}

And this is the html I am trying to render:

<table>
<thead>
<tr>
<th>Option</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>data</td>
<td>path to data files to supply the data that will be passed into templates.</td>
</tr>
<tr>
<td>engine</td>
<td>engine to be used for processing templates. Handlebars is the default.</td>
</tr>
<tr>
<td>ext</td>
<td>extension to be used for dest files.</td>
</tr>
</tbody>
</table>

Is there any more Information I can provide for debugging?

[jsamr]

@janrop @superKalo Perhaps the bug is orthogonal to the dependency tree, and instead related to the iOS version of the terminal device you tested. Could you please provide a list of terminals you tested, and the output of those tests?

[janrop]

How do describe a terminal? After your comment I tried running it on devices and it seems to work there. Only the Simulator still shows the error message.

[jsamr]

@janrop That's a confusion of words of my own! In french « terminal » stands for « device »; I just mixed the two languages ^^