docker / extensions-sdk

Desktop Extensions SDK
https://docs.docker.com/desktop/extensions-sdk/
Apache License 2.0
143 stars 47 forks source link

Add Web Worker support #172

Open micahyoung opened 2 years ago

micahyoung commented 2 years ago

Summary

The client library is unusable within Web Workers, which are useful for asynchronous I/O operations like fetching and processing external data and loading/running WASM modules or other libraries that may need to be isolated in a separate thread, allowing the main UI thread to remain responsive.

The cause appears to be that window.ddClient is required by the client library but only injected into the main UI thread, and not in Web Worker threads.

The fix would likely be to inject a ddClient into every Web Worker thread's environment, in addition to the main UI thread.

Attempted Workarounds

Repro

  1. Create new extension

    docker extension init MyExtension
  2. Create a Web Worker that attempts to import and use client MyExtension/ui/src/webWorker.js

    import {createDockerDesktopClient} from '@docker/extension-api-client';
    
    const client = createDockerDesktopClient()
  3. Append Worker initialization to index.js MyExtension/ui/src/index.js

    ...
    import App from "./App";
    
    // eslint-disable-next-line import/no-webpack-loader-syntax
    import MyWorker from "worker-loader!./webWorker.js";
    
    const worker = new Worker(new MyWorker())
    
    ReactDOM.render(
    ...
  4. Install extension with debug window

    make install-extension
    docker extension dev debug <myhubuser/myextension>
  5. Navigate to extension in Docker Desktop and see error in Debug Console

    Uncaught ReferenceError: window is not defined
        at index.js:2:35
        at webWorker.js:3:16
        at webWorker.a94eac44.worker.js:1:257
micahyoung commented 2 years ago

I realize this will probably need to be fixed in Docker Desktop, not here in the SDK, but I wasn't sure where to file the issue where it would be most easily tracked.

benja-M-1 commented 2 years ago

Thanks for the feedback @micahyoung, it is the right place to share this! I mark this as an improvement :)