Skip to content

Enhance components Checkbox #1024

Enhance components Checkbox

Enhance components Checkbox #1024

Triggered via pull request October 19, 2025 12:21
@hyu-devhyu-dev
synchronize #429
hyu-dev:main
Status Failure
Total duration 4m 34s
Artifacts

publish.yml

on: pull_request
Fit to window
Zoom out
Zoom in

Annotations

10 errors
publish
Process completed with exit code 1.
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render disabled checkbox with custom colors: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L286
Error: Snapshot `Checkbox > should render disabled checkbox with custom colors 1` mismatched - Expected + Received @@ -2,23 +2,23 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-not-allowed--255" - for="_r_k_" + for="«rk»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 cursor-0-not-allowed--1 " disabled="" - id="_r_k_" + id="«rk»" style="--primary: #ff0000; --border: #00ff00; --inputBg: #ffff00;" type="checkbox" /> </label> <label class="cursor-0-not-allowed--255" - for="_r_k_" + for="«rk»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-light-dark(#D6D7DE,#6F6E6E)--255" style="--text: #0000ff;" > ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:286:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render checked checkbox with custom colors: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L268
Error: Snapshot `Checkbox > should render checked checkbox with custom colors 1` mismatched - Expected + Received @@ -2,16 +2,16 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_j_" + for="«rj»" > <input checked="" class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_j_" + id="«rj»" style="--primary: #ff0000; --border: #00ff00; --inputBg: #ffff00;" type="checkbox" /> <svg class="opacity-0-1--255 pointer-events-0-none--255 z-index-0-1--255" @@ -29,11 +29,11 @@ /> </svg> </label> <label class="cursor-0-pointer--255" - for="_r_j_" + for="«rj»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-var(--text,light-dark(#2F2F2F,#EDEDED))--255" style="--text: #0000ff;" > ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:268:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render with partial custom colors: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L250
Error: Snapshot `Checkbox > should render with partial custom colors 1` mismatched - Expected + Received @@ -2,22 +2,22 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_i_" + for="«ri»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_i_" + id="«ri»" style="--primary: #ff0000;" type="checkbox" /> </label> <label class="cursor-0-pointer--255" - for="_r_i_" + for="«ri»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-var(--text,light-dark(#2F2F2F,#EDEDED))--255" style="--text: #0000ff;" > ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:250:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render with custom colors: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L237
Error: Snapshot `Checkbox > should render with custom colors 1` mismatched - Expected + Received @@ -2,22 +2,22 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_h_" + for="«rh»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_h_" + id="«rh»" style="--primary: #ff0000; --border: #00ff00; --inputBg: #ffff00;" type="checkbox" /> </label> <label class="cursor-0-pointer--255" - for="_r_h_" + for="«rh»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-var(--text,light-dark(#2F2F2F,#EDEDED))--255" style="--text: #0000ff;" > ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:237:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render checkbox with custom child: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L41
Error: Snapshot `Checkbox > should render checkbox with custom child 1` mismatched - Expected + Received @@ -2,21 +2,21 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_4_" + for="«r4»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_4_" + id="«r4»" type="checkbox" /> </label> <label class="cursor-0-pointer--255" - for="_r_4_" + for="«r4»" > <div> Custom Child </div> </label> ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:41:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render disabled and checked checkbox: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L30
Error: Snapshot `Checkbox > should render disabled and checked checkbox 1` mismatched - Expected + Received @@ -2,17 +2,17 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-not-allowed--255" - for="_r_3_" + for="«r3»" > <input checked="" class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 cursor-0-not-allowed--1 " disabled="" - id="_r_3_" + id="«r3»" type="checkbox" /> <svg class="opacity-0-1--255 pointer-events-0-none--255 z-index-0-1--255" height="10" @@ -28,11 +28,11 @@ /> </svg> </label> <label class="cursor-0-not-allowed--255" - for="_r_3_" + for="«r3»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-light-dark(#D6D7DE,#6F6E6E)--255" > Test Checkbox ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:30:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render disabled checkbox: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L20
Error: Snapshot `Checkbox > should render disabled checkbox 1` mismatched - Expected + Received @@ -2,22 +2,22 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-not-allowed--255" - for="_r_2_" + for="«r2»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 cursor-0-not-allowed--1 " disabled="" - id="_r_2_" + id="«r2»" type="checkbox" /> </label> <label class="cursor-0-not-allowed--255" - for="_r_2_" + for="«r2»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-light-dark(#D6D7DE,#6F6E6E)--255" > Test Checkbox ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:20:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render checked checkbox: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L14
Error: Snapshot `Checkbox > should render checked checkbox 1` mismatched - Expected + Received @@ -2,16 +2,16 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_1_" + for="«r1»" > <input checked="" class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_1_" + id="«r1»" type="checkbox" /> <svg class="opacity-0-1--255 pointer-events-0-none--255 z-index-0-1--255" height="10" @@ -27,11 +27,11 @@ /> </svg> </label> <label class="cursor-0-pointer--255" - for="_r_1_" + for="«r1»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-var(--text,light-dark(#2F2F2F,#EDEDED))--255" > Test Checkbox ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:14:23
packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx > Checkbox > should render basic checkbox: packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx#L9
Error: Snapshot `Checkbox > should render basic checkbox 1` mismatched - Expected + Received @@ -2,21 +2,21 @@ <div class="display-0-flex--0 align-items-0-center--255 gap-0-8px--255" > <label class="position-0-relative--255 display-0-flex--255 align-items-0-center--255 justify-content-0-center--255 width-0-16px--255 height-0-16px--255 cursor-0-pointer--255" - for="_r_0_" + for="«r0»" > <input class="background-0-var(--primary,light-dark(#6159D4,#6670F9))-6529705465913413318-1 border-0-none-6529705465913413318-1 background-0-light-dark(#F0F0F3,#47474A)-9407739846625397859-1 background-0-light-dark(#F0F0F3,#47474A)-14172363753176421546-1 accent-color-0-var(--primary,light-dark(#6159D4,#6670F9))--1 appearance-0-none--1 background-0-var(--inputBg,light-dark(#FFF,#2E2E2E))--1 border-0-1px solid var(--border,light-dark(#E0E0E0,#333))--1 border-radius-0-2px--1 display-0-block--1 height-0-100%--1 left-0-0--1 margin-0-0--1 opacity-0-1--1 pointer-events-0-none--1 position-0-absolute--1 top-0-0--1 width-0-100%--1 z-index-0-0--1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 20%,#FFF 80%),color-mix(in srgb,var(--primary,#6670F9) 30%,#000 70%))-15425828959012638752-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 100%,#000 15%),color-mix(in srgb,var(--primary,#6670F9) 100%,#FFF 15%))-15130211206989154723-1 background-0-light-dark(color-mix(in srgb,var(--primary,#6159D4) 10%,#FFF 90%),color-mix(in srgb,var(--primary,#6670F9) 20%,#000 80%))-8380715471663921674-1 border-0-1px solid var(--primary,light-dark(#6159D4,#6670F9))-8380715471663921674-1 cursor-0-pointer--1 " - id="_r_0_" + id="«r0»" type="checkbox" /> </label> <label class="cursor-0-pointer--255" - for="_r_0_" + for="«r0»" > <span class="font-size-0-14px--255 user-select-0-none--255 color-0-var(--text,light-dark(#2F2F2F,#EDEDED))--255" > Test Checkbox ❯ packages/components/src/components/Checkbox/__tests__/index.browser.test.tsx:9:23