Issue Summary

An accessible name has not been provided for the Zoom slider.

Steps to Reproduce

1. Open "JSM System Dashboard" page.
2. Navigate to the "Projects" in the header section and choose any ITSM project from the options.
3. Navigate to the "Raise a request" link in the side navigation and activate it.
4. Navigate and activate the "Help center" link in the header section.
5. Navigate to the "Customize" button in the header section and activate it.
6. Navigate to the "Add logo" button and activate it using the screen reader.
7. Observe that "Upload logo" modal will appear.
8. Insert any image to it by activating "select image" button.
9. Navigate to the image zoom slider.
10. Inspect the code and observe that the label is not specified for the slider control.

Screenshot

Actual Results

The label is not specified for the “Zoom” slider control present in the “Upload logo” modal dialog.

As a result, screen reader users might not understand the purpose of the slider control.

Expected Results

The screen reader should announce a unique and descriptive label for the slider control.

Use a hidden label or "aria-label" attribute to convey the purpose of the slider control.

Code Example:

<input aria-label="zoom logo image" class="image-explorer-scale-slider" type="range" min="0" max="100" step="1" value="0" tabindex="1">

Workaround

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

Environment

MacBook Pro (16-inch, 2021)
macOs Sonoma 15.1.1
Chrome - Version 131.0.6778.109 (Official Build) (arm64)
Firefox- Version 92.0 (64-bit) 
Safari- Version 17.6 (19618.3.11.11.5)
JAWS- Version 2023
NVDA- Version 2021.2 
Voiceover - Version Latest