# IE11 Dialog Promise Undefined

**URL:** <https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240>\
**Category:** Uncategorized\
**Created:** [February 15, 2020, 8:23pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240 "2020-02-15T20:23:45Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 15, 2020, 8:23pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/1 "2020-02-15T20:23:46Z")

</div>

I’m in the process of updating an existing app using (Aurelia Framework 1.1.4) to the latest version of Aurelia. This is a business app therefore IE11 is still supported.

I created an App using the CLI then added the various pieces I use in the existing app, validation, dialog, etc to the app created with CLI.

The irony is that I had this working, dialog and validation. In my arrogance I did not save what I had, instead I just copied over the `src` folder from my existing app then I started to get an error:

`Possible Unhandled Promise Rejection: ReferenceError: 'Promise' is undefined`

When I started over I can’t get Aurelia Dialog working again. I don’t know what I did in the first place to get it to work. I searched the internet high and low but can’t find anything, which is odd because the problem is easy to reproduce. Create a new app, add aurelia-dialog, change main.ts that is all it takes.

CLI Version

`Global aurelia-cli v1.2.3`

Here is my setup

```auto
Would you like to use the default setup or customize your choices? · Custom App
Which bundler would you like to use? · Webpack
Which HTTP Protocol do you wish the outputted Webpack bundle to be optimised for? · HTTP/1.1
What platform are you targeting? · Web
What transpiler would you like to use? · TypeScript
How would you like to setup your HTML template? · None
What css preprocessor would you like to use? · None
Do you want to add PostCSS processing · None
Which unit test runner would you like to use? · None
Would you like to configure integration testing? · None
What is your default code editor? · Visual Studio Code
Which features do you want scaffolded into your project? · Minimum
Would you like to add a Dockerfile? · No

```

After that I do

`au run`

I get

`Hellow world!`

I then install Aureila Dialog

`npm install aurelia-dialog`

Installs 2.0.0

Add the following to main.ts

`.plugin(PLATFORM.moduleName('aurelia-dialog'))`

Which looks like this

```auto
  aurelia.use
    .standardConfiguration()
    .plugin(PLATFORM.moduleName('aurelia-dialog'))
    .feature(PLATFORM.moduleName('resources/index'));

```

do `au run` load the page and I get this

```auto
DOM7011: The code on this page disabled back and forward caching. For more information, see: http://go.microsoft.com/fwlink/?LinkID=291337
192.168.1.17:8081
HTML1300: Navigation occurred.
192.168.1.17:8081
[WDS] Live Reloading enabled.
DEBUG [aurelia] Loading plugin aurelia-templating-binding.
DEBUG [aurelia] Configured plugin aurelia-templating-binding.
DEBUG [aurelia] Loading plugin aurelia-templating-resources.
DEBUG [aurelia] Configured plugin aurelia-templating-resources.
DEBUG [aurelia] Loading plugin aurelia-event-aggregator.
DEBUG [aurelia] Configured plugin aurelia-event-aggregator.
DEBUG [aurelia] Loading plugin aurelia-history-browser.
DEBUG [aurelia] Configured plugin aurelia-history-browser.
DEBUG [aurelia] Loading plugin aurelia-templating-router.
DEBUG [aurelia] Configured plugin aurelia-templating-router.
DEBUG [aurelia] Loading plugin aurelia-dialog.
Possible Unhandled Promise Rejection: ReferenceError: 'Promise' is undefined
   "Possible Unhandled Promise Rejection:"
   {
      [functions]: ,
      __proto__ : { },
      __symbol:hasInstance0.29453283920868646: undefined,
      __symbol:isConcatSpreadable0.29453283920868647: undefined,
      __symbol:iterator0.29453283920868641: undefined,
      __symbol:match0.29453283920868642: undefined,
      __symbol:replace0.29453283920868643: undefined,
      __symbol:search0.29453283920868644: undefined,
      __symbol:species0.29453283920868649: undefined,
      __symbol:split0.29453283920868645: undefined,
      __symbol:toPrimitive0.294532839208686410: undefined,
      __symbol:toStringTag0.294532839208686411: undefined,
      __symbol:unscopables0.29453283920868648: undefined,
      description: "'Promise' is undefined",
      message: "'Promise' is undefined",
      name: "ReferenceError",
      number: -2146823279,
      stack: "ReferenceError: 'Promise' is undefined
   at requireEnsure (http://192.168.1.17:8081/runtime~app.087ff77d9b7fd2b9c076.bundle.js:110:14)
   at RENDERRERS.ux (eval code:37:23)
   at DialogConfiguration.prototype._apply (eval code:62:9)
   at Anonymous function (eval code:56:35)
   at configure (eval code:268:5)
   at Anonymous function (eval code:626:9)
   at Anonymous function (eval code:59:7)"
   }

```

---

<div class="post-metadata">

**Author:** ![ghiscoding](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/ghiscoding/32/1199_2.png) [@ghiscoding](https://discourse.aurelia.io/u/ghiscoding)\
**Post date:** [February 16, 2020, 5:26am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/2 "2020-02-16T05:26:42Z")

</div>

I think you beed Bluebird and probably some polyfills as well

---

<div class="post-metadata">

**Author:** ![avrahamcool](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/avrahamcool/32/368_2.png) [@avrahamcool](https://discourse.aurelia.io/u/avrahamcool)\
**Post date:** [February 16, 2020, 5:35pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/3 "2020-02-16T17:35:05Z")

</div>

as the error states - you need a `Promise` polyfill. (bluebird is a good option for that).

you may also need other polyfills based on your app uses.  
follow the instruction explained [here](https://aurelia.io/docs/fundamentals/app-configuration-and-startup#bootstrapping-older-browsers) if you need to support even older browsers.

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 16, 2020, 7:10pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/4 "2020-02-16T19:10:24Z")

</div>

The polyfill for promise is there and is working the CLI installs and sets one up, the `promise-polyfill`. I think the problem is with error handling in aurelia-dialog therefore instead of getting the actual error related to `aurelia-dialog` a generic `Promise` error is shown. IDK grasping for starws.

I already had the other polyfills @ghiscoding suggested, but as stated those are for IE10 and IE9. Don’t know if they make a difference with IE11.

I found a solution, but it would be nice to know why this does not work. Is this a reproducible error. Kind of sad that one can crash and burn only after 4 or 5 steps without any documentation. Even though it is not stated anywhere I wonder if Aurelia Dialog 2.0 only works with evergreen browsers. Or what is Aurelia Dialog 2.0 dependent on that a polyfill is needed to get it to work with IE11. This might not be a problem with the code but with the documentation not stating that Dialog 2.0 will only work with evergreen browsers or if you want IE11 support then you need to do XYZ. Again IDK grasping for starws.

My solution was to roll back to Aurelia Dialog 1.1.0.

For the moment that was the only major thing holding me back, had some issues with `element-closest` and switched from `isomorphic-fetch` to `whatwg-fetch`. Other than that everything else works.

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 16, 2020, 9:32pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/5 "2020-02-16T21:32:45Z")

</div>

The webpack project already got a promise polyfill setup in your `webpack.config.js`.

```auto
new ProvidePlugin({
      'Promise': ['promise-polyfill', 'default']
    }),

```

It could be some special `aurelia-dialog` code, we will sort that out and update here.

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 16, 2020, 10:05pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/6 "2020-02-16T22:05:16Z")

</div>

@y2k4life ~~I got the culprit~~. **Update: sorry, I found out my conclusion was incorrect, after testing on a real IE11 box. The only solution worked right now is `<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"></script>` in html head.**

~~The ProvidePlugin for webpack injects an `import` statement in those js files that uses `Promise` as global var.  
Note it’s an import statement to bring in `Promise`, it means the Promise is still not global var, but a local var visible to the modified js file.~~

~~It turns out webpack **did not apply ProviderPlugin for every js files**. When webpack bundles `aurelia-dialog`,  
It uses UMD build because by default it honours package.json `browser`, `module`, and `main` fields (in the exact order).~~

~~The fields in `aurelia-dialog` package.json.~~

```auto
  "main": "dist/commonjs/aurelia-dialog.js",
  "module": "dist/native-modules/aurelia-dialog.js",
  "browser": "dist/umd/aurelia-dialog.js",

```

~~Webpack **didn’t touch the umd js file** , I guess it’s because it needs more work to inject dep to umd. UMD doesn’t understand import statement, to support injecting dep to umd, the ProviderPlugin would need to inject dep to AMD, CommonJS module loaders, and not sure what they can do with browser globals when amd and commonjs are absent.~~

~~The fix is to manually force webpack to load esm build for aurelia-dialog.~~

~~You can either use [https://webpack.js.org/configuration/resolve/#resolvemainfields](https://webpack.js.org/configuration/resolve/#resolvemainfields) to force `mainFields: ['module', 'main']` (removed “browser” from the default list) but that affects all other npm packages.~~

~~Or you can use use `resolve.alias` to hack dialog only.~~

```auto
  resolve: {
    alias: {
      'aurelia-binding': path.resolve(__dirname, 'node_modules/aurelia-binding'),
      'aurelia-dialog': path.resolve(__dirname, 'node_modules/aurelia-dialog/dist/native-modules/aurelia-dialog.js')
    }
  },

```

~~cc @StrahilKazlachev~~

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 16, 2020, 10:37pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/8 "2020-02-16T22:37:49Z")

</div>

There is another option. Remove the ProviderPlugin in webpack config, load the promise polyfill manually in `index.ejs` head.

```auto
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"></script>

```

> **[taylorhakes/promise-polyfill](https://github.com/taylorhakes/promise-polyfill#cdn-polyfill-use)**
>
> Lightweight ES6 Promise polyfill for the browser and node. A+ Compliant - taylorhakes/promise-polyfill

Note it would NOT work if you try to add `import 'promise-polyfill/src/polyfill';` to `src/main.ts` because `main.ts` is loaded after aurelia-bootstrap started. `aurelia-bootstrap` (and deps) uses promise too, the polyfill needs to be ready before bootstrap. This is the reason why our default setup uses ProviderPlugin instead of simple `import 'promise-polyfill/src/polyfill';` in `main.ts`.

**FYI** : as a side note, the upcoming Aurelia 2 simplified app startup by starting your `src/main.ts` as the entry module, there is no more aurelia-bootstrap to wrap your code, so that you could simply use `import 'promise-polyfill/src/polyfill';` in `src/main.ts` in an Aurelia 2 project.

**Update** : Another working alternative, remove ProviderPlugin, then load promise polyfill before aurelia-bootstrap in webpack config.

```auto
entry: {
    app: ['promise-polyfill/src/polyfill', 'aurelia-bootstrapper']
  },

```

I still have no idea what code in aurelia-dialog created all this trouble.

Also the promise polyfill seems confused webpack WDS in IE11. I am seeing many error pops in console.

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 17, 2020, 5:33am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/9 "2020-02-17T05:33:05Z")

</div>

@huochunpeng thank you for the feedback this will help with the troubleshooting. I find it odd that other plugins and components in particular `aurelia-validation` and `aurelia-fetch` don’t have issues with `promise-polyfill`. Not to mention the Aurelia framework. I will try some of your suggestions, in particular the last suggestion of moving `promise-polyfill` from `ProviderPlugin` to `entry` and making sure it is before `aurelia-bootstrapper`.

I’m just a bit hesitant to mess with WebPack and configurations for just one piece of my code not working. I rather go back to `aurilia-dialog 1.1.0`.

I just wonder what is in the `aurelia-dialog 2.0` that makes this not work.

Thank you.

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [February 17, 2020, 6:02am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/10 "2020-02-17T06:02:58Z")

</div>

Dialog v2 does not require anything special to work. As long as theres a Promise, it should work. Though i think you may want to apply conditional polyfilling instead

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 17, 2020, 10:14am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/11 "2020-02-17T10:14:46Z")

