[Broken Website] Firefox, Costco website sign in pages are not loading with this extension.

[jasperitnow]

Prerequisites

• [X] I searched for any existing report about this website issue to avoid opening a duplicate.
• [X] I can reproduce this website issue in a new, unmodified web browser profile with Dark Reader installed as the only extension.

Website Issue Description

1. Open costco.com
2. Click Sign in /register
3. Observe the login page broken.
4. Disabled the extension and everything works fine.

Website Address

www.costco.com

Steps To Reproduce

1. Open costco.com
2. Click Sign in /register
3. Observe the login page broken.
4. Disabled the extension and everything works fine.

Screenshots

No response

Operating System

Windows and others too

Web Browser name and version

Firefox all versions

Dark Reader version

All the versions

Additional Context

No response

[zelch]

This also applies to many of the product pages, just navigating to something like https://www.costco.com/kirkland-signature-plush-blanket.product.100419860.html will consume a bunch of resources and never fully load, but only if Dark Reader is enabled for costco.com.

Digging into this with the Chrome development tools, hitting stop almost always puts us in a function called addCSSRule.

The problematic spot seems to be:

        var styleSheet = document.styleSheets[0];
        try {

            if (styleSheet.addRule) {
                if (typeof (selector) == 'string') {
                    styleSheet.addRule(selector, rule, 0);
                } else {
                    for (var i = 0; i < selector.length; i++) {
                        styleSheet.addRule(selector[i], rule, 0);
                    }
                }
            } else if (styleSheet.insertRule) {
                if (typeof (selector) == 'string') {
                    styleSheet.insertRule(selector + '{' + rule + '}', 0);
                } else {
                    for (var j = 0; j < selector.length; j++) {
                        styleSheet.insertRule(selector[j] + '{' + rule + '}', 0);
                    }
                }
            }
        } catch (err) {
            // create a new style sheet we can play with if the first one is not editable
            headNode.insertBefore(document.createElement('style'), headNode.firstChild);
            this.addCSSRule.apply(this, arguments);
        }

With an error of: Cannot read properties of undefined (reading 'addRule')

There is a check earlier in the function for document.styleSheets being false, which breaks out of the function.

There is also a check for document.styleSheets.length === 0, which would add a new style element to the 'head' node. That appears to be triggering.

But at a guess, Dark Reader is putting things in a state where document.styleSheets isn't a false value, but where document.styleSheets[0] is undefined, and document.styleSheets.length === 0. That then causes an infinite loop, with it adding objects to the DOM tree every loop.

[hmnd]

Just chiming in to say that this issue applies to international variants of Costco's site (eg. www.costco.ca)