Docs Warning "Angular plugin is NOT ECMAScript 3 (ES3) compatible."

[OzBob]

https://learn.microsoft.com/en-us/azure/azure-monitor/app/javascript-framework-extensions?tabs=angular#angular-plugin-for-application-insights-javascript-sdk
says
"Warning: Angular plugin is NOT ECMAScript 3 (ES3) compatible."

What needs to be done to make this project "ECMAScript 3 (ES3) compatible"?

or do the Docs need updating?

[MSNev]

The biggest issue is that Angular itself is not ES3 compatible, which is why we have this statement

[OzBob]

Really? Could you point to me to some source data on that?

As of Mar 3 2023:
Angular build uses TypeScript 5 angular/angular-cli#24803
and
On the Microsoft Typescript blog Daniel Rosenwasser says they are targeting ECMAScript 2018
https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#runtime-requirements

[MSNev]

Sorry for the delay responding I was unexpectedly away yesterday.

This is based on the basic browser support of Angular which is not supporting older browser (such as IE8) which only support ES3, that support features that came into existence after ES3.

• https://v10.angular.io/guide/browser-support
• https://angular.io/guide/browser-support

And ES3 pre-dates ES2018, so when you target ES2018 you are allowed (and TypeScript will emit) to use basic JavaScript API's that did not exist in ES3.

There are several standard API's which are just not supported by ES3 and cannot be polyfilled (completely) such as getters and setters. In Application Insights we use the rollup-es3 (v2.x), rollup-es5 (v3.x) to detect and stop us from publishing any Application Insights builds with API's that are just not supported in (all) runtimes at our targeted level (these are because some of them TypeScript will still allow).

With v3.x (recently released) since we are targeting ES5 TypeScript allows us to use a bunch of API's that it blocked during compilation when targeting ES3 so we use this to block us and ensure that we use polyfills
https://github.com/microsoft/ApplicationInsights-JS/blob/main/tools/rollup-es5/src/es5/Es5Tokens.ts

And for ES3 here are the tokens https://github.com/microsoft/ApplicationInsights-JS/blob/master/tools/rollup-es3/src/es3/Es3Tokens.ts, the ES3 is a little more complete in that it has the ability to rewrite some unsupported usages into basic inline polyfill implementations

So as we are not using these fail-safes and Angular does not state that it supports ES3 we explicitly state that this component does not support ES3 and we are not intending to try and keep ES3 compatibility for components beyond our control.

If you are using a v2.x version of ApplicationInsights as the base that DOES support es3, so it would only be this plugin and angular in general (with it's dependencies) that would be a blocker from using in an environment that only supports ES3.

Note: event ES5 pre-dates ES2018 https://en.wikipedia.org/wiki/ECMAScript_version_history

[OzBob]

Thank you for an excellent explanation. My impression from the statement 'does not support ES3' was that this module was stuck in a undesirable pre-ES3 compatibility mode. Maybe just after the ES3 warning in the docs it would be helpful to say that these modules/libraries work with modern projects.