Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-77282

Static ES6 modules don't work in QWebEnginePage

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: P2: Important
    • Resolution: Cannot Reproduce
    • Affects Version/s: 5.12.3, 5.14.0 Beta2
    • Fix Version/s: 5.14.1, 5.15.4
    • Component/s: WebEngine
    • Labels:
      None
    • Environment:
      Anki 2.1.13 (from FlatHub), PyQt 5.12.2, Qt 5.12.3
    • Platform/s:
      Linux/X11
    • Commits:
      7f1a6eede94d448436d42691d76e4fd76190b5fc (qt/qtwebengine/5.15)

      Description

      I'd like to inject Javascript into my Anki cards, and I'd like to use ES6 modules for ease of maintenance. However, this doesn't appear to work.

      Anki internally uses a QWebEnginePage with setHtml() to build the page. The HTML looks something like this (lots of stuff omitted):

      <html class=" webkit chrome linux js">
        <head>
          <title>main webview</title>
        </head>
        <body>
          <div id="qa">a
            <script type="module">
            import {say} from '_moduletesta.mjs';
            say("42");
          </script>
        </body>
      </html>
      

      This is _moduletesta.mjs:

      export function say(message) {
              console.log(message);
      }
      

      I believe this should print 42 to the console, but it does not. Instead, the inlined script appears to be silently ignored.

      Am I doing something wrong here, or is this expected?

      I'm using Anki 2.1.13 (built with PyQt 5.12.2 and Qt 5.12.3). Qt 5.12.3 is using Chromium 69.0.3497.128, so ES6 modules should in theory be supported.

      (This has also been posted on the Qt forums, Reddit, and the Anki support forums).

      Steps to reproduce

      1. Install Anki from Flathub
      2. Start Anki with env QTWEBENGINE_REMOTE_DEBUGGING=8080 flatpak run net.ankiweb.Anki
      3. Import QTBUG-77282.apkg file into Anki, click on deck QTBUG-77282, click Learn deck
      4. Visit localhost:8080 in Chrome, click main webview
      5. Check both cards, one with type="module" and one without. The one without type="module" prints 42 to the console, the one with type="module" doesn't.

        Attachments

        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

          Activity

            People

            Assignee:
            juri.valdmann Jüri Valdmann
            Reporter:
            runiq Patrice Peterson
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved:

                Gerrit Reviews

                There are no open Gerrit changes