Could not parse CSS stylesheet Jest & js-dom

2.8k Views Asked by At

i use react - typescript - sass - jest. but jest virtual-console said 'Error: Could not parse CSS stylesheet'. @import css file doesn't make sense.It's just style. I wont use Jest! Help me!

How I fix Parser Controller I'm Realy wont ude jest!

import * as React from "react";

configure({ adapter: new Adapter() });

describe("스냅샷 테스트 시트", () => {
  let wrapper: any = null;
  it("matches snapshot", () => {
    wrapper = renderer.create(<RecordBoxEx />);
  });
});

jest log

 console.error node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/virtual-console.js:29
      Error: Could not parse CSS stylesheet
          at exports.createStylesheet (C:\Users\user\Desktop\비상교육\개발관련\개발소스\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\helpers\stylesheets.js:35:21)
          at HTMLStyleElementImpl._updateAStyleBlock (C:\Users\user\Desktop\비상교육\개발관련\개발소스\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\nodes\HTMLStyleElement-impl.js:67:5)
          at HTMLStyleElementImpl._childTextContentChangeSteps (C:\Users\user\Desktop\비상교육\개발관련\개발소스\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\nodes\HTMLStyleElement-impl.js:36:12),
          (...)
          at Object.<anonymous> (C:\Users\user\Desktop\비상교육\개발관련\개발소스\common\shareClbee\newComponents\RecordBox\record.scss:3:1)
          at Runtime._loadModule (C:\Users\user\Desktop\비상교육\개발관련\개발소스\node_modules\jest-runtime\build\index.js:577:12) @import "./../var.scss";
      @import "../button.scss";
      .record_box {
        top: 450px;
        visibility: visible;

        &.off {
          display: none;
        }

        .swiper-pagination-bullet {
          pointer-events: none;
        }
        text-align: center;
        .swiper-container {
          position: relative;
          width: 100%;
          height: 322px;
          margin-top: 102px;
          .swiper-pagination {
            position: absolute;
            top: 0px;
            bottom: unset;
            font-size: 0px;
            .swiper-pagination-bullet-active {
              background: #ff2a66;
            }
          }

          // background-color: rgba(0, 0, 0, 0.2);
        }

    console.warn node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2256
      Warning: componentWillReceiveProps has been renamed, and is not recommended for use.

      * Move data fetching code or side effects to componentDidUpdate.
      * If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. 
      * Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

      Please update the following components: RecordBoxEx

0

There are 0 best solutions below