Label is not defined for ‘Margin’ input fields, ‘Border’ input fields and ‘Padding’ input fields

[azaslonov]

User Experience:

If label is not defined for form field than screen reader user will not be able to find out what kind of information is needed in the fields and will face difficulties while navigating on the page.

Note: User credentials should NOT be included in the bug.

Repro-Steps

1. Open Azure portal with valid credentials and create a API Management.

2. Click Developer Portal button to navigate to the portal.

3. Wait portal to load in design mode.

4. Navigate to the Left nav and select "Styles" button.

5. Navigate to style page and select Heading Level 1.

6. Navigate to the various controls of the "Heading Level 1" dialog box.

7. Navigate to Box toggle button and select it.

8. Open developer tool using F12 key and navigate to ‘Margin’ input fields, ‘Border’ input fields and ‘Padding’ input fields’.

9. Verify the issue.

Actual Result:

Label is not defined for ‘Margin’ input fields, ‘Border’ input fields and ‘Padding’ input fields present inside box section.

Expected result:

Label should be defined for all left, right, top, bottom ‘Margin’ input fields, ‘Border’ input fields and ‘Padding’ input fields present inside box section.

Note:

Similar issue exist with Chrome.

Similar issue exist throughout the application for same controls.

MAS Reference:

MAS 3.3.2 - Labels or Instructions (19)

Reference Links

Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier.
External Bug Process: If this bug belongs to external team, mark it as resolved/done and assign it back to the tester with notes on where to file/route the bug. For more information please use this Link. “HCL Staff should not log any third party external bugs. Should be routed to edad team”.
Please reach out to C&AI Teams channel for any process related queries