thebe icon indicating copy to clipboard operation
thebe copied to clipboard

Error: Failed to construct 'Worker' -- when trying to use JupyterLite

Open sskagemo opened this issue 2 years ago • 4 comments

Describe the bug

(Sorry if this is already documented elsewhere, I've tried to look through and search in existing issues and documentation, but I have to admit that this is a bit beyond my field of competence ...)

context When I try to set up my page at https://sskagemo.github.io/pythonevangelisten.no/blog/2023/07/test-av-thebe-for-interaktiv-kode-i-nettleseren/ (sorry for the Norwegian ...) similar to your demo of JuypyterLite, here https://executablebooks.github.io/thebe/lite.html

expectation I expected it to work in a similar way

bug But instead the code-block does not change to interactive mode (I have configured the code-selector with "selector": "code")

I've looked into the Chrome developer tools, and in the console I see the following error:

tslib.es6.js:72 Uncaught (in promise) Error: Failed to construct 'Worker': Script at 'https://unpkg.com/thebe-lite@latest/dist/lib/328.thebe-lite.min.js' cannot be accessed from origin 'https://sskagemo.github.io'.
    at F.initWorker (kernel.js:32:16)
    at new F (kernel.js:18:29)
    at create (index.js:56:24)
    at async w.startNew (kernels.js:116:15)
    at async P.startNew (sessions.js:94:15)
    at async index.js:347:19
    at async t.startSession (restapi.js:89:11)
    at async c.startNew (manager.js:135:15)

problem This is a problem for people trying to do what is documented here https://mystmd.org/thebe/quickstart-lite (at least that was what I was trying to do :-))

Reproduce the bug

Test the code on https://sskagemo.github.io/pythonevangelisten.no/blog/2023/07/test-av-thebe-for-interaktiv-kode-i-nettleseren/

List your environment

Chrome Versjon 114.0.5735.199 on Windows 11 Enterprise

sskagemo avatar Jul 11 '23 17:07 sskagemo

Thanks for opening your first issue here! Engagement like this is essential for open source projects! :hugs:
If you haven't done so already, check out EBP's Code of Conduct. Also, please try to follow the issue template as it helps other community members to contribute more effectively.
If your issue is a feature request, others may react to it, to raise its prominence (see Feature Voting).
Welcome to the EBP community! :tada:

welcome[bot] avatar Jul 11 '23 17:07 welcome[bot]

Hi @sskagemo! thanks for reporting this.

Looks like there's a CORS issue stopping the chunks from loading -- that's unexpected but perhaps the unpkg.com route laid out in the docs is going to be problematic for github pages.

The best thing to do would be to deploy all the thebe-lite javascript assets with your build, if you look at the github pages deploy of the thebe example site you'll see that we deploy the javascript rather than trying to pick it up from cdn.

Your script tag would then change to something like:

<script type="text/javascript" src="/thebe-lite.min.js"></script>

There is a script available in packages/core/bin/copy-thebe-assets.cjs that can help with the copy step (also see this PR for running that with npx) I'll need to update the docs to reflect this way of doing things.

stevejpurves avatar Jul 11 '23 20:07 stevejpurves

Thank you, I'll try that!

sskagemo avatar Jul 13 '23 06:07 sskagemo

@sskagemo I've been working on improving this -- still some way to go but see this repo for an example deployment setup https://github.com/stevejpurves/lite-quickstart-example and updated docs https://mystmd.org/thebe/quickstart-lite

stevejpurves avatar Jul 14 '23 11:07 stevejpurves