</div>

Based my experience, aurelia-dialog did affect ie11 in some strange way, although I had no idea what’s going on.

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 17, 2020, 6:24pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/12 "2020-02-17T18:24:27Z")

</div>

Even though I solved the problem by going back to 1.1.0 I wanted to figure out what the issue is.

It seems as if Webpack Runtime gets to a point where the `promise-polyfill` seem to be no longer present. The irony though is that when the error is thrown it is caught by code in the `promise-polyfill`. At first I thought this was due to loading async chunks in WebPack. Once I got WebPack to bundle all of `aurlie-dialog` into a single chunk there was still a `Promise undefined` error just in a different place.

I have tried everything to get the `promise-polyfill` loaded before the run time. Move it to `entry`, create `vendor`, put `import 'promise-polyfill'` everywhere. Why at times the run time can find Promise but other times it can’t I don’t know. But still puzzled as to why I would need to do get `promise-polyfill` if the stack trace returns back to `promise-polyfill`. If it returns back to there then it had to be loaded before the run time in order to start from there. You then think Promise would be defined. IDK grasping for straws.

A solution is to put the following line in the `index.ejs` but that seems to be against the grain.

`<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8.1.3/lib/index.min.js"></script>`

In `aurelia-dialog` this is where it starts

## [dialog](https://github.com/aurelia/dialog)/[src](https://github.com/aurelia/dialog/tree/master/src)/ **dialog-configuration.ts**

