fix: Miscellaneous improvements for screenreader support.

[gonfunko]

The basics

• I validated my changes

The details

Resolves

• Fixes Screen reader - dropdown output bug #9420
• Fixes Screen reader - integrate field name into aria-label #9423
• Fixes Screen reader output for full block fields #9316 (again)
• Fixes Aria label for blocks includes non-visible inputs and doesn't update when visibility changes #9296
• Fixes Screen reader - begin [name] connection for functions (and other blocks) #9425

Proposed Changes

This PR is a grab bag of improvements to the screenreader experience. Specifically:

• Shadow blocks are now noted as "replaceable blocks" and input blocks are noted as such; this was previously reversed.
• Disabled and collapsed blocks are noted as such
• Hidden fields/inputs are excluded from the description of a block
• The count of child blocks is accurate for multi-statement-input blocks, e.g. if/else if/else.
• ARIA labels for blocks are computed lazily on focus, instead of multiple times upfront during the rendering process.
• Simple reporter blocks/full block fields have had their readout improved. Previously, they were described as buttons, regardless of the nature of the field. Now, the block returns its single child field's focusable element as its own focusable element. This means that, from the perspective of the focus manager/keyboard navigation, the block is the focused element (as has always been the case) but the HTML element with focus is that of the field, along with its ARIA role and attributes, so from the screenreader's perspective the field is focused and described as if it were a normal field.
• "Begin X" and "End X" labels for statement input connections/blocks now look back to the previous input line to generate a description of the clause that is beginning/ending, useful for blocks that do not include a label on the same row as the statement input itself
• Extraneous "group" readout on VoiceOver when navigating menu items has been removed
• Text input fields now use role="button", since they must be activated before they can be edited, which the old role="textbox" did not make clear.
• FieldDropdown.recomputeAria() has been made protected, which unblocks fixing FieldColour's readout.
• Fields now include their name in the ARIA label. By default this is pretty bad as this is not a human-readable value, but an ariaName may (and should) be included in the field's config to specify a useful name/context.

[microbit-robert]

• Simple reporter blocks/full block fields have had their readout improved. Previously, they were described as buttons, regardless of the nature of the field. Now, the block returns its single child field's focusable element as its own focusable element. This means that, from the perspective of the focus manager/keyboard navigation, the block is the focused element (as has always been the case) but the HTML element with focus is that of the field, along with its ARIA role and attributes, so from the screenreader's perspective the field is focused and described as if it were a normal field.

I presume this means that it is expected that custom fields need to add their own aria attributes as appropriate? If so, is there a default / fallback that can be used?

[gonfunko]

• Simple reporter blocks/full block fields have had their readout improved. Previously, they were described as buttons, regardless of the nature of the field. Now, the block returns its single child field's focusable element as its own focusable element. This means that, from the perspective of the focus manager/keyboard navigation, the block is the focused element (as has always been the case) but the HTML element with focus is that of the field, along with its ARIA role and attributes, so from the screenreader's perspective the field is focused and described as if it were a normal field.

I presume this means that it is expected that custom fields need to add their own aria attributes as appropriate? If so, is there a default / fallback that can be used?

Yes, custom fields should set attributes as appropriate, but assuming they inherit from e.g. FieldInput or another concrete Field subclass, they will have a reasonable default without doing anything custom.

[rachel-fenichel]

Changes look good, and I'm glad label calculation is now being done lazily.

Please put a comment on this PR describing what tests you think should be added to validate these changes. (Or link to an issue with that information.)

[gonfunko]

Things that would be nice to test, assuming we keep all this:

• Hidden inputs are excluded from block labels
• Hiding/unhiding an input updates the label
• Collapsed blocks are labelled as such
• Disabled blocks are labelled as such
• Toggling collapsed/disabled updates the label
• The count of child blocks for multiple-statement-input blocks is correct
• Input fields have role="button"
• Blocks return their field's focusable element for simple reporter full block field blocks
• getFieldRowLabel() returns an appropriate label for statement inputs both with and without preceding fields on the same row