Bug: LyList could not parse CSS stylesheet during test

[TicTak21]

:beetle: Bug report

Describe the bug

I have a menu that contains ly-list component. When I want to test it I need to add LyListModule to the imports in test file. After that i get error(below)

Minimal Reproduction

Steps to reproduce the behavior:

1) Create component with the ly-list 2) Creat spec file with the following code:

import { LyDividerModule } from '@alyle/ui/divider';
import { LyIconModule } from '@alyle/ui/icon';
import { LyListModule } from '@alyle/ui/list';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { BaseThemeModule } from '@nnpz/shared/ui';
import { DrawerMenuComponent } from './drawer-menu.component';

describe('DrawerMenuComponent', () => {
  let component: DrawerMenuComponent;
  let fixture: ComponentFixture<DrawerMenuComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [DrawerMenuComponent],
      imports: [
        BaseThemeModule, // module with providers, config etc
        RouterTestingModule,
        HttpClientTestingModule,
        LyIconModule,
        LyDividerModule,
        LyListModule, // comment/uncomment it see the difference
      ],
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(DrawerMenuComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

3) Run test 4) Expect error in the console 5) If LyListModule is not imported(could be fixed with NO_ERRORS_SCHEMA):

 console.error
    NG0304: 'ly-list' is not a known element:
    1. If 'ly-list' is an Angular component, then verify that it is part of this module.
    2. If 'ly-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

6) If LyListModule is imported: error below

Result: test passes but with warning/error

Exception or Error

Stylesheet presented in the second paragraph(scroll)

console.error
    Error: Could not parse CSS stylesheet
        at exports.createStylesheet (/user/my-project/node_modules/jsdom/lib/jsdom/living/helpers/stylesheets.js:34:21)
        at HTMLStyleElementImpl._updateAStyleBlock (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:68:5)
        at HTMLStyleElementImpl._attach (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:19:12)
        at HTMLElementImpl._insert (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:845:14)
        at HTMLElementImpl._preInsert (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:768:10)
        at HTMLElementImpl._append (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:868:17)
        at HTMLElementImpl.appendChild (/user/my-project/node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:610:17)
        at HTMLElement.appendChild (/user/my-project/node_modules/jsdom/lib/jsdom/living/generated/Node.js:395:60)
        at LyTheme2._renderCss (/user/my-project/node_modules/.pnpm/@alyle+ui@13.0.0_1f09bae2af1289f634275f08c8b9b0f8/node_modules/@alyle/ui/fesm2020/alyle-ui.mjs:1841:19)

        at LyTheme2._createStyleContent2 (/user/my-project/node_modules/.pnpm/@alyle+ui@13.0.0_1f09bae2af1289f634275f08c8b9b0f8/node_modules/@alyle/ui/fesm2020/alyle-ui.mjs:1777:22) .LyList-root-a{display:block;position:relative;padding-top:8px;padding-bottom:8px;}.LyList-listItem-b{-webkit-tap-highlight-color:transparent;background-color:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;margin:0;outline:none;box-sizing:border-box;position:relative;text-decoration-line:none;-webkit-text-decoration-line:none;}.LyList-listItem-b::-moz-focus-inner:{border:0;}.LyList-listItem-b{font-family:'Roboto', sans-serif;font-size:1rem;color:rgb(255,255,255);display:flex;width:100%;position:relative;padding:0 16px;min-height:48px;overflow:hidden;text-align:left;align-items:flex-start;justify-content:flex-start;border-radius:0;}.LyList-listItem-b::after{content:'';}.LyList-listItem-b::after{position:absolute;top:0;bottom:0;left:0;right:0;}.LyList-listItem-b::after{width:100%;height:100%;background:transparent;opacity:0;pointer-events:none;}.LyList-listItem-b::after },.LyList-listItem-b::after.y-LyList-onFocusByKeyboard-c::after,.LyList-listItem-b::after.LyList-actionListItem-g:hover::after{background:currentColor;opacity:.13;border-radius:inherit;}.LyList-listItemContent-d{display:flex;justify-content:inherit;align-items:inherit;align-content:inherit;font-size:inherit;width:100%;height:100%;box-sizing:border-box;}.LyList-oneLine-e{padding-top:8px;padding-bottom:8px;min-height:48px;}.LyList-twoLine-f{padding-top:16px;padding-bottom:16px;min-height:64px;}.LyList-twoLine-f .LyList-lines-h{margin-bottom:-4px;}.LyList-actionListItem-g{cursor:pointer;user-select:none;}.LyList-lines-h{align-self:stretch;min-width:0;width:100%;justify-content:center;flex-direction:column;display:flex;}.LyList-listItemWithIcon-i .LyList-lines-h{padding-left:16px;}.LyList-twoLineWithIcon-j{padding-top:16px;padding-bottom:16px;}.LyList-twoLineWithIcon-j .LyList-lines-h{margin-bottom:-4px;}

      at VirtualConsole. (../../node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
      at exports.createStylesheet (../../node_modules/jsdom/lib/jsdom/living/helpers/stylesheets.js:38:63)
      at HTMLStyleElementImpl._updateAStyleBlock (../../node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:68:5)
      at HTMLStyleElementImpl._attach (../../node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:19:12)
      at HTMLElementImpl._insert (../../node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:845:14)
      at HTMLElementImpl._preInsert (../../node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:768:10)

Which versions of Angular, Alyle UI, OS, TypeScript, browsers are affected?

Alyle UI Version: v13.0.0

Angular Version:

Angular CLI: 13.2.3
Node: 16.13.1
Package Manager: pnpm 6.32.6
OS: darwin x64

Angular: 13.2.2
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1201.4
@angular-devkit/build-angular   13.2.3
@angular-devkit/core            12.1.4
@angular-devkit/schematics      12.1.4
@angular/cli                    13.2.3
@schematics/angular             12.2.4
rxjs                            7.3.0
typescript                      4.5.5

[Enlcxx]

@TicTak21 Thanks for reporting