thebe icon indicating copy to clipboard operation
thebe copied to clipboard

Missing global variable in the `Window` interface

Open ManonMarchand opened this issue 2 years ago • 4 comments

Describe the bug

Hi thebe devs and thanks for your software!

Context

We (@bmatthieu3 and I) 're trying to output a jupyter widget (ipyaladin) with thebe-lite.

This widget is written in JS and exports a variable A to window. It works in jupyterlite. See https://cds-astro.github.io/jupyterlite/retro/notebooks/index.html?path=01-intro-to-python-vizier-and-ipyaladin.ipynb

The issue

But with thebe-lite, the widget cannot export A in window and we don't get why. See a live example here :

https://manonmarchand.github.io/draft-thebe-jupyterlite-app/aladin-test

where we get the following issue in the console :

Uncaught (in promise) ReferenceError: A is not defined

And indeed A is not there. A second run of the cell trying to output the widget gets a different error :

Error: Mismatched anonymous define() module: function(){"use strict";var Zg=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function Tg(B){return B&&B.__esModule&&Object.prototype.hasOwnProperty.call(B,"default")?B.default:B}var NB={exports:{}};/*!
 * jQuery JavaScript Library v3.6.1
 * https://jquery.com/

​Do you know what's happening?

Thanks a lot, and we hope this is the right place to ask the question.

Reproduce the bug

https://manonmarchand.github.io/draft-thebe-jupyterlite-app/aladin-test

List your environment

The page is generated with the following steps :

jobs:
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - name: Setup Pages
        uses: actions/configure-pages@v3
      - uses: actions/setup-node@v3
        with:
          node-version: 18.x
      - name: Install MyST Markdown
        run: npm install -g mystmd
      - name: Build HTML Assets
        run: myst build --html
      - name: Upload artifact
        uses: actions/upload-pages-artifact@v1
        with:
          path: './_build/html'
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v2

that can be found in this repo: https://github.com/ManonMarchand/draft-thebe-jupyterlite-app

ManonMarchand avatar Aug 24 '23 13:08 ManonMarchand

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 Aug 24 '23 13:08 welcome[bot]

Thanks for reporting @ManonMarchand.

I think this might be the first custom widget we've tried to use with the latest thebe! Just to note that I can reproduce the issue outside of lite using the config thebe: true and running against a local server, which should make debugging a little easier.

stevejpurves avatar Aug 31 '23 12:08 stevejpurves

Thanks a lot for looking into it!

By the way our custom widget links this app https://aladin.cds.unistra.fr/AladinLite/planets-explorer/ with the notebooks (in case you wanna take a tour on Mars)

ManonMarchand avatar Aug 31 '23 14:08 ManonMarchand

🙌🏼 it's a very cool widget, I was checking out some nebula whilst trying to debug earlier 😍

stevejpurves avatar Aug 31 '23 20:08 stevejpurves