```auto
  private _apply(): Promise<void> {
    const renderer = this.renderer;
    const cssText = this.cssText;
    return Promise
      .all([
----> typeof renderer === 'string' ? RENDERRERS[renderer]() : renderer,
        cssText
          ? typeof cssText === 'string'
            ? cssText
            : cssText()
          : ''

.
.
.

```

Which then calls `ux: () => ` from the RENDERRERS.

```auto
const RENDERRERS: Record<string, () => Promise<RendererStatic>> = {
  ux: () => import('./renderers/ux-dialog-renderer').then(m => m.DialogRenderer) as Promise<RendererStatic>,
.
.

```

The above is transpiled to this

```auto
ux: function () { return __webpack_require__.e(/*! import() */ "vendors.async~3e799143").then( __webpack_require__.bind(null, /*! ./ux-dialog-renderer.js */ "yfWE")).then(function (m) { return m.DialogRenderer; }); },

```

Which then calls the WebPack run time to resolve `vendors.async~3e799143`

```auto
__webpack_require__.e = function requireEnsure(chunkId) {
/ ****** / var promises = [];
/ ****** /
/ ****** /
/ ****** / // JSONP chunk loading for javascript
/ ****** /
/ ****** / var installedChunkData = installedChunks[chunkId];
/ ****** / if(installedChunkData !== 0) { // 0 means "already installed".
/ ****** /
/ ****** / // a Promise means "currently loading".
/ ****** / if(installedChunkData) {
/ ****** / promises.push(installedChunkData[2]);
/ ****** / } else {
/ ****** / // setup Promise in chunk cache
/ ****** / var promise = new Promise(function(resolve, reject) {
/ ****** / installedChunkData = installedChunks[chunkId] = [resolve, reject];
/ ****** / });
/ ****** / promises.push(installedChunkData[2] = promise);

```

