feat(Popover): add tabindex and aria-disabled for a11y (#9889)

This commit is contained in:
neverland 2021-11-17 16:57:47 +08:00 committed by GitHub
parent 5f7e65b637
commit 8214bf8d02
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 11 additions and 7 deletions

View File

@ -173,6 +173,8 @@ export default defineComponent({
role="menuitem"
class={[bem('action', { disabled, 'with-icon': icon }), className]}
style={{ color }}
tabindex={disabled ? undefined : 0}
aria-disabled={disabled || undefined}
onClick={() => onClickAction(action, index)}
>
{icon && (

View File

@ -3,6 +3,7 @@
exports[`should allow to custom the className of action 1`] = `
<div role="menuitem"
class="van-popover__action foo"
tabindex="0"
>
<div class="van-popover__action-text van-hairline--bottom">
Option
@ -22,6 +23,7 @@ exports[`should change icon class prefix when using icon-prefix prop 1`] = `
>
<div role="menuitem"
class="van-popover__action van-popover__action--with-icon"
tabindex="0"
>
<i class="van-badge__wrapper my-icon my-icon-success van-popover__action-icon">
</i>

View File

@ -196,7 +196,7 @@ export default defineComponent({
style={style}
class={bem('item')}
tabindex={disabled ? undefined : 0}
aria-setsize={+count}
aria-setsize={count}
aria-posinset={score}
aria-checked={!isVoid}
onClick={onClickItem}

View File

@ -295,9 +295,9 @@ export default defineComponent({
role="slider"
class={getButtonClassName(index)}
tabindex={props.disabled ? undefined : 0}
aria-valuemin={+props.min}
aria-valuemin={props.min}
aria-valuenow={current}
aria-valuemax={+props.max}
aria-valuemax={props.max}
aria-disabled={props.disabled || undefined}
aria-readonly={props.readonly || undefined}
aria-orientation={props.vertical ? 'vertical' : 'horizontal'}

View File

@ -313,9 +313,9 @@ export default defineComponent({
// set keyboard in modern browsers
inputmode={props.integer ? 'numeric' : 'decimal'}
placeholder={props.placeholder}
aria-valuemax={+props.max}
aria-valuemin={+props.min}
aria-valuenow={+current.value}
aria-valuemax={props.max}
aria-valuemin={props.min}
aria-valuenow={current.value}
onBlur={onBlur}
onInput={onInput}
onFocus={onFocus}

View File

@ -206,7 +206,7 @@ exports[`should render demo and match snapshot 1`] = `
inputmode="decimal"
aria-valuemax="Infinity"
aria-valuemin="1"
aria-valuenow="1"
aria-valuenow="1.0"
>
<button type="button"
class="van-stepper__plus van-haptics-feedback"