build(deps-dev): bump chromatic from 11.28.0 to 13.1.3 #266
Annotations
10 errors
|
src/components/common/Select/Select.test.tsx > Component: Select > Snapshot > Default:
src/components/common/Select/Select.test.tsx#L13
Error: Snapshot `Component: Select > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -10,15 +10,10 @@
data-a11y-ignore="aria-hidden-focus"
data-react-aria-prevent-focus="true"
data-testid="hidden-select-container"
style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
>
- <input
- style="font-size: 16px;"
- tabindex="-1"
- type="text"
- />
<label>
<select
tabindex="-1"
>
<option />
@@ -41,18 +36,19 @@
</label>
</div>
<button
aria-expanded="false"
aria-haspopup="listbox"
- aria-labelledby="react-aria-:r7:"
+ aria-labelledby="react-aria-«r7»"
- class="cursor-pointer active:bg-gray-300 flex w-1/2 flex-row items-center justify-between rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
+ class="cursor-pointer active:bg-gray-300 flex w-1/2 flex-row items-center justify-between rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
- id="react-aria-:r2:"
+ id="react-aria-«r2»"
+ tabindex="0"
type="button"
>
<p
class="flex-1 overflow-hidden text-ellipsis text-start"
- id="react-aria-:r7:"
+ id="react-aria-«r7»"
/>
<svg
aria-hidden="true"
class="w-4"
viewBox="0 -960 960 960"
❯ src/components/common/Select/Select.test.tsx:13:25
|
|
src/components/common/RangeSlider/RangeSlider.test.tsx > Component: RangeSlider > Snapshot > Default:
src/components/common/RangeSlider/RangeSlider.test.tsx#L13
Error: Snapshot `Component: RangeSlider > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,25 +1,25 @@
<DocumentFragment>
<div
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
class="h-auto w-full horizontal"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="group"
>
<div
class="flex items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
- id="react-aria-:r1:"
+ id="react-aria-«r1»"
>
Label
</label>
<output
aria-live="off"
- class="text-sm font-semibold text-gray-800"
+ class="font-semibold text-gray-800 text-sm"
- for="react-aria-:r1:-0 react-aria-:r1:-1"
+ for="react-aria-«r1»-0 react-aria-«r1»-1"
>
0 - 100
</output>
</div>
<div
@@ -38,14 +38,14 @@
style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
>
<input
aria-describedby=""
aria-details=""
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="horizontal"
aria-valuetext="0"
- id="react-aria-:r1:-0"
+ id="react-aria-«r1»-0"
max="100"
min="0"
step="1"
tabindex="0"
type="range"
@@ -61,14 +61,14 @@
style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
>
<input
aria-describedby=""
aria-details=""
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="horizontal"
aria-valuetext="100"
- id="react-aria-:r1:-1"
+ id="react-aria-«r1»-1"
max="100"
min="0"
step="1"
tabindex="0"
type="range"
❯ src/components/common/RangeSlider/RangeSlider.test.tsx:13:25
|
|
src/components/common/Popover/Popover.test.tsx > Component: Popover > Snapshot > Default:
src/components/common/Popover/Popover.test.tsx#L13
Error: Snapshot `Component: Popover > Snapshot > Default 1` mismatched
- Expected
+ Received
<DocumentFragment>
- <button>
+ <button
+ type="button"
+ >
Trigger
</button>
</DocumentFragment>
❯ src/components/common/Popover/Popover.test.tsx:13:25
|
|
src/components/common/NumberField/NumberField.test.tsx > Component: NumberField > Snapshot > Default:
src/components/common/NumberField/NumberField.test.tsx#L13
Error: Snapshot `Component: NumberField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,24 +1,25 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
/>
<div
class="w-1/2"
role="group"
>
<input
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
</div>
</div>
❯ src/components/common/NumberField/NumberField.test.tsx:13:25
|
|
src/components/common/NumberArrayField/NumberArrayField.test.tsx > Component: NumberArrayField > Snapshot > Default:
src/components/common/NumberArrayField/NumberArrayField.test.tsx#L13
Error: Snapshot `Component: NumberArrayField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,68 +1,70 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
>
Numbers
</label>
<div
class="flex w-1/2 flex-row gap-1"
>
<div
- class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 py-0.5 px-2"
+ class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 px-2 py-0.5"
>
<label
- class="text-sm font-semibold text-gray-500"
+ class="font-semibold text-gray-500 text-sm"
- for="react-aria-:r0:"
+ for="react-aria-«r0»"
- id="react-aria-:r2:"
+ id="react-aria-«r2»"
>
X
</label>
<div
class="w-full"
role="group"
>
<input
- aria-labelledby="react-aria-:r2:"
+ aria-labelledby="react-aria-«r2»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none py-0.5 px-1 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none px-1 py-0.5 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value="0"
/>
</div>
</div>
<div
- class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 py-0.5 px-2"
+ class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 px-2 py-0.5"
>
<label
- class="text-sm font-semibold text-gray-500"
+ class="font-semibold text-gray-500 text-sm"
- for="react-aria-:r8:"
+ for="react-aria-«r8»"
- id="react-aria-:ra:"
+ id="react-aria-«ra»"
>
Y
</label>
<div
class="w-full"
role="group"
>
<input
- aria-labelledby="react-aria-:ra:"
+ aria-labelledby="react-aria-«ra»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none py-0.5 px-1 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none px-1 py-0.5 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r8:"
+ id="react-aria-«r8»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value="0"
/>
</div>
</div>
❯ src/components/common/NumberArrayField/NumberArrayField.test.tsx:13:25
|
|
src/components/common/FilterInputField/FilterInputField.test.tsx > Component: FilterInputField > Snapshot > Default:
src/components/common/FilterInputField/FilterInputField.test.tsx#L13
Error: Snapshot `Component: FilterInputField > Snapshot > Default 1` mismatched
❯ src/components/common/FilterInputField/FilterInputField.test.tsx:13:25
|
|
src/components/common/ComboBox/ComboBox.test.tsx > Component: ComboBox > Snapshot > Default:
src/components/common/ComboBox/ComboBox.test.tsx#L13
Error: Snapshot `Component: ComboBox > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -5,30 +5,31 @@
<div
class="font-semibold text-gray-600"
/>
<div
aria-expanded="false"
- class="flex w-1/2 cursor-pointer flex-row rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
+ class="flex w-1/2 cursor-pointer flex-row rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
>
<input
aria-autocomplete="list"
aria-expanded="false"
autocomplete="off"
autocorrect="off"
class="w-full flex-1 border-none focus-visible:outline-0"
- id="react-aria-:r2:"
+ id="react-aria-«r3»"
role="combobox"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
<button
aria-expanded="false"
aria-haspopup="listbox"
aria-label="Show suggestions"
class="cursor-pointer"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
>
<svg
aria-hidden="true"
class="w-4"
viewBox="0 -960 960 960"
❯ src/components/common/ComboBox/ComboBox.test.tsx:13:25
|
|
src/components/common/ColorField/ColorField.test.tsx > Component: ColorField > Snapshot > Default:
src/components/common/ColorField/ColorField.test.tsx#L13
Error: Snapshot `Component: ColorField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,51 +1,54 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
/>
<div
- class="flex w-1/2 flex-row items-center gap-2 rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="flex w-1/2 flex-row items-center gap-2 rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
>
<div
class="h-4 w-4"
>
<button
class="cursor-pointer transition-colors hover:bg-gray-100 active:bg-gray-300 h-full w-full border border-gray-300 focus:outline-0"
+ tabindex="0"
type="button"
>
<div
aria-label="transparent"
aria-roledescription="color swatch"
class="h-full w-full"
- id="react-aria-:re:"
+ id="react-aria-«re»"
role="img"
style="background-color: rgba(255, 255, 255, 0);"
/>
</button>
</div>
<input
autocomplete="off"
autocorrect="off"
class="min-w-10 flex-2 border-none focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="textbox"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
<input
- aria-labelledby="react-aria-:r8:"
+ aria-labelledby="react-aria-«r8»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
class="min-w-8 flex-1 border-none focus-visible:outline-0"
- id="react-aria-:r6:"
+ id="react-aria-«r6»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
</div>
</div>
❯ src/components/common/ColorField/ColorField.test.tsx:13:25
|
|
src/components/common/Button/Button.test.tsx > Component: Button > Snapshot > Default:
src/components/common/Button/Button.test.tsx#L13
Error: Snapshot `Component: Button > Snapshot > Default 1` mismatched
- Expected
+ Received
<DocumentFragment>
<button
class="cursor-pointer transition-colors hover:bg-gray-100 active:bg-gray-300"
+ tabindex="0"
type="button"
>
Button
</button>
</DocumentFragment>
❯ src/components/common/Button/Button.test.tsx:13:25
|
|
src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx > Component: BoxRadioGroup > Snapshot > Default:
src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx#L13
Error: Snapshot `Component: BoxRadioGroup > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,55 +1,55 @@
<DocumentFragment>
<div
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="vertical"
class="flex items-center justify-between text-sm"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="radiogroup"
>
<span
class="font-semibold text-gray-600"
- id="react-aria-:r1:"
+ id="react-aria-«r1»"
>
Numbers
</span>
<div
class="flex w-1/2 flex-row items-center justify-end gap-1"
>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="1"
/>
One
</label>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="2"
/>
Two
</label>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="3"
/>
Three
❯ src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx:13:25
|