<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.github

cssom@0.5.0 not support <a class="user-mention notranslate" data-hovercard-type="user"

cssom@0.5.0 not support <a class="user-mention notranslate" data-hovercar

Error: Could not parse CSS stylesheet about cssom HOT 4 OPEN

nhidtran commented on July 30, 2024 5

Error: Could not parse CSS stylesheet

from cssom.

Comments (4)

dr2009 commented on July 30, 2024 16

[email protected] not support @container ,@layer

from cssom.

StJohn3D commented on July 30, 2024

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

from cssom.

persocon commented on July 30, 2024

[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? 🤔

from cssom.

xylophonehero commented on July 30, 2024

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