Как написать модульные тесты для CSS в компоненте Svelte? ⇐ CSS

[Anonymous]

Предположим, у меня есть компонент HelloWorld Svelte, как показано ниже:

Код: Выделить всё

//
// HelloWorld.svelte
//


export let name = 'world';


Hello {name}!


h1 {
background-color: #00b5e2;
padding: 20px;
border-radius: 8px;
margin: 5px 0 0 0;
font-weight: 400;
font-size: 20px;
line-height: 32px;
color: #fff;
}

Я настроил Vite в качестве компоновщика, а Vitest — в качестве тестовой среды для модульных тестов.
Я могу писать модульные тесты для тестирования скрипта. и html-части компонента с использованием Vitest и @testing-library
Однако теперь я также хотел бы написать тест, чтобы убедиться, что элемент h1:

• присвоил цвет #fff
• присвоил фоновый цвет #00b5e2
  и так далее

Кто-нибудь пробовал писать модульные тесты для CSS-части в Svelte? Буду очень признателен за любые рекомендации.
Я пробовал использовать Quixote, но, честно говоря, не совсем понял, как его интегрировать для тестирования компонентов Svelte, поскольку для запуска Quixote требуется предоставление отдельных файлов CSS. модульное тестирование, тогда как в Svelte CSS встроен в часть файла .svlete.

Подробнее здесь: https://stackoverflow.com/questions/786 ... -component