Issue Summary

For the Subscribe to the calendar modal in the Calendar section, the form labels are not associated with each other explicitly.

Screenshot

Steps to Reproduce

1. Navigate to the main content area where the calendar for the space is present.
2. Activate the "Subscribe button"
3. After activating the Subscribe button a modal will appear "Subscribe to calendar".
4. Keeping the Screen reader on navigating into the modal.

Actual Results

The Subscribe to calendar modal has custom dropdown fields for the Calendar and Calendar app which does not have a label explicitly associated with it. The 'for' and 'id' association is missing between the label and the form control.

Labels are specified for form controls to help users understand what information needs to be inputted. However, labels need to be explicitly associated with their respective form controls for assistive technologies to identify the label accurately and convey the information to the users.

Expected Results

Use the “for” attribute of the label element and the “id” attribute of the form control to explicitly associate labels with their respective form controls. 

This makes the clicking area wider for users without affecting the presentation of the page. This association needs to be done programmatically through the code to ensure that assistive technologies can identify the association.   

Workaround

Currently, there is no known workaround for this behaviour. A workaround will be added here when available.