I've try to run your example code in local but this think is happen.

[itoon]

Possible Unhandled Promise Rejection (id: 0): Error: Unable to open URL: file:/// Error: Unable to open URL: file:/// at createErrorFromErrorData (blob:http://localhost:8081/f817db7d-0270-489b-9116-5ea0036b4e8a:2270:17)

How to fixed it? or I do something wrong?

[iddan]

Can you provide the full code you were trying to execute?

[itoon]

I run from your example folder

[iddan]

How did you run it?

[itoon]

I removed and ran to run it again. It's work. sorry to create issue

[benadamstyles]

@iddan Hey, thanks for all your work on this lib. Unfortunately I am also getting this error – I have tracked it down to the source prop you're passing to the WebView component – if I change source.baseUrl from / to /X, the error is then Error: Unable to open URL: file:///X. I don't really know how to proceed now though, since I don't know what baseUrl is referring to.

I would ignore this error, except that the canvas is just not displaying for me at all either!

[benadamstyles]

Update: I had to rebuild the app to get the canvas to actually render. Can't imagine why – just restarting the packager wasn't enough. The warning still happens though.

Update 2: Really weird – the canvas has stopped rendering again – all I did was reload the app. I'm really confused! I've never seen react native be flaky like this before. I'd be really grateful for any help you can give.

[iddan]

Do you use a custom setup of React Native?

[benadamstyles]

No, just the standard. Not using create-react-native-app, just the basic installation like this: https://facebook.github.io/react-native/docs/getting-started#creating-a-new-application

[iddan]

Can you provide your code please? I'd like to get a full look

[benadamstyles]

Sorry for the delay. I tried to reproduce the error in an Expo Snack, but it worked fine there without errors. If you have a gitlab account I can add you to my repo, but I can't really post all my code here. My UI code is very simple (the timeout is simply to make sure the issue is not some weird race condition):

export default class Share extends PureComponent {
  onCanvasMount = canvas => {
    if (canvas) {
      canvas.height = 600
      const ctx = canvas.getContext('2d')
      setTimeout(() => {
        ctx.fillStyle = '#f00'
        ctx.fillRect(10, 10, 100, 100)
      }, 1000)
    }
  }

  render() {
    return (
      <View style={styles.container}>
        <Canvas ref={this.onCanvasMount} />
      </View>
    )
  }
}

The error I get is:

If I change the baseUrl passed to the WebView to '', I get a different error:

And if I remove baseUrl altogether, I get:

I can't work out what the WebView is trying to load, but I guess it's some files in node_modules/react-native-canvas? Is the problem just that these files are not being bundled?

[HengCC]

i'm get the same question , is there any solution?

[iddan]

Our approach is bundeling all the required assets in the HTML to avoid accessing the file system. But I'm not sure what specifically goes wrong in your scenarios. @Leeds-eBooks I'll get back to you with a username ASAP

[HengCC]

i have try to remove baseUrl from source code, but the problem still exist, The difference is that the library seems to read the app system file.

[SergeyBazhanov]

Here is a solution for this problem: https://github.com/facebook/react-native/issues/20835#issuecomment-415950297