tus / tus-js-client

A pure JavaScript client for the tus resumable upload protocol
https://tus.io/
MIT License
2.12k stars 316 forks source link

window is undefined when trying to run in worker file on browser #658

Closed rashyad closed 11 months ago

rashyad commented 11 months ago

Describe the bug The bug is regarding the window global object that is available when running in browser. However, when trying to run the upload process in a worker thread on client side, the window object is not defined in the worker global scope.

In the file /lib/browser/index.js, line 31 - 33, the code uses the window global object to check for XMLHttpRequest and Blob to determine the isSupported property.

image

Running this in worker will return window is not defined since the code assume that window is available. I understand the thoughts here since its supposed to be running in browser. I supposed we should put a check instead of assuming that window is available.

To Reproduce

  1. Run any web server of your choice, apache web server, node http-server etc so you can serve html and js files.
  2. Create two js files, one as the worker file and another one as the parent to init the worker using new Worker()
  3. Try to run the tus.Upload in the worker file and you will get the window not defined error in browser logs. You can copy the upload code part from /demos/browser/demo.js

Expected behavior The upload should work on both the main thread and worker thread on browser. I supposed we should not be assuming that window would always be defined or something..

Just to add, I have it working locally where I modified the file /lib/browser/index.js like so, image

Built the code and it works fine. The upload works on both the main thread and worker thread. However, this might not be the best fix.

Acconut commented 11 months ago

Thanks for the report! You are right that window does not exist in the environment for Web Workers. Maybe we should use self instead for detecting support: https://developer.mozilla.org/en-US/docs/Web/API/Window/self and https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/self

The following code could be a replacement without depending on window, although I didn't test it yet:

const isSupported = typeof self !== undefined && 'XMLHttpRequest' in self && 'Blob' in self && typeof Blob.prototype.slice === 'function'

Could you try it out and open a PR if it works?

rashyad commented 11 months ago

Tested your code and it works fine with worker. The test-node and test-puppeteer run just fine. However, I did not manage to create a specific demo for worker or a specific test for worker.

Here is my PR https://github.com/tus/tus-js-client/pull/660

rashyad commented 11 months ago

May I know the status of this? Anything that I need to do on my side?

Acconut commented 11 months ago

I didn't have the time yet to try it out but I plan on doing so in the next few days

jtag05 commented 11 months ago

I would also love to get this merged if it would solve this issue. If any additional help is required, I'm happy to lend a hand.

Acconut commented 11 months ago

I added a few more commits to your PR and merged it. Can you please test the latest main branch from GitHub and let me know if it works? If so, I can release a new version.

rashyad commented 11 months ago

Tested the main branch locally and works fine using with worker

Acconut commented 11 months ago

Thanks for the confirmation! I just published v4.0.1, which includes this patch.