fix(Checkbox): set aria-required to required prop value (#1596)

unovue · Jan 31, 2025 · 14da5f1 · 14da5f1
1 parent 586c25a
commit 14da5f1
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/packages/radix-vue/src/Checkbox/Checkbox.test.ts b/packages/radix-vue/src/Checkbox/Checkbox.test.ts
@@ -80,6 +80,18 @@ describe('given a disabled Checkbox', () => {
   })
 })
 
+describe('given a required Checkbox', () => {
+  const wrapper = mount({
+    components: { Checkbox },
+    template: '<form><Checkbox required /></form>',
+  })
+
+  it('should have [aria-required] of "true"', () => {
+    expect(wrapper.find('button').attributes('aria-required')).toEqual('true')
+    expect(wrapper.find('[type="checkbox"]').attributes('required')).toBeDefined()
+  })
+})
+
 describe('given checked value as "indeterminate"', async () => {
   const wrapper = mount(Checkbox, { props: { checked: 'indeterminate' } })
 

diff --git a/packages/radix-vue/src/Checkbox/CheckboxRoot.vue b/packages/radix-vue/src/Checkbox/CheckboxRoot.vue
@@ -91,7 +91,7 @@ provideCheckboxRootContext({
     :as="as"
     :type="as === 'button' ? 'button' : undefined"
     :aria-checked="isIndeterminate(checked) ? 'mixed' : checked"
-    :aria-required="false"
+    :aria-required="props.required"
     :aria-label="$attrs['aria-label'] || ariaLabel"
     :data-state="getState(checked)"
     :data-disabled="disabled ? '' : undefined"