Browser compatibility to Netbox

[Alestor]

NetBox version

v3.1.5

Python version

3.9

Steps to Reproduce

Use older browser like Chrome Version 76 or 84

• Go to Devices and select Filter
• Open a drop-down menu with dynamic content like Sites

Expected Behavior

Within the drop-down menu all available Sites should be displayed.

Observed Behavior

Non of the available sites are displayed. An error within the development Console is shown.

[kkthxbye-code]

replaceAll is available in Chrome 85, I suggest you ask your company to upgrade. I simply don't see a reason to support two+ year old browsers.

You can see other compatible browsers here:

https://caniuse.com/?search=replaceAll

There's really no good reason to run an old version of Chrome. If safety was a concern, updates would be an absolute must considering the amount of 0-days that have been release in the last two+ years for Chrome.

[jeremystretch]

Whether or not we tweak the code to support older browsers is up for debate (and I'd like to hear from @thatmattlove on the feasibility), we should at least note the minimum supported version of each major browser in the documentation.

[Alestor]

Thanks for your input. caniuse.com is very helpful, didn't know that site. My initial request on slack was about minimum supported Browser Versions for Netbox. I can confirm that with Chrome 85 the filters work as intended. I'll do some more test tomorrow.
I totally agree on running old version of any browsers is a security issue. My current case is the deployment of Netbox in a closed environment (without internet access), where also other Web Apps are running. Since there is a policy to ensure compatibility to all the legacy stuff, acceptance tests take a long time and the refresh of browsers happens only every couple of years. Unfortunately from experience I can tell, that this is not a unusual situation at big companies.
Anyway, I don't expect to get any support for this. I just need to be able to tell, what's the minimal requirements to run netbox.

[mathieu-mp]

We ran into the same issue here on another closed environment, after upgrading to 3.1.6.
Is there any chance we see some retro-compatibility implemented, or the use of a more compatible solution ?

[jeremystretch]

@mathieu-mp I'd be happy to assign this issue to you if you'd like to volunteer to change the relevant TypeScript to support older browsers.

[mathieu-mp]

I tried something there: #8555

[kkthxbye-code]

Edit:
Instead of matheius changes, I think the target here should be changed to ES2020:

https://github.com/netbox-community/netbox/blob/develop/netbox/project-static/tsconfig.json#L12

And them "ES2021.String" should be added to the lib option:

https://www.typescriptlang.org/tsconfig#lib

This will include the typescript standardlibrary for strings for everyone, not sure how big of an impact that is.

I'm still heavily against catering for old versions of auto-updating browsers. It's everything that the webdev space has been working hard to get away from for the past many years.

[mathieu-mp]

Edit: Instead of matheius changes, I think the target here should be changed to ES2020:

https://github.com/netbox-community/netbox/blob/develop/netbox/project-static/tsconfig.json#L12

And them "ES2021.String" should be added to the lib option:

https://www.typescriptlang.org/tsconfig#lib

This will include the typescript standardlibrary for strings for everyone, not sure how big of an impact that is.

I'm still heavily against catering for old versions of auto-updating browsers. It's everything that the webdev space has been working hard to get away from for the past many years.

Hi @kkthxbye-code, does it mean we wouldn't have to apply any code change, and that TypeScript would come with all that old browsers need to deal with e.g. string.replaceAll ?

[kkthxbye-code]

@mathieu-mp - I was actually wrong. Typescript doesn't provide polyfills at all, you can only target the es version of the syntax. So we are back to either gimping the usable JS version, adding polyfills or using something like babel.

If your change is accepted, the developer docs should be updated with what es version/features are allowed to be used.

Edit:
There should probably also be a way to catch if any newer features are used when bundling (I don't think it is fair to require contributers to install insecure browsers to test). I have had no luck finding anything. I tried something like es-check, but it doesn't catch the newer String methods. Neither does typescript if you change the target version. Looking at the bundle.js package, the target is already set to es2016 (what are we actually supporting?), so that clearly doesn't catch it. Babel is able to polyfill it using core-js if you target for example chrome 76.