Refactor to vanilla sprinkles (Extreme edition) #687
Annotations
10 errors
|
node_modules/.pnpm/@[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js#L132
SprinklesError: "flex" has no value 0. Possible values are "1", "0 0 1px", "auto", "initial", "none", "inherit"
❯ invalidPropValue ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:132:19
❯ _loop ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:139:15
❯ Module.sprinklesFn ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:181:11
❯ src/components/atoms/Box/Box.tsx:41:23
❯ renderWithHooks ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:15486:18
❯ updateForwardRef ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:19245:20
❯ beginWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:21675:16
❯ beginWork$1 ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27465:14
❯ performUnitOfWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26599:12
❯ workLoopSync ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26505:5
|
|
node_modules/.pnpm/@[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js#L132
SprinklesError: "left" has no value "100px". Possible values are "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "18", "20", "24", "26", "28", "30", "32", "36", "40", "44", "45", "48", "52", "56", "60", "64", "72", "80", "96", "112", "128", "144", "168", "192", "224", "256", "288", "320", "-1.5", "-4", "-6", "-px", "px", "0.25", "0.5", "0.75", "1.25", "1.5", "1.75", "2.5", "3.5", "4.5", "5.5", "6.5", "7.5", "8.5", "22.5", "1/4", "1/3", "1/2", "2/3", "3/4", "auto", "full", "fit", "max", "min", "60vh", "80vw", "viewHeight", "viewWidth", "none", "dialogMobileWidth", "dialogDesktopWidth", "unset"
❯ invalidPropValue ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:132:19
❯ _loop ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:139:15
❯ Module.sprinklesFn ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:181:11
❯ src/components/atoms/Box/Box.tsx:41:23
❯ renderWithHooks ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:15486:18
❯ updateForwardRef ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:19245:20
❯ beginWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:21675:16
❯ beginWork$1 ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27465:14
❯ performUnitOfWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26599:12
❯ workLoopSync ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26505:5
|
|
node_modules/.pnpm/@[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js#L132
SprinklesError: "left" has no value "100px". Possible values are "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "18", "20", "24", "26", "28", "30", "32", "36", "40", "44", "45", "48", "52", "56", "60", "64", "72", "80", "96", "112", "128", "144", "168", "192", "224", "256", "288", "320", "-1.5", "-4", "-6", "-px", "px", "0.25", "0.5", "0.75", "1.25", "1.5", "1.75", "2.5", "3.5", "4.5", "5.5", "6.5", "7.5", "8.5", "22.5", "1/4", "1/3", "1/2", "2/3", "3/4", "auto", "full", "fit", "max", "min", "60vh", "80vw", "viewHeight", "viewWidth", "none", "dialogMobileWidth", "dialogDesktopWidth", "unset"
❯ invalidPropValue ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:132:19
❯ _loop ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:139:15
❯ Module.sprinklesFn ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:181:11
❯ src/components/atoms/Box/Box.tsx:41:23
❯ renderWithHooks ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:15486:18
❯ updateForwardRef ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:19245:20
❯ beginWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:21675:16
❯ beginWork$1 ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27465:14
❯ performUnitOfWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26599:12
❯ workLoopSync ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26505:5
|
|
components/src/components/molecules/Modal/Modal.test.tsx#L14
Error: expect(element).toBeVisible()
Received element is not visible:
<div
class="_1jwf1bt1u0 _1jwf1bt1v6 _1jwf1bt1o0 _1jwf1btasu _1jwf1btau6 _1jwf1btaue _1jwf1btatw _1jwf1btav4"
/>
Ignored nodes: comments, script, style
<html>
<head />
<body
data-backdrops="1"
style="width: 0px; position: fixed; top: -0px;"
>
<div />
<div
class="modal"
>
<div
class="_1jwf1bt1u0 _1jwf1bt1v6 _1jwf1bt1o0 _1jwf1btasu _1jwf1btau6 _1jwf1btaue _1jwf1btatw _1jwf1btav4"
>
Modal
</div>
</div>
</body>
</html>...
❯ waitFor.timeout src/components/molecules/Modal/Modal.test.tsx:14:59
❯ runWithExpensiveErrorDiagnosticsDisabled ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/config.js:47:12
❯ checkCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:124:77
❯ Timeout.checkRealTimersCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:118:16
|
|
components/src/components/molecules/Profile/Profile.test.tsx#L27
AssertionError: expected '' to deeply equal '0x155...ccb92'
- Expected
+ Received
- 0x155...ccb92
❯ src/components/molecules/Profile/Profile.test.tsx:27:38
|
|
node_modules/.pnpm/@[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js#L132
SprinklesError: "left" has no value "100px". Possible values are "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "18", "20", "24", "26", "28", "30", "32", "36", "40", "44", "45", "48", "52", "56", "60", "64", "72", "80", "96", "112", "128", "144", "168", "192", "224", "256", "288", "320", "-1.5", "-4", "-6", "-px", "px", "0.25", "0.5", "0.75", "1.25", "1.5", "1.75", "2.5", "3.5", "4.5", "5.5", "6.5", "7.5", "8.5", "22.5", "1/4", "1/3", "1/2", "2/3", "3/4", "auto", "full", "fit", "max", "min", "60vh", "80vw", "viewHeight", "viewWidth", "none", "dialogMobileWidth", "dialogDesktopWidth", "unset"
❯ invalidPropValue ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:132:19
❯ _loop ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:139:15
❯ Module.sprinklesFn ../node_modules/.pnpm/@Vanilla-Extract[email protected]_@[email protected][email protected]_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js:181:11
❯ src/components/atoms/Box/Box.tsx:41:23
❯ renderWithHooks ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:15486:18
❯ updateForwardRef ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:19245:20
❯ beginWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:21675:16
❯ beginWork$1 ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27465:14
❯ performUnitOfWork ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26599:12
❯ workLoopSync ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26505:5
|
|
components/src/components/molecules/Profile/Profile.test.tsx#L58
AssertionError: expected 'block' to deeply equal 'none'
Expected: "none"
Received: "block"
❯ src/components/molecules/Profile/Profile.test.tsx:58:21
|
|
components/src/components/molecules/Select/Select.test.tsx#L138
TestingLibraryElementError: Unable to find an accessible element with the role "listbox"
Here are the accessible roles:
combobox:
Name "":
<div
aria-controls="listbox-6"
aria-expanded="true"
aria-haspopup="listbox"
class="_1jwf1btat4 _1jwf1btati _1jwf1btass _1avz0ws0"
data-testid="select-container"
id="combo-6"
role="combobox"
tabindex="-1"
/>
--------------------------------------------------
button:
Name "":
<button
class="_1jwf1bt1qu _1jwf1btb0 _1jwf1btat4 _1jwf1bt1u0 _1jwf1bt4l0 _1jwf1bt1so _1jwf1bt6jc _1jwf1bt8fo _1jwf1bt8to"
id="chevron"
type="button"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body>
<div>
<div>
<div>
outside
</div>
<div
class="_1jwf1bt1u0 _1jwf1bt1vi _1jwf1bt2dc _1jwf1bt1si _1jwf1btass _1jwf1bt4yo"
>
<div
class="_1jwf1bt8to _1jwf1bt97c _1jwf1bt1qu _1jwf1bt1u0 _1jwf1bt2dc _1jwf1btar2"
>
<label
class="_1jwf1bt1u0 _1jwf1bt2a0 _1jwf1btar2 _1jwf1btass"
for="thorin6-6"
id="thorin6-6-label"
>
<div
class="_1jwf1btb0 _1jwf1btapq _1jwf1btar2 _1jwf1btarg _1jwf1btaro _1jwf1bt4yo _6an2ibg _1jwf1btaqe _1jwf1btaqw _1jwf1btapy"
>
select
</div>
</label>
</div>
<div
aria-controls="listbox-6"
aria-expanded="true"
aria-haspopup="listbox"
class="_1jwf1btat4 _1jwf1btati _1jwf1btass _1avz0ws0"
data-testid="select-container"
id="combo-6"
role="combobox"
tabindex="-1"
>
<div
class="_1jwf1bt1qu _1jwf1bt170 _1jwf1bt1mc _1jwf1btacu _1jwf1btb0c _1jwf1btase _1jwf1btat4 _1jwf1bt1u0 _1jwf1bt1w0 _1jwf1bt2dc _1jwf1bt4l0 _1jwf1btar2 _6arcis0"
>
<input
aria-hidden="true"
aria-labelledby="thorin6-6-label"
class="_1jwf1bt4v6 _1jwf1bt4hi _1jwf1btar2 _1jwf1btasq _1jwf1btaus"
id="thorin6-6"
tabindex="-1"
value=""
/>
<div
class="_1jwf1btb0 _1jwf1btate _1jwf1bt1w0 _1jwf1btar2 _1jwf1btarg _1jwf1btaro"
/>
<button
class="_1jwf1bt1qu _1jwf1btb0 _1jwf1btat4 _1jwf1bt1u0 _1jwf1bt4l0 _1jwf1bt1so _1jwf1bt6jc _1jwf1bt8fo _1jwf1bt8to"
id="chevron"
type="button"
>
<svg
class="_1jwf1bt1tu _1jwf1btaue _1jwf1btatu"
fill="currentColor"
viewBox="0 0 96 96"
xmlns="http://www.w3.org/2000/svg"
>
<path
clip-rule="evenodd"
d="M52.243 70.243a6 6 0 0 1-8.486 0l-30-30a6 6 0 1 1 8.486-8.486L48 57.515l25.757-25.758a6 6 0 1 1 8.486 8.486l-30 30Z"
fill="currentColor"
fill-rule="evenodd"
/>
</svg>
</button>
</div>
<div
class="_1jwf1bt170 _1jwf1bt1mc _1jwf1btadc _1jwf1btb0c _1jwf1btase _1jwf1bt1to _1jwf1bt3hu _1jwf1btaqw _1jwf1bt5q0 _1jwf1btar2 _1jwf1bt8g0 _1jwf1btasq _1jwf1bt3vi"
id="listbox-6"
role="listbox"
tabindex="-1"
>
<div
class="_1jwf1bt4yo _1jwf1bt4l0 _1jwf1bt1qi _1jwf1bt1u0 _1jwf1bt1vi _1jwf1bt2d6 _1jwf1btar2"
>
<button
class="_1jwf1bt8tu _1jwf1bt97i _1jwf1bt1qu _1jwf1bt18u _1jwf1bt18z _1jwf1btacu _1jwf1btc6 _1jwf1btb5 _1jwf1btat4 _1jwf1btat7 _1jwf1bt1u0 _1jwf1bt1xo _1jwf1bt1x0 _1jwf1btapw _1jwf1bt1si _1jwf1btape _1jwf1btau2 _1jwf1btaue _1jwf1btatu _1jwf1btaro _1jwf1bt4yo"
data-option-index="0"
data-testid="select-option-0"
role="option"
type="button"
>
<div
class="_1jwf1bt1w0 _1jwf1btar2 _1jwf1btarg _1jwf1btaro"
>
|
|
components/src/components/organisms/Dialog/Dialog.test.tsx#L19
Error: expect(element).toBeVisible()
Received element is not visible:
<div
class="_1jwf1bt1qu _1jwf1bt170 _1jwf1btaep _1jwf1btage _1jwf1btahd _1jwf1btaj2 _1jwf1btado _1jwf1bt1u0 _1jwf1bt1vi _1jwf1bt2dp _1jwf1bt2e2 _1jwf1bt5e7 _1jwf1bt5d8 _1jwf1bt5rv _1jwf1bt5jq _1jwf1btar2 _1jwf1bt8gd _1jwf1bt8gq _1jwf1btass _1jwf1bt4yo"
/>
Ignored nodes: comments, script, style
<html>
<head />
<body
data-backdrops="1"
style="width: 0px; position: fixed; top: -0px;"
>
<div />
<div
class="modal"
>
<div
class="_1jwf1bt1u0 _1jwf1bt1v6 _1jwf1bt1o0 _1jwf1btasu _1jwf1btau6 _1jwf1btaue _1jwf1btatw _1jwf1btav4"
>
<div
class="_1jwf1bt1qu _1jwf1bt170 _1jwf1btaep _1jwf1btage _1jwf1btahd _1jwf1btaj2 _1jwf1btado _1jwf1bt1u0 _1jwf1bt1vi _1jwf1bt2dp _1jwf1bt2e2 _1jwf1bt5e7 _1jwf1bt5d8 _1jwf1bt5rv _1jwf1bt5jq _1jwf1btar2 _1jwf1bt8gd _1jwf1bt8gq _1jwf1btass _1jwf1bt4yo"
>
Modal
</div>
</div>
</div>
</body>
</html>...
❯ waitFor.timeout src/components/organisms/Dialog/Dialog.test.tsx:19:59
❯ runWithExpensiveErrorDiagnosticsDisabled ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/config.js:47:12
❯ checkCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:124:77
❯ Timeout.checkRealTimersCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:118:16
|
|
components/src/components/organisms/Toast/Toast.test.tsx#L14
Error: expect(element).toBeVisible()
Received element is not visible:
<div
class="_1jwf1btc6 _1jwf1btapq _6an2ibg _1jwf1btaq8 _1jwf1btaqq _1jwf1btapy"
/>
Ignored nodes: comments, script, style
<html>
<head />
<body>
<div />
<div
class="toast"
>
<div
class="_1jwf1bt1qi _1jwf1bt1ki _1jwf1btadc _1jwf1btb0c _1jwf1btase _1jwf1bt1u0 _1jwf1bt1vi _1jwf1bt1su _1jwf1bt1o0 _1jwf1bt8pc _1jwf1btasu _1jwf1btau6 _1jwf1btaue _1jwf1btatw _1jwf1btav6"
data-testid="toast-desktop"
open=""
>
<svg
class="_1jwf1bt4oi _1jwf1bt4au _1jwf1btat4 _1jwf1bt1oc _1jwf1bt1oj _1jwf1bt8oo _1jwf1btasq _1jwf1bt3rc _1jwf1bt300 _1jwf1btau2 _1jwf1btaue _1jwf1btatu"
data-testid="toast-close-icon"
fill="currentColor"
viewBox="0 0 96 96"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M17.757 26.243a6 6 0 1 1 8.486-8.486L48 39.515l21.757-21.758a6 6 0 1 1 8.486 8.486L56.485 48l21.758 21.757a6 6 0 1 1-8.486 8.486L48 56.485 26.243 78.243a6 6 0 1 1-8.486-8.486L39.515 48 17.757 26.243Z"
fill="currentColor"
/>
</svg>
<div
class="_1jwf1btc6 _1jwf1btapq _6an2ibg _1jwf1btaq8 _1jwf1btaqq _1jwf1btapy"
>
Test
</div>
<div
class="_1jwf1btc6 _1jwf1btapq _6an2ibg _1jwf1btaqe _1jwf1btaqw _1jwf1btapw"
/>
</div>
</div>
</body>
</html>...
❯ waitFor.timeout src/components/organisms/Toast/Toast.test.tsx:14:58
❯ runWithExpensiveErrorDiagnosticsDisabled ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/config.js:47:12
❯ checkCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:124:77
❯ Timeout.checkRealTimersCallback ../node_modules/.pnpm/@testing-library[email protected]/node_modules/@testing-library/dom/dist/wait-for.js:118:16
|
This job failed
Loading