Can't load Intl polyfill in route hook

Our Ember apps support iOS 9 webviews and Mobile Safari, which require the Intl API to be polyfilled. We don’t want to burden other users with the API and locale data polyfill, so we need to load it conditionally based on feature detection.

We’d like to load these conditional polyfills in our application route hooks, to take advantage of their handling of async behaviour. Unfortunately, this isn’t currently possible, as the app will crash out due to missing Intl before any routes are instantiated.

The issue is that ember-intl’s instance initializer eagerly-inits the intl service, which inits some formatters, which crash out due to a dependency on the Intl API.

I also raised this issue in the #topic-i18n channel of Ember Discord in early April 2019.

Since this crash occurs in an instance initializer, which don’t support async operations, our workaround options are limited.

Presently, we’ve had to place our conditional polyfill logic in an application initializer, and use application.deferReadiness() and application.advanceReadiness to ensure the polyfill is loaded before ember-intl runs its own instance initializer.

Ideally, we’d like 1 of 2 solutions to become possible:

• placing our conditional polyfill logic in our application route hook
  • this would mean ember-intl’s instance initializer and intl service, would need to avoid calling Intl
  • could the formatter instantiation be done lazily, perhaps?
• adding conditional polyfill logic to ember-intl, so the intl service can polyfill itself before using Intl

I’d be open to contributing the latter - if we had a plan of attack I could pitch to my employers, we could schedule time for me to work on it.

Could a solution complement the work in https://github.com/ember-intl/experimental-polyfill, by adding autoPolyfill.strategy = FEATURE_DETECT?

Issue Template

• I am on the latest ember-intl version
• I have searched the issues of this repo and believe that this is not a duplicate

Environment

• Ember Version: 3.5.0
• Ember CLI Version: 3.5.1
• Ember Intl Version: 2.33.4
• Browser(s): iOS 9.3 webviews or Mobile Safari
• Node Version: 10.15.0

We are on ember-intl@2.33.4, but the issue exists on current master as well: https://github.com/ember-intl/ember-intl/blob/master/addon/initializer.js

Steps to Reproduce

1. create an Ember app with ember-intl
2. add logic in your application route hook to conditionally load the Intl polyfill, based on feature detection
3. load your app in a browser that doesn’t support the JS Intl API, such as an iOS 9 simulator

The app will crash out with ReferenceError: Can't find variable: Intl.

[timiyay]

No worries. Feel free to shout out when you’ve got a direction in mind, and I can figure out how to contribute.

This issue is solved for my use case - I’ll leave it to you whether you want to close it, or keep it open to track the lazy API work.

[jasonmit]

I would not integrate with that addon. That’s experimental, I plan to finalize that work.