Nested Active Controls

Link to Nested Active Controls copied to clipboard

WCAG 2.0 - 2.1.1 A Impact - Critical

note

Requires the accessibility layer for accurate results. Learn how to load the accessibility layer here.

An accessibility element should not have multiple active controls embedded within it.

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 can no longer occur within SwiftUI views.