It dies at `// setup Promise in chunk cache` when creating a new Promise  
`var promise = new Promise(function(resolve, reject) ....`

But then you continue and you end up in the `promise-polyfill` try … catch

```auto
   try {
      ret = cb(self._value);
    } catch (e) {
      reject(deferred.promise, e);
      return

```

Now that I know more of what might be the issue now it is trying to figure out the ideal solution without having to put a script tag in my index file.

I will close with one of my favorite movie quotes from Tommy Boy.

**Ray Zalinsky:**  
Goin’ a little heavy on the pine tree perfume there kid?

**Tommy:**  
No, it’s an auto air freshener.

**Ray Zalinsky:**  
Good, you’ve pinpointed it, now the next step is washin’ it out.

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 17, 2020, 10:40pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/13 "2020-02-17T22:40:06Z")

</div>

Thank you @y2k4life, you remind me something I forgot. I have not touched our webpack setup for a while.

Our aurelia-webpack-plugin changed webpack behaviour on loading `aurelia-*` packages, it enforces to load `dist/native-modules/*` instead of those fields (browser, module, main) in package.json.

That’s why the aurelia-dialog is bundled using native-modules dist files, **NOT UMD** dist files.

The native-modules dist files transpiled the dynamic `import()` to ` __webpack_require__ ` which obviously only works with better browser.

However, the UMD files transpiled the `import()` statements into native promise, (not ` __webpack_require__ `) which works in IE11.

```auto
// UMD transpiled code
  var RENDERRERS = {
      ux: function () { return Promise.resolve().then(function () { return uxDialogRenderer; }).then(function (m) { return m.DialogRenderer; }); },
      native: function () { return Promise.resolve().then(function () { return nativeDialogRenderer; }).then(function (m) { return m.NativeDialogRenderer; }); }
  };

```

This means if you enforce using UMD dist files, everything goes back to normal.

```auto
alias: {
      'aurelia-binding': path.resolve(__dirname, 'node_modules/aurelia-binding'),
      'aurelia-dialog': path.resolve(__dirname, 'node_modules/aurelia-dialog/dist/umd/aurelia-dialog.js')
    },

```

Hope this helped.

However, I am also going to cleanup our webpack setup to move promise polyfill from ProviderPlugin to entry config, as suggested by @jods4.

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 18, 2020, 12:26am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/14 "2020-02-18T00:26:12Z")

</div>

@huochunpeng closer but still no go, we are on the right track.

I tried the moving `promise-polyfill` from `ProviderPlugin` to `entry` and that made things worse. What specifically is the clean up on that. I could be doing something wrong.

The idea is working but the syntax is not or something, for some reason WebPack is not honoring the Resolve alias. I figured what you are trying to do is **not** use `native-modules` folder. I tested by removing the folder. I renamed to `native-modules` **x** and it worked! But that is not the solution. The alias though is not working although it should.

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [February 18, 2020, 12:38am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/15 "2020-02-18T00:38:04Z")

</div>

That’s bit strange, what worked for me on a windows box is

1. leave ProviderPlugin unchanged.
2. use alias  
`'aurelia-dialog': path.resolve(__dirname, 'node_modules/aurelia-dialog/dist/umd/aurelia-dialog.js')`

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 18, 2020, 5:17am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/16 "2020-02-18T05:17:13Z")

</div>

I figure if it works for you it should work for me. I tried again, but there was one thing I did not do that I should have done.

Start over.

I made so many changes that I believe my setup become corrupted. I also questioned if it was Linux.

I tried both Linux and Windows.

It works!!!

@huochunpeng thank you. This is noted on [GitHub Issue #387](https://github.com/aurelia/dialog/issues/387). I chalk this up as a documentation error.

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 18, 2020, 6:29am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/17 "2020-02-18T06:29:19Z")

</div>

@huochunpeng thanks again.

Here is the fruits of our labor, updates to the app using Dialog 2.0 and IE11 (and much more).

![aurelia-dialog](https://canada1.discourse-cdn.com/flex027/uploads/aurelia/original/2X/a/a55955df02880064b136ad79c25b8ae94a82f0a4.png)

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [February 19, 2020, 8:30am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/18 "2020-02-19T08:30:32Z")

</div>

Im glad you got it working, and congratz on the upgrade. It could have been a nice and seemless experience without this bump. I still think its better to use the polyfill to normalize APIs such as Promise. One service you can use is [polyfill.io](http://polyfill.io)

---

<div class="post-metadata">

**Author:** ![y2k4life](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/y2k4life/32/457_2.png) [@y2k4life](https://discourse.aurelia.io/u/y2k4life)\
**Post date:** [February 19, 2020, 5:18pm UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/19 "2020-02-19T17:18:00Z")

</div>

@bigopon thank you. Sold framework when you can upgrade an old app to the most recent version of the framework. I expected more than just this one little hiccup.

Just to clarify, this was one of those errors where what you are told is the issue is not the issue. The `promise` polyfill was not the issue even though that was the error reported. I do have a `promise` policyfill and it is working just fine, the one that comes with the CLI. From what I gathered from @huochunpeng the root cause is **Dialog 2.0** uses native dynamic `import()` which does not work with IE11. Had to force Webpack to bundle the UMD.

> v2 switched to native dynamic `import()` statement to simplify the code. This is indeed a breaking change for IE11.
> 
> \*huochunpeng

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [February 21, 2020, 1:35am UTC](https://discourse.aurelia.io/t/ie11-dialog-promise-undefined/3240/20 "2020-02-21T01:35:14Z")

</div>

For polyfilling, I meant I was suggesting the use of some service like [polyfill.io](http://polyfill.io), to make it globally available, independent of your build, and thus will be usable without any hiccup, in any part of your application (the bundle, or 3rd party script). Something like this in your `index.html`:

```auto
<head>
  <script src="https://polyfill.io/...promise">
  ...
</head>
<body>
  ... bundle here
</body>

```