Skip to content

Commit bfd047f

Browse files
Update CheckboxInput test to improve accessibility and event handling
- Renamed handleClick to handleChange for clarity in CheckboxInput test. - Added keyboard event handling for Enter and Space keys to trigger checkbox state change. - Set role and tabIndex for better accessibility compliance.
1 parent c83f253 commit bfd047f

File tree

1 file changed

+10
-2
lines changed

1 file changed

+10
-2
lines changed

frontend/src/common/components/Input/__tests__/CheckboxInput.test.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ vi.mock('@ionic/react', async () => {
2828
className?: string;
2929
name?: string;
3030
}) => {
31-
const handleClick = () => {
31+
const handleChange = () => {
3232
const newChecked = typeof checked === 'string' ? checked === 'false' : !checked;
3333
const detailObj = {
3434
checked: newChecked,
@@ -42,7 +42,15 @@ vi.mock('@ionic/react', async () => {
4242

4343
return (
4444
<div
45-
onClick={handleClick}
45+
onClick={handleChange}
46+
onKeyDown={(e) => {
47+
if (e.key === 'Enter' || e.key === ' ') {
48+
e.preventDefault();
49+
handleChange();
50+
}
51+
}}
52+
role="checkbox"
53+
tabIndex={0}
4654
className={`ion-checkbox ${className || ''}`}
4755
data-testid={testId}
4856
aria-checked={ariaChecked as 'false' | 'true'}

0 commit comments

Comments
 (0)