ember-cli / ember-load-initializers

MIT License
16 stars 38 forks source link

v2.1.0 breaking app boot #202

Closed maxwondercorn closed 5 years ago

maxwondercorn commented 5 years ago

This issue was initially raised in ember-cli/ember-cli#8903 because this seemed to be a CLI issue.

I have an app that runs when using ember server but fails to boot after it's built. The app fails when loading instanceInitializers in the loadIntializers() function.

After testing I found the issue is being caused by ember-load-initializers when the version is bumped from 2.0.0 to 2.1.0.

It's not obvious what differences between the versions is causing the breaking change. Reviewing the lock file changes there are additional versions of babel, babel plugins and some version changes to other dependencies.

See more details in the original CLI issue

markusm7 commented 5 years ago

Can confirm similar behaviour, the production build output yields self.requirejs is undefined

Only happens after uprade to 2.1.0

Running Ember/Ember Cli 3.13.*

maxwondercorn commented 5 years ago

My app is on 3.5 but I did an upgrade to 3.8 to see if that fixed the issue. It did not, so it doesn't seem to be a version specific issue.

I see one of my addons is using 2.1.0 in the dummy app without issues so maybe it's an issue with other dependencies. For reference I've listed my devDeps below. Some of the deps are not on the latest version but I found it doesn't make a difference. The upgrade to 2.1.0 creates the issue

    "@ember/jquery": "^0.6.1",
    "@ember/optional-features": "^0.7.0",
    "@fortawesome/ember-fontawesome": "^0.1.14",
    "@fortawesome/pro-light-svg-icons": "^5.10.1",
    "@fortawesome/pro-regular-svg-icons": "^5.10.1",
    "@fortawesome/pro-solid-svg-icons": "^5.10.1",
    "billboard.js": "^1.10.1",
    "broccoli-asset-rev": "^3.0.0",
    "d3": "^5.9.7",
    "date-fns": "^1.30.1",
    "ember-ajax": "^5.0.0",
    "ember-angle-bracket-invocation-polyfill": "^2.0.2",
    "ember-api-actions": "^0.2.8",
    "ember-ast-hot-load": "^0.0.83",
    "ember-auto-import": "^1.5.2",
    "ember-cli": "~3.5.1",
    "ember-cli-app-version": "^3.2.0",
    "ember-cli-babel": "^7.8.0",
    "ember-cli-barcode": "^0.3.7",
    "ember-cli-bootstrap-sassy": "^0.5.8",
    "ember-cli-clipboard": "^0.13.0",
    "ember-cli-dependency-checker": "^3.2.0",
    "ember-cli-eslint": "^5.1.0",
    "ember-cli-fallback-builds": "^0.0.8",
    "ember-cli-htmlbars": "^3.1.0",
    "ember-cli-htmlbars-inline-precompile": "^2.1.0",
    "ember-cli-inject-live-reload": "^2.0.1",
    "ember-cli-loaders": "^0.4.0",
    "ember-cli-sass": "^10.0.1",
    "ember-cli-sri": "^2.1.1",
    "ember-cli-string-helpers": "^4.0.2",
    "ember-cli-switch": "^1.0.0",
    "ember-cli-template-lint": "^1.0.0-beta.3",
    "ember-cli-uglify": "^3.0.0",
    "ember-component-css": "^0.7.4",
    "ember-concurrency": "^1.0.0",
    "ember-cookies": "^0.4.0",
    "ember-cp-validations": "^4.0.0-beta.9",
    "ember-data": "~3.5.0",
    "ember-export-application-global": "^2.0.0",
    "ember-fetch": "^6.7.0",
    "ember-file-upload": "^2.7.1",
    "ember-js-pdf": "^0.4.2",
    "ember-light-table": "^1.13.2",
    "ember-load-initializers": "^2.0.0",
    "ember-maybe-import-regenerator": "^0.1.6",
    "ember-modal-dialog": "^3.0.0-beta.4",
    "ember-notify": "^6.0.0",
    "ember-on-modifier": "^1.0.0",
    "ember-page-title": "^5.0.2",
    "ember-power-select": "^2.3.4",
    "ember-qunit": "^4.5.1",
    "ember-resolver": "^5.2.1",
    "ember-responsive": "^3.0.5",
    "ember-simple-auth": "^1.9.2",
    "ember-simple-auth-token": "^4.0.7",
    "ember-source": "~3.5.1",
    "ember-test-selectors": "^2.1.0",
    "ember-truth-helpers": "^2.1.0",
    "ember-unused-components": "^1.0.3",
    "liquid-fire": "^0.30.0",
    "loader.js": "^4.7.0",
    "loaders.css": "^0.1.2",
    "node-sass": "^4.12.0",
    "qunit-dom": "^0.9.0"
rwjblue commented 5 years ago

Can someone put together a reproduction? I can't seem to replicate locally 🤔

rwjblue commented 5 years ago

Also, I suspect that this line from the v2.0.0...v2.1.0 diff is the cause: https://github.com/ember-cli/ember-load-initializers/compare/v2.0.0...v2.1.0#diff-e4773329e1307643c6f87869fd831500R42

But I'm not clear as to why. Can someone console.log(self) for me?

maxwondercorn commented 5 years ago

I've dropped my package.json into a new app to see if a particular dependency is at issue .

Unfortunately, I can now also break it with ember-load-initializers v2.0.0 depending on what parts I move 😢 Hopefully, I can create a reproduction from this.

maxwondercorn commented 5 years ago

@rwjblue It looks like the issue is caused by ember-cli-fallback-builds. The app build is scripted and the default is to production build with fallbacks. If I build without the fallbacks the app boots without issues. I can't say if this is the same the issue for @markusm7

I need to verify this on the master branch and will open an issue in ember-cli-fallbacks repo.

markusm7 commented 5 years ago

I'm not using fallbacks but im targeting older browsers for the production build (safari >= 9, iOS >= 9). I'm going to test against other targets.

markusm7 commented 5 years ago

Ok the targets don't seem change anything.

@rwjblue Where do you want me to console.log(self)? In the browser where the production build is used or somewhere specific in the app code?

markusm7 commented 5 years ago

Ok my problem is that loader, require, requirejs, requireModule and so on are defined on a global scope without setting it to window/self. Im wrapping the whole ember code in an anyomous function to scope things because my application gets loaded as a widget on a website and i dont want to let interfere non explicitly global code with the code of the website. Hence self, which is window, does not gets extended with those variables, cause they are simple local variables and further access (like self.requirejs) throws an error.

Any ideas how i could force those variables to a global object (e.g. window/self)? Or should this addon behave like others accessing requirejs and referencing it without the self.?

rwjblue commented 5 years ago

Ok my problem is, that loader, require, requirejs, requireModule and so on is defined on a global scope without setting it to window/self. Im wrapping the whole ember code in an anyomous function to scope things because my application gets loaded as a widget on a website and i dont want to let interfere non explicitly global code with the code of the website. Hence self, which is window, does not gets extended with those variables, cause they are simple local variables and further access (like self.requireJs) throws an error.

Awesome, thank you for digging and figuring out what is happening! The fix here is to not use self, AFAICT it was primarily used to make TypeScript happy with require. We should try to fix the typings differently and that should resolve the issue you are seeing.

rwjblue commented 5 years ago

I believe this is fixed in v2.1.1, please double check and let me know!

markusm7 commented 4 years ago

Sorry for the late response, couldn't get to it earlier!

But it works like a charm, thank you 👍