How to integrate webr quarto html output into an existing webpage?

Question

I'm a somewhat experienced R coder, but I have very little knowledge in the HTML world. I've followed the instructions provided here to create a Webr-based Quarto document. It renders the html and runs the code when the html doc is opened in my browser locally.

I would like to integrate these Webr-quarto documents in my university learning page. Could anybody advise how to do this?

I have tried embedding the html output directly, but it does not run and remains "Loading" (screenshot attached).

Code looks like this:

---
title: "webr_exercises"
format: html
engine: knitr
resources:
  - webr-serviceworker.js
  - webr-worker.js
filters: 
  - webr
webr:
  packages: ['ggplot2', 'dplyr']

---

## Quarto

Quarto enables you to weave together content and executable code into a finished document. To learn more about Quarto see <https://quarto.org>.

```{webr-r}
plot(pressure)
```

Answer 1

I wouldn't recommend using service worker option with webR. (Especially on an LMS.)

Instead, please use "automatic", which will default into either post-message or shared-array-buffer (Documentation). The latter communication channel does require header changes regarding how the LMS is serving the document.

Next, I would suggest using Quarto HTML's embed-resources option to directly embed webr.mjs, Monaco Editor, and FontAwesome that are used by the {quarto-webr} extension.

The following Quarto HTML document with these changes should work:

---
title: "webR Document"
format:
  html:
    embed-resources: true
engine: knitr
webr:
  packages: ['ggplot2', 'dplyr']
filters:
  - webr
---

Sample interactive cell

```{webr-r}
plot(pressure)
```

From there, you should be able to upload just the .html file. Without the embed-resources option, you would need to upload the .html file and the *_files folder contents to ensure all resources would be available.

For more issues, you may want to raise this as an issue on the project repository:

https://github.com/coatless/quarto-webr/issues