Nested Active Controls

Link to Nested Active Controls copied to clipboard
caution

For the axeDevToolsXCUI framework, this rule is deprecated in favor of the Inaccessible Action rule.

WCAG 2.0 - 2.1.1 A Impact - Critical

An accessibility element should not have multiple active controls embedded within it. Each active control must be individually focused and interacted with.

Impact

People using VoiceOver are most impacted. VoiceOver can not activate more than one active control within another accessibility element.

Confirmation

  1. Turn on VoiceOver
  2. Attempt to focus the control
  3. Attempt to activate the control
  4. One of the following will happen:
    • Inaccessible: A different control is activated.
    • Inaccessible: The control is activated, but its focus box contains another control.
    • Inaccessible: Nothing happens.
    • Accessible: The control is activated and is the only control in its focus box.

How to Fix

UIKit

An issue found by this rule is caused by incorrectly marking a parent view as an accessibility element.

In storyboard:

  1. Navigate to the active control
  2. Select its parent view
  3. Confirm that the Inspectors Panel is visible
  4. Select the Identity Inspector
  5. Under "Accessibility", verify that "Enabled" is unselected

Repeat steps 3-5 with any view containing multiple active controls.

In code:

Ensure that any view containing multiple active controls are not accessibility elements:

view.isAccessibilityElement = false

SwiftUI

This type of accessibility issue is not expected to occur within SwiftUI views.