philipp-winterle / crittr

High performance critical css extraction with a great configuration abilities
https://hummal.github.io/crittr/
GNU General Public License v3.0
51 stars 6 forks source link

@supports inside of @media throws an Exception #34

Closed DirkPersky closed 2 years ago

DirkPersky commented 2 years ago

Describe the bug Using @supports css inside of @media throws an exception. If u remove the Media Query it works.

To Reproduce

(async () => {
    const Crittr = require("crittr");
    try {
        const { critical, rest } = await Crittr({
            urls: _URLS_,
            css: `

            @charset "UTF-8";
            @media (min-width: 576px) {
                @supports (display: grid) {
                    div {
                        display: grid;
                      }
                }
            }
            `
        });

        console.log(critical);
    } catch (err) {
        console.error(err);
    }
})();
►  Crittr Run Initialized timer...
C:\Users\Dirk\Desktop\projekte\trash\above\node_modules\crittr\lib\classes\CssTransformator.class.js:140
internalRule.selectors = internalRule.selectors.filter(
                                                ^

TypeError: Cannot read properties of undefined (reading 'filter')
    at C:\Users\Dirk\Desktop\projekte\trash\above\node_modules\crittr\lib\classes\CssTransformator.class.js:140:49
    at Array.map (<anonymous>)
    at C:\Users\Dirk\Desktop\projekte\trash\above\node_modules\crittr\lib\classes\CssTransformator.class.js:136:26
    at Array.map (<anonymous>)
    at CssTransformator.filterByMap (C:\Users\Dirk\Desktop\projekte\trash\above\node_modules\crittr\lib\classes\CssTransformator.class.js:130:44)
    at C:\Users\Dirk\Desktop\projekte\trash\above\node_modules\crittr\lib\classes\Crittr.class.js:747:71
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

Screenshots image

Environment (please complete the following information):

Additional context I cant remove the @media @supports becouse it comes out of a vendor ( http://fancybox.net/ ) repository.

philipp-winterle commented 2 years ago

Thank you for the detailed report. I will see what I can do about that issue.

philipp-winterle commented 2 years ago

Takes longer due to more complex rework. I missed to have multiple nested groups like support in media.

philipp-winterle commented 2 years ago

@DirkPersky I finished working on your request. Are you able to test the new version from github? Otherwise I will create a new beta version to test for you.

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 20 days with no activity. Remove stale label or comment or this will be closed in 5 days.

philipp-winterle commented 2 years ago

@DirkPersky any news on this?

DirkPersky commented 2 years ago

Yes, now it looks fine.