browser support - clarify default browserlist configuration differences with documentation

[bbarry]

📚 Docs or angular.io bug report

Description

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

Specifically, this page mentions support for IE 11 but the default browserlist for new applications is:

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major version
last 2 iOS major versions
Firefox ESR
not IE 9-11 # For IE 9-11 support, remove 'not'.

which leaves out IE11.

Perhaps this page should include the default browser list file for new applications and comment why this is the default if more than this is actually supported?

🔬 Minimal Reproduction

What's the affected URL?**

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

Reproduction Steps**

1. visit https://angular.io/guide/browser-support
2. read https://blog.angular.io/version-10-of-angular-now-available-78960babd41?gi=8bca91b3153b and note the stuff it says about ES5 and realize IE 11 is not added automatically then wonder what the default browserlist file actually is.
3. realize there is no easy documented way to see the default list
4. ng new temp and cancel it before it finishes installing everything but after it creates files (or just let it work if it is fast enough)
5. view browserlist

Expected vs Actual Behavior**

Expecting to see one of:

• IE 11 deprecated officially
• IE 11 deprecated for new applications
• note about IE 11 support status vs default configuration

Expecting to see:

• documentation about the default browserlist file and reasoning for why it is the way it is (like: why doesn't angular recommend default?)

[IgorMinar]

yeah. I agree that we could have split the the IE entries into two lines with better comments. for example:

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major version
last 2 iOS major versions
Firefox ESR
not IE 9-10 # Angular support for IE 9 & 10 has been deprecated and will be removed as of Angular v11.
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the `not` prefix on this line.

@alan-agius4 @clydin what do you think?

[IgorMinar]

I'm transferring this to the cli repo because the problem issue is in the .browserlist file generated by the CLI.

[alan-agius4]

@IgorMinar, we can do the above mentioned changed.

[alan-agius4]

@IgorMinar for ie9-10, I think you meant that support will be dropped in v11 and not v10.

[bbarry]

I feel like the template should be something like this:

# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries

# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support

# You can see what browsers were selected by your queries by running:
#   npx browserslist

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major version
last 2 iOS major versions
Firefox ESR
# Angular support for IE 9 & 10 has been deprecated as of Angular v10 and supporting code will be removed starting with v11.
not IE 9-10 # To opt-in remove the `not` prefix in this line<% if (legacyBrowsers) { %>
IE 11<% } else { %>
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the `not` prefix on this line..<% } %>

[IgorMinar]

@alan-agius4 correct. I fixed my comment. Thanks for catching the error.