Issue 1:
Do you want to request a feature or report a bug?

bug

What is the current behavior?

Sometimes, Webpack generates code that contains Promises that are not rejectable. If an error is thrown in those Promise's body, the Promise is not rejected and thus the error bubbles up to the console, uncatched.

If the current behavior is a bug, please provide the steps to reproduce.

Let's lazy-load some module based on the value of an input field (a real world use-case would be a SPA that loads modules based on the current route)...

let input = document.createElement('input');

document.body.appendChild(input);
input.addEventListener('change', function(){
let path;
path = input.value;

import(`${path}`)
.then(module => document.body.innerText = module.default)
.catch(reason => {console.log(reason); /* go to 404 maybe... */})
})

if the value of the input field is not a valid module path, it throws.

It would be nice and clean to let developer decide whether or not to catch that exception.

If the developer doesn't catch it, it will naturally bubble up to the console. That's the expected behaviour of promises, anyway.

What is the expected behavior?

If a Promise is rejected it should be catchable.

If this is a feature request, what is motivation or use case for changing the behavior?

When working with Promises the developer should be in control about whether or not to catch the possible exception.

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.

Node: 6.11.3

Webpack 3.5.6

OS: Windows 10

Issue 2:
Do you want to request a feature or report a bug?

Bug

What is the current behavior?

Currently, if you dynamically call the import function and you are offline, the catch function is never called. Webpack generates an uncaught exception.

import('./my-component')
.then(module => {})
.catch(err => console.log(err)

If the current behavior is a bug, please provide the steps to reproduce.

Step 1)

window.loadChunk = () => {
import('./my-component')
.then(module => {})
.catch(err => console.log(err))
}

Step 2)

Load the bundle on the page, you should now have available loadChunk function

Step 3)

Put your browser in "offline mode"

Step 4)

call the loadChunk() function

What is the expected behavior?

Expected behavior is that the catch function is called and error logged.

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.

Using: Webpack v3.3.0

This happens because the import function is converted into a Promise that wraps the require.ensure. Any time the require.ensure rejects the promise, it automatically calls the ensure's OnError callback which throws an exception. Async exceptions are not caught by the parent Promise, resulting in the bug above.

// var prom = import('./my-component)
var prom = new Promise(function (resolve) {
__webpack_require__.e/* require.ensure */(1).then((function (require) {
resolve(__webpack_require__( /* webpackChunkName: "my-component" */697));
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
});

// __webpack_require__.oe (On Error)
__webpack_require__.oe = function(err) { console.error(err); throw err; };

Please let me know if I'm missing something, maybe in the configuration, or if this is really a bug.