Vanilla Extract rewrite #642
Annotations
3 errors and 10 warnings
src/components/organisms/Toast/Toast.test.tsx > <Toast /> > should not be visible if not open:
components/src/components/organisms/Toast/Toast.test.tsx#L28
TestingLibraryElementError: Unable to find an element with the text: Test. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div />
</body>
Ignored nodes: comments, script, style
<html>
<head />
<body>
<div />
</body>
</html>...
❯ Module.waitForWrapper ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:163:27
❯ src/components/organisms/Toast/Toast.test.tsx:28:11
|
src/components/organisms/Toast/Toast.test.tsx > <Toast /> > should show children if desktop variant:
components/src/components/organisms/Toast/Toast.test.tsx#L58
TestingLibraryElementError: Unable to find an element by: [data-testid="action"]
Ignored nodes: comments, script, style
<body>
<div />
<div
class="toast"
>
<div
class="thorin-btclh05t thorin-btclh01qn thorin-btclh010z thorin-btclh01ef thorin-btclh01f1 thorin-btclh01dt thorin-btclh01d7 thorin-btclh0l3 thorin-btclh012t thorin-btclh01j thorin-btclh025 thorin-btclh06f thorin-btclh0jv thorin-btclh0rt thorin-btclh01pf thorin-btclh089 thorin-btclh0i1 thorin-btclh0kh thorin-btclh0j9 thorin-btclh0z5 thorin-btclh0in thorin-btclh01rv thorin-btclh01sh thorin-btclh01r9 thorin-btclh0r7 thorin-btclh0hf"
data-testid="toast-touch"
style="--thorin-btclh05i: flex-start; --thorin-btclh01qc: blur(16px); --thorin-btclh010o: rbga(255,255,255,0.8); --thorin-btclh01e4: var(--thorin-color-greySurface); --thorin-btclh01eq: var(--thorin-radii-2xLarge); --thorin-btclh01di: solid; --thorin-btclh01cw: var(--thorin-borderWidths-1x); --thorin-btclh0ks: unset; --thorin-btclh012i: $0.02; --thorin-btclh018: flex; --thorin-btclh01u: column; --thorin-btclh064: center; --thorin-btclh0jk: 3.75%; --thorin-btclh0ri: unset; --thorin-btclh01p4: 1; --thorin-btclh07y: var(--thorin-space-4_5); --thorin-btclh0hq: fixed; --thorin-btclh0k6: unset; --thorin-btclh0iy: calc(100vh / 100 * 2.5); --thorin-btclh0yu: unset; --thorin-btclh0ic: translateY(0px); --thorin-btclh01rk: var(--thorin-transitionDuration-300); --thorin-btclh01s6: all; --thorin-btclh01qy: var(--thorin-transitionTimingFunction-popIn); --thorin-btclh0qw: 92.5%; --thorin-btclh0h4: 10000; top: 19.200000000000003px;"
>
<div
class="thorin-btclh0zr thorin-btclh0bx thorin-btclh0cj thorin-btclh0ed thorin-btclh0ez"
style="--thorin-btclh0zg: var(--thorin-color-textPrimary); --thorin-btclh0bm: var(--thorin-fonts-sans); --thorin-btclh0c8: var(--thorin-fontSizes-headingFour); --thorin-btclh0e2: var(--thorin-fontWeights-bold); --thorin-btclh0eo: var(--thorin-lineHeights-headingFour);"
>
Test
</div>
<div
class="thorin-btclh0zr thorin-btclh0bx thorin-btclh0cj thorin-btclh0ed thorin-btclh0ez"
style="--thorin-btclh0zg: var(--thorin-color-textPrimary); --thorin-btclh0bm: var(--thorin-fonts-sans); --thorin-btclh0c8: var(--thorin-fontSizes-body); --thorin-btclh0e2: var(--thorin-fontWeights-normal); --thorin-btclh0eo: var(--thorin-lineHeights-body);"
/>
<div
class="thorin-btclh05t thorin-btclh01j thorin-btclh06f thorin-btclh0mx thorin-btclh0a3 thorin-btclh0r7"
style="--thorin-btclh05i: center; --thorin-btclh018: flex; --thorin-btclh064: center; --thorin-btclh0mm: calc(-1 * 0.5rem); --thorin-btclh09s: var(--thorin-space-3); --thorin-btclh0qw: var(--thorin-space-full);"
>
<div
class="thorin-btclh010z thorin-btclh01f1 thorin-btclh0bb thorin-btclh0r7"
style="--thorin-btclh010o: var(--thorin-color-border); --thorin-btclh01eq: var(--thorin-radii-full); --thorin-btclh0b0: var(--thorin-space-1); --thorin-btclh0qw: var(--thorin-space-8);"
/>
</div>
</div>
</div>
</body>
Ignored nodes: comments, script, style
<html>
<head />
<body>
<div />
<div
class="toast"
>
<div
class="thorin-btclh05t thorin-btclh01qn thorin-btclh010z thorin-btclh01ef thorin-btclh01f1 thorin-btclh01dt thorin-btclh01d7 thorin-btclh0l3 thorin-btclh012t thorin-btclh01j thorin-btclh025 thorin-btclh06f thorin-btclh0jv thorin-btclh0rt thorin-btclh01pf thorin-btclh089 thorin-btclh0i1 thorin-btclh0kh thorin-btclh0j9 thorin-btclh0z5 thorin-btclh0in thorin-btclh01rv thorin-btclh01sh thorin-btclh01r9 thorin-btclh0r7 thorin-btclh0hf"
data-testid="toast-touch"
style="--thorin-btclh05i: flex-start; --thorin-btclh01qc: blur(16px); --thorin-btclh010o: rbga(255,255,255,0.8); --thorin-btclh01e4: var(--thorin-color-greySurface); --thorin-btclh01eq: var(--thorin-radii-2xLarge); --thorin-btclh01di: solid; --thorin-btclh01cw: var(--thorin-borderWidths-1x); --thorin-btclh0ks: unset; --thorin-btclh012i: $0.02; --thorin-btclh018: flex; --thorin-btclh01u: column;
|
Test (18)
Process completed with exit code 1.
|
Lint (18):
components/src/components/atoms/Box/Box.tsx#L41
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/atoms/DynamicPopover/DynamicPopover.tsx#L467
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/atoms/Field/Field.tsx#L300
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/Dropdown/Dropdown.tsx#L216
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/Dropdown/Dropdown.tsx#L404
Using 'Children.map' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/Dropdown/Dropdown.tsx#L406
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/PageButtons/PageButtons.tsx#L135
Do not use Array index as 'key'
|
Lint (18):
components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx#L104
Using 'Children.map' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx#L116
Using 'cloneElement' is uncommon and can lead to fragile code. Use alternatives instead
|
Lint (18):
components/src/components/molecules/Tooltip/Tooltip.tsx#L149
Using 'Children.only' is uncommon and can lead to fragile code. Use alternatives instead
|