embroider-build / embroider

Compiling Ember apps into spec-compliant, modern Javascript.
MIT License
331 stars 137 forks source link

top-level-await causes component loading to break #1678

Open NullVoxPopuli opened 7 months ago

NullVoxPopuli commented 7 months ago
Error occurred:

- While rendering:
  -top-level
    application

[runtime.js:4857](http://localhost:4200/assets/@glimmer/runtime.js)

Uncaught Error: Attempted to load a component, but there wasn't a component manager associated with the definition. The definition was: Promise
    getInternalComponentManager manager.js:425
    lookupComponent Ember

Repro: https://github.com/NullVoxPopuli/embroider-repro-top-level-await

application.hbs

{{page-title "TopLevelAwait"}}

<Demo />

{{outlet}}

The in-app component:

// app/components/demo.js
import Component from '@glimmer/component';

// could be any library tho
import { two } from './top-level-await';

export default class Demo extends Component {
  two = two;
}
{{this.two}}

{{yield}}
// app/components/top-level-await.js
export const two = 2;

// This could be anything, in a library, etc.
// top-level await is a spec-feature
await new Promise((resolve) => resolve());
ef4 commented 7 months ago

This needs importSyncImplmementation = 'eager' which in turn really needs strict es modules if we want that to work across the ecosystem.

If you patch the repro to use eager, you hit other problems, like