Skip to content

date: 2026-06-12 tags: [vue, reka-ui, frontend, dead-binding] status: graduated graduated_to: .claude/rules/frontend.md

reka-ui Switch has no checked prop — v-model:checked is a silently dead binding

Symptom — toggles (Automations enable, Notifications slots, Google-Tasks import options) rendered their default off-state regardless of the stored value and never wrote back on click — with no console warning.

Root cause — the kit Switch wraps reka-ui's SwitchRoot, which exposes modelValue / update:modelValue only. v-model:checked (and :checked + @update:checked) binds a prop reka-ui never declares, so it's inert. Recurred across #274, #354, #426.

Fix — bind v-model (modelValue). Fixed instances in Automations.vue (PR #448), and GoogleTasksImport.vue + settings/Notifications.vue (PR #452).

Guard — graduated into .claude/rules/frontend.md (Component emits & props): bind kit toggles with v-model, and assert the rendered data-state against a non-default initial value in a browser test (tests/Browser/SwitchBindingTest.php).