[fix] error on HMR with es6 bundles

[Slashgear]

What kind of change does this PR introduce?

It's a bug fix.

Did you add tests for your changes?

Update test.

If relevant, link to documentation update:

N/A

Summary

We notice a bug in webpack HMR during our spike on creating es6 bundles.

Bug:

• bootstrap dev bundle containes a this no longer bound to window, so it was undefined.

Fix:

• Use window instead of this in both scripts templates.

This bug was identifed in #5776

Does this PR introduce a breaking change?

No.

Other information
Fix #5776
Made with @Osirisxxl

[jsf-clabot]

All committers have signed the CLA.

[webpack-bot]

Thank you for your pull request! The most important CI builds succeeded, we’ll review the pull request soon.

[sokra]

Makes sense

[lukeapage]

I don’t think you can use window inside a web worker. Getting the global inside a es6 environment is difficult unless you know something about your environment.

[michael-ciniawsky]

Web Worker API

workers run in another global context that is different from the current window. This context is represented by a DedicatedWorkerGlobalScope object in the case of dedicated workers (standard workers that are utilized by a single script; shared workers use SharedWorkerGlobalScope).

You can run whatever code you like inside the worker thread, with some exceptions. For example, you can't directly manipulate the DOM from inside a worker, or use some default methods and properties of the window object.

WorkerGlobalScope.self ?

[sokra]

Should use self in WebWorker

[webpack-bot]

@Slashgear Thanks for your update.

I labeled the Pull Request so reviewers will review it again.

@sokra Please review the new changes.

[sokra]

Thanks

[liaobin312716]

Hi， I got an error ReferenceError:Can't find variable:self(http://30.6.61.126:8081/...)

• Webpack Version: 3.9.1
  But is works when webpack version is 3.8.1.

Then , I compared the compiled bundle file with the last .
version: 3.8.1

version: 3.9.1

Use self instead of this maybe bring some new problems ?

[jukben]

Hi @sokra in https://github.com/callstack/haul we use target: webworker in general because Debug JS remotely in React Native Dev tools. So we experienced the same issue as @liaobin312716 when the JS running outside of webworker (self is not defined in iOS/Andorid JS env). When developer enforce "webworker mode" (code running in webworker) for remotely debug everything is fine. Is there anything that we can do about it? Maybe there is some setting how to mock "self" if it' not present in the current environment. var self = self || window would be sufficient. 🙈

We can't change mode on demand, that would result in restarting of Webpack which is time-consuming.