Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

fix: add aria-hidden attribute to visually hidden input element #279

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
afc163 merged 2 commits into react-component:master from aojunhao123:a11y
Oct 27, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/index.tsx
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,7 @@ const InternalSegmentedOption: React.FC<{
>
<input
className={`${prefixCls}-item-input`}
aria-hidden="true"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

input 不是内部状态管理,而是专门用来做无障碍的。如果影响读屏器,应该是把其他的藏起来,而只保留 input 的读屏能力

type="radio"
disabled={disabled}
checked={checked}
Expand Down
40 changes: 40 additions & 0 deletions tests/__snapshots__/index.test.tsx.snap
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ exports[`rc-segmented render label with ReactNode 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -42,6 +43,7 @@ exports[`rc-segmented render label with ReactNode 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -61,6 +63,7 @@ exports[`rc-segmented render label with ReactNode 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -91,6 +94,7 @@ exports[`rc-segmented render segmented ok 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -108,6 +112,7 @@ exports[`rc-segmented render segmented ok 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -124,6 +129,7 @@ exports[`rc-segmented render segmented ok 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -153,6 +159,7 @@ exports[`rc-segmented render segmented with CSSMotion basic 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -170,6 +177,7 @@ exports[`rc-segmented render segmented with CSSMotion basic 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -186,6 +194,7 @@ exports[`rc-segmented render segmented with CSSMotion basic 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -215,6 +224,7 @@ exports[`rc-segmented render segmented with options 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -232,6 +242,7 @@ exports[`rc-segmented render segmented with options 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -248,6 +259,7 @@ exports[`rc-segmented render segmented with options 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -277,6 +289,7 @@ exports[`rc-segmented render segmented with options null/undefined 1`] = `
class="rc-segmented-item rc-segmented-item-selected rc-segmented-item-disabled"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
disabled=""
Expand All @@ -292,6 +305,7 @@ exports[`rc-segmented render segmented with options null/undefined 1`] = `
class="rc-segmented-item rc-segmented-item-disabled"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
disabled=""
type="radio"
Expand All @@ -306,6 +320,7 @@ exports[`rc-segmented render segmented with options null/undefined 1`] = `
class="rc-segmented-item rc-segmented-item-disabled"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
disabled=""
type="radio"
Expand Down Expand Up @@ -334,6 +349,7 @@ exports[`rc-segmented render segmented with options: 1 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -351,6 +367,7 @@ exports[`rc-segmented render segmented with options: 1 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -367,6 +384,7 @@ exports[`rc-segmented render segmented with options: 1 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -383,6 +401,7 @@ exports[`rc-segmented render segmented with options: 1 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -399,6 +418,7 @@ exports[`rc-segmented render segmented with options: 1 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -428,6 +448,7 @@ exports[`rc-segmented render segmented with options: 2 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -445,6 +466,7 @@ exports[`rc-segmented render segmented with options: 2 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -461,6 +483,7 @@ exports[`rc-segmented render segmented with options: 2 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -490,6 +513,7 @@ exports[`rc-segmented render segmented with options: disabled 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -507,6 +531,7 @@ exports[`rc-segmented render segmented with options: disabled 1`] = `
class="rc-segmented-item rc-segmented-item-disabled"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
disabled=""
type="radio"
Expand All @@ -524,6 +549,7 @@ exports[`rc-segmented render segmented with options: disabled 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -553,6 +579,7 @@ exports[`rc-segmented render segmented with title 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -570,6 +597,7 @@ exports[`rc-segmented render segmented with title 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -586,6 +614,7 @@ exports[`rc-segmented render segmented with title 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -603,6 +632,7 @@ exports[`rc-segmented render segmented with title 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -619,6 +649,7 @@ exports[`rc-segmented render segmented with title 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -648,6 +679,7 @@ exports[`rc-segmented render segmented: disabled 1`] = `
class="rc-segmented-item rc-segmented-item-selected rc-segmented-item-disabled"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
disabled=""
Expand All @@ -666,6 +698,7 @@ exports[`rc-segmented render segmented: disabled 1`] = `
class="rc-segmented-item rc-segmented-item-disabled"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
disabled=""
type="radio"
Expand All @@ -683,6 +716,7 @@ exports[`rc-segmented render segmented: disabled 1`] = `
class="rc-segmented-item rc-segmented-item-disabled"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
disabled=""
type="radio"
Expand Down Expand Up @@ -713,6 +747,7 @@ exports[`rc-segmented should render vertical segmented 1`] = `
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -730,6 +765,7 @@ exports[`rc-segmented should render vertical segmented 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -746,6 +782,7 @@ exports[`rc-segmented should render vertical segmented 1`] = `
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down Expand Up @@ -775,6 +812,7 @@ exports[`rc-segmented should render vertical segmented and handle thumb animatio
class="rc-segmented-item rc-segmented-item-selected"
>
<input
aria-hidden="true"
checked=""
class="rc-segmented-item-input"
type="radio"
Expand All @@ -792,6 +830,7 @@ exports[`rc-segmented should render vertical segmented and handle thumb animatio
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand All @@ -808,6 +847,7 @@ exports[`rc-segmented should render vertical segmented and handle thumb animatio
class="rc-segmented-item"
>
<input
aria-hidden="true"
class="rc-segmented-item-input"
type="radio"
/>
Expand Down
Loading

AltStyle によって変換されたページ (->オリジナル) /