philipp-winterle / crittr

High performance critical css extraction with a great configuration abilities

Home Page:https://hummal.github.io/crittr/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

@supports inside of @media throws an Exception

DirkPersky opened this issue · comments

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):

  • Windows

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

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

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

@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.

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.

@DirkPersky any news on this?

Yes, now it looks fine.