Error: Could not parse CSS stylesheet

[nhidtran]

cssom is installed with version "0.4.4"
and is a dependency for jsdom at ^0.4.4

Followed this thread when this was an issue at version 0.3.2 with no avail

[StJohn3D]

Same, it's breaking JSDOM for me too. Here is my CSS parsing error detail

detail: '\n' +
        '    @layer theme {\n' +
        '      :root {\n' +
        '        --theme-bodyBackgroundColor: #a85a5a;\n' +
        '        --theme-bodyTextColor: #a85a5a;\n' +
        '        --theme-buttonBackgroundColor: #a85a5a;\n' +
        '        --theme-buttonTextColor: #a85a5a;\n' +
        '        --theme-footerBackgroundColor: #a85a5a;\n' +
        '        --theme-footerTextColor: #a85a5a;\n' +
        '        --theme-headerBackgroundColor: #a85a5a;\n' +
        "        --theme-headerImage: 'TEST_HEADER_IMAGE_FILE_NAME.png';\n" +
        '        --theme-headerTextColor: #a85a5a;\n' +
        '      }\n' +
        '    }\n' +
        '    @layer overrides {\n' +
        '      nx-platform-shell {\n' +
        '        --header-bg-color-h: 0deg;\n' +
        '        --header-bg-color-s: 31%;\n' +
        '        --header-bg-color-l: 50.6%;\n' +
        '        --header-text-color: #a85a5a;\n' +
        '        --nav-toggle-icon-hover-color: #a85a5a;\n' +
        '      }\n' +
        '      nx-platform-menu-item {\n' +
        '        --active-bg-stop1-h: 0deg;\n' +
        '        --active-bg-stop1-s: 31%;\n' +
        '        --active-bg-stop1-l: 50.6%;\n' +
        '        --active-bg-stop2-h: 0deg;\n' +
        '        --active-bg-stop2-s: 31%;\n' +
        '        --active-bg-stop2-l: 50.6%;\n' +
        '        --icon-hover-color: #a85a5a;\n' +
        '      }\n' +
        '    }\n' +
        '  ',
      type: 'css parsing'

My guess is that my custom element names are breaking it.
Here are the version numbers I had when writing this comment.

jest-environment-jsdom: 29.3.1

jsdom: ^20.0.0

jsdom: 20.0.3

cssom: ^0.5.0

cssom: 0.5.0

[dr2009]

[email protected] not support @container ,@layer

[persocon]

[email protected] not support @container ,@layer

will it ever support? or there's a version that does? 🤔 this bug basically exists pointing to CSSOM since 2017, kinda weird no? 🤔

[xylophonehero]

Anyone coming here from tailwind land, I ended up using cva package to ignore the container styles when in a jest environment

const component = cva('bg-blue-500', { 
  variants: { 
    isTestEnv: { false: '@md:bg-red-500' }
  },
  defaultVariants: {
    isTestEnv: typeof jest !== 'undefined',
  },
})

component()

I couldn't just suppress the error as I have tests which check if elements are hidden that require css parsing