AdguardTeam / ExtendedCss

A TypeScript library for non-standard element selecting — :contains(), :matches-css(), etc., and applying CSS styles with extended properties.
GNU General Public License v3.0
65 stars 9 forks source link

Chromium: User-Agent String Reduction #132

Closed asamofal closed 2 years ago

asamofal commented 3 years ago

Hello!

Recently Google Chrome started showing warnings because of navigator.userAgent usage. image

https://blog.chromium.org/2021/05/update-on-user-agent-string-reduction.html

Seems Chromium team is going to deprecate navigator.userAgent and it's not a reliable way to check the user's browser anymore.

The source of warnings: https://github.com/AdguardTeam/ExtendedCss/blob/8bfd062ca0f10c887167a8ecd9e6d975e083abe0/lib/utils.js#L32

utils.isSafariBrowser = (function () {
    const isChrome = navigator.userAgent.indexOf('Chrome') > -1;
    const isSafari = navigator.userAgent.indexOf('Safari') > -1;

    if (isSafari) {
        if (isChrome) {
            // Chrome seems to have both Chrome and Safari userAgents
            return false;
        }
        return true;
    }
    return false;
})();

and https://github.com/AdguardTeam/ExtendedCss/blob/8bfd062ca0f10c887167a8ecd9e6d975e083abe0/lib/utils.js#L210

There's a new way how you can get the browser brand in Chromium browsers: navigator.userAgentData?.brands?.some(b => b.brand === 'Google Chrome')

But navigator.userAgentData is not available in Safari now, so need to fix the isSafariBrowser function to check if navigator.userAgent is available or not before call it.

RobbyCBennett commented 2 years ago

This issue is still present with lib/utils.js:200, as well as in dist.