r-wasm / webr

The statistical language R compiled to WebAssembly via Emscripten, for use in web browsers and Node.
https://docs.r-wasm.org/webr/latest/
Other
874 stars 68 forks source link

Unable to plot an image on a canvas in Safari Version 17.2 #479

Open baogorek opened 2 months ago

baogorek commented 2 months ago

Safari Version 17.2 (19617.1.17.11.9)

This example, https://github.com/baogorek/Miscellaneous/blob/master/R-code/hello-webR.html, works in Chrome and Edge. What you should see is image

But if you see nothing after "Hello, World! x = 12," then you've reproduced the problem.

I know some of these messages are not related to the error (Issue 189). image

It appears that the problem is in the way that the image is being handled and sent to the canvas.

      const rCode2 = `
          webr::install("ggplot2")
          library(ggplot2)
          webr::canvas()
          x <- rnorm(100)
          y <- rnorm(100)
          df <- data.frame(x=x, y=y)
          # Plot with axes, points, and labels all in one frame
          p <- ggplot(df, aes(x=x, y=y)) + geom_point()
          print(p)
          dev.off()
      `;

      await webR.evalRVoid(rCode2);

        for (;;) {
          const output = await webR.read();
          switch (output.type) {
            case 'canvas':
              if (output.data.event === 'canvasImage') {
                canvas.getContext('2d').drawImage(output.data.image, 0, 0);
              } else if (output.data.event === 'canvasNewPage') {
                 console.log("Not doing anything");
              }
              break;
            default:
              console.log(output);
          }
        }

Let me know if I can be of further help.

georgestagg commented 1 month ago

Please could you try again with the latest webR build? Currently I am unable to reproduce, the image generates OK for me right now.

Screenshot 2024-09-27 at 14 55 28

baogorek commented 1 month ago

@georgestagg since the script is importing from 'https://webr.r-wasm.org/latest/webr.mjs', using the latest version should be automatic, right?

I am still getting the same error this morning, but this is a corporate controlled Mac and I'm wondering if there are some extra security measures in place

Any other diagnostic ideas?

georgestagg commented 1 month ago

since the script is importing from 'https://webr.r-wasm.org/latest/webr.mjs', using the latest version should be automatic, right?

Yes, I had pushed an update and wondered if the change I made was related. I suppose it is not.

I am still getting the same error this morning, but this is a corporate controlled Mac and I'm wondering if there are some extra security measures in place

Interesting! Perhaps... The only error I have not seen before is the NotReadableError. The cross-origin errors are not ideal, but if it were a breaking issue you would not see the result of x = 12 in text output.

I wonder if OffScreenCanvas is not available on your Safari. Could you please open a console in devtools and show me the output of running OffScreenCanvas. If it is undefined or some other error occurs, then Canvas graphics won't work on your machine - but I can show you a workaround if that is indeed the case.

baogorek commented 1 month ago

Hi @georgestagg , I do see that OffscreenCanvas is defined:

image

For what it's worth, o1 gave me this test, which completed successfully and did indeed give me a red rectangle in Safari 17.2:

(async function() {
  try {
    // Create an OffscreenCanvas
    const offscreen = new OffscreenCanvas(200, 200);
    const ctx = offscreen.getContext('2d');

    // Draw a red rectangle
    ctx.fillStyle = 'red';
    ctx.fillRect(0, 0, 200, 200);

    // Transfer to ImageBitmap
    const bitmap = offscreen.transferToImageBitmap();

    // Create an on-screen canvas
    const canvas = document.createElement('canvas');
    canvas.width = 200;
    canvas.height = 200;
    document.body.appendChild(canvas);

    const context = canvas.getContext('2d');
    context.drawImage(bitmap, 0, 0);

    console.log('OffscreenCanvas test succeeded.');
  } catch (error) {
    console.error('OffscreenCanvas test failed:', error);
  }
})();

Update: I just got a base plot to work in Safari 17.2 (should have tried that first!). @georgestagg , the line that blows it all up is webr::install("ggplot2"). Even if I don't load the ggplot2 library, adding that line in any R code snippet stops the whole thing from working.

I just dumped the cache in Chrome and watched the network activity as all the ggplot2 dependencies were downloaded. Not so for Safari 17.2. image

georgestagg commented 3 weeks ago

Interesting! So the issue is not with plotting but when loading a package, possibly glue. Thanks, that's useful.

I'm still unable to reproduce on Safari Version 17.6, but I'll mark this as a bug and try and find a slightly older version of macOS with Safari 17.2 to experiment with.