error: Unable to resolve specifier ...

[jogibear9988]

get the following error:

    ScriptSystem.js:167 error parsing javascript Error: Unable to resolve specifier '/dist/frontend/common/IobrokerHandler.js' imported from blob:http://127.0.0.1:8000/c8415a0d-53fe-4e30-bc6c-91675ff24fdc
        at throwUnresolved (es-module-shims.js:440:11)
        at _resolve (es-module-shims.js:397:71)
        at es-module-shims.js:842:32

when running this code:

            const scriptUrl = URL.createObjectURL(new Blob([javascriptCode], { type: 'application/javascript' }));
            jsObject = await importShim(scriptUrl);

and the javascript code (in var javascriptCode) is like this:

    import { iobrokerHandler } from "/dist/frontend/common/IobrokerHandler.js";
    export function aaaa(event, element, shadowRoot) {
    }
    export function bbbb(event, eventRaisingElement, shadowRoot, instance) {
        debugger;
        iobrokerHandler._controls;
    }

whats invalid on the specifier? it is relative. I would get it if I get a 404 (if my path is wrong)

[jogibear9988]

Is this correct handling? Parent URL is already a blob url...

[guybedford]

Are you writing a custom plugin here? It would help to know how you are triggering the path to begin with. The parentUrl should never be a blob URL for es-module-shims.

[jogibear9988]

the code is here: https://github.com/iobroker-community-adapters/ioBroker.webui/blob/8edd957ff674a3abef7d6b531c0284c06827ca4b/src/frontend/scripting/ScriptSystem.ts#L170
and a sample here: http://130.61.246.67:8082/webui/index.html

my users could create their own ui's with scripts. these are loaded lazily via create object url and then using importShim.

[jogibear9988]

in my sample, if you open the screen "importShim", and switch to preview, it tries to compile the code below and load it vi importShim from a object url...

[jogibear9988]

Is the error maybe that I create object urls myself from wich I load the scripts?

[jogibear9988]

My hack to fix it atm:

      <script>
        let storedParentUrl;
        window.esmsInitOptions = {
          shimMode: true,
          mapOverrides: true,
          resolve: (id, parentUrl, resolve) => {
            if (!storedParentUrl)
              storedParentUrl = parentUrl;
            if (parentUrl.startsWith('blob:'))
              parentUrl = storedParentUrl;
            return resolve(id, parentUrl)
          }
        }
      </script>

[guybedford]

Yes that is correct, blobs do not support relative resolution, so you need to work around that. This is not really a limitation of this project though, since new URL('/path', 'blob:...') will just always fail, so it's very much up to you to resolve that one and ensure they are already absolute URLs.

[jogibear9988]

can't you use the the relative URL as a start from where the "importShim" call is called?

[guybedford]

URLs are resolved to the parent - in this case the parent is a blob URL. If you try to do import('blob:...') where that blob imports from /asdf, it will fail. If we did anything different we would not be following the spec.

[jogibear9988]

If I would not use the import shim, it would have worked. Couldn't you ignore 'blob' parent?

[jogibear9988]

No you're correct.... it would not have worked...

I tried now to reproduce in codesandbox :-)

Maybe the shim should throw the same error.
So I'll need to fix it by using a complete url in import.

Cause the rewrite I'll do in your shim is not possible in real imports (or is there any similar callback?

[jogibear9988]

here is the sandbox: https://codesandbox.io/s/base-custom-webcomponent-forked-jyv3sx?file=/test1.js

if you change the "importShim" in the test1.js to import, you get the error wich the browser throws, so maybe we should unify this?

[guybedford]

I agree that if anything the fix would be to provide a clearer more aligned error message.