fix: add aria-label to #startStopBtn for screen reader accessibility

[Copilot]

The Start/Abort button has no accessible name because its visible label comes solely from CSS :before content, which is not exposed to assistive technologies. Screen readers announce an unnamed button with no indication of its current action.

Changes

• HTML (all pages): Added aria-label="Start" to every <button id="startStopBtn"> so the button has an accessible name on initial render.
• JS startStop() + s.onend (all pages): Dynamically update aria-label in sync with the running class toggle:

// test starts
I("startStopBtn").className = "running";
I("startStopBtn").setAttribute("aria-label", "Abort");

// test ends or is aborted
I("startStopBtn").className = "";
I("startStopBtn").setAttribute("aria-label", "Start");

Files updated: index-classic.html and all 7 pages under examples/.

[qodo-free-for-open-source-projects]

Review Summary by Qodo

Add aria-label to start/stop button for screen reader accessibility

🐞 Bug fix

Walkthroughs

Description

• Add aria-label="Start" attribute to start/stop button HTML
• Dynamically update aria-label when test starts/ends
• Ensures screen readers announce button state correctly
• Improves accessibility across all example pages

Diagram

flowchart LR
  A["Button HTML"] -->|"Add aria-label=Start"| B["Initial State"]
  C["startStop() function"] -->|"Set aria-label=Abort"| D["Test Running"]
  E["s.onend callback"] -->|"Set aria-label=Start"| F["Test Ended"]
  D -->|"User aborts"| F

Loading

File Changes

1. index-classic.html Accessibility +4/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the <button id="startStopBtn"> element
• Updated startStop() function to set aria-label="Abort" when test starts
• Updated s.onend callback to set aria-label="Start" when test ends

index-classic.html

---

2. examples/example-multipleServers-full.html Accessibility +4/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-multipleServers-full.html

---

3. examples/example-multipleServers-pretty.html Accessibility +3/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-multipleServers-pretty.html

---

View more (5)

4. examples/example-singleServer-customSettings.html Accessibility +3/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-singleServer-customSettings.html

---

5. examples/example-singleServer-gauges.html Accessibility +4/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-singleServer-gauges.html

---

6. examples/example-singleServer-modern.html Accessibility +3/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-singleServer-modern.html

---

7. examples/example-singleServer-pretty.html Accessibility +3/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-singleServer-pretty.html

---

8. examples/example-singleServer-progressBar.html Accessibility +3/-1

Add dynamic aria-label to start/stop button

• Added aria-label="Start" to the button HTML element
• Set aria-label="Abort" in startStop() when test begins
• Set aria-label="Start" in s.onend callback when test completes

examples/example-singleServer-progressBar.html

---

[qodo-free-for-open-source-projects]

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 📎 Requirement gaps (0)

Great, no issues found!

Qodo reviewed your code and found no material issues that require review

ⓘ The new review experience is currently in Beta. Learn more