If you open a saved file using a new extension you get the error "The project file that was selected failed to load."

[trusteddigital]

First off, amazing work and I'm enjoying coding my new extension.

The issue I'm having is if I save off a project in scratch and try and reload it.

I can drop any blocks I like from the default extensions or plain scratch and those projects load no problem.

Whenever I add a single block from my created extension, save it off, then try and reload it, I get the error "The project file that was selected failed to load."

And the console shows

DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'https://example-url-5xvw94q74wcw6g-8000.app.github.dev/customExtension' failed to load.

customExtension is the id given to the extension in getInfo and it's trying to load it from the root directory of the space / but it gives a 404 when you try and open that URL. Is there some confusion about where new extensions are packaged and live when it tries to open it up from a saved file?

Or is there a step required to register the URL of the extension so it knows where to load it from?

Or perhaps this is specifically a me issue

[dalelane]

It should "just work" if you follow the instructions as-is - I've not seen any issues with saving/opening sb3 files before.

Would you be willing to share the URL of your Scratch fork so I can try it for myself, please?

[pbel78]

I had the same issue. My extension ID was mqtt => didn't worked. With Dale's example it did work. So at the end I change the ID of my blocks to : yourScratchExtension and now it does work with loading saved files. As it took me already longer to get here I haven't tested if it was because mqtt maybe corresponds to an existing module or if it really needs to be exactly yourScratchExtension.... but I think it could help somebody:

no working:

    getInfo() {
        return {
            id: 'mqtt',
            name: 'MQTT Connector',

working:

getInfo() {
      return {
          id: 'yourScratchExtension',
          name: 'Demo',

[dalelane]

... it really needs to be exactly yourScratchExtension ...

It doesn't need to be that, but it does need to match the other references to the extension ID, in:

scratch-vm - https://github.com/dalelane/scratch-extension-development/blob/master/patches/scratch-vm.patch#L11

scratch-gui - https://github.com/dalelane/scratch-extension-development/blob/master/patches/scratch-gui.patch#L21

[pbel78]

Hi Dale.

Thanks for the fast reply. But honestly I don't get it yet: As I understand all the files would need to be in the folder your-scratch-extension => but that I didn't changed In the two files I see only the GUI one a reference to the ID and I don't see a constraint what it needs to be. Do you have an idea why "mqtt" as id doesn't work? Does it need to have a camel case in it or is it just a problem, that there is a mqtt module imported in other parts?

Regards

[dalelane]

Let's break this line down a little further:

yourScratchExtension: () => require('../extensions/your-scratch-extension')

yourScratchExtension This is the ID of your extension. This needs to match the ID that your getInfo method returns. You can change it, as long as you change it in both places.

'../extensions/your-scratch-extension' This is the folder where your extension files are. This needs to match the location where your extension files are.

You can use any string you want for either of these. There are no special names.

The only trick to this is updating all the references to keep everything in sync, not just update one side but not the other.

[pbel78]

I thank you for the explenation!