Skip to content

RRPS-8949 Add aria-label to loading spinner#56

Merged
JHamoni676 merged 3 commits intomasterfrom
jonahh-RRPS-8949-add-aria-label-to-loading-spinner
Oct 28, 2025
Merged

RRPS-8949 Add aria-label to loading spinner#56
JHamoni676 merged 3 commits intomasterfrom
jonahh-RRPS-8949-add-aria-label-to-loading-spinner

Conversation

@JHamoni676
Copy link
Copy Markdown
Contributor

Description

This PR adds aria-label to the loading spinner.

What type of PR is this? (check all applicable)

  • 🍕 Feature
  • 🐛 Bug Fix
  • 📝 Documentation
  • 🎨 Style
  • 🧑‍💻 Code Refactor
  • 🔥 Performance Improvements
  • ✅ Tests
  • 🤖 Build/CI
  • 📦 Chore (Version bump, release, etc.)
  • ⏩ Revert

Related Tickets & Documents

RRPS-8949

Changes Made

Added aria-label to loading spinner.

Quality Checklist

  • I have added or updated automated tests as needed.
  • I have reviewed the code changes myself.
  • I have used commit messages that adequately explain my changes.
  • I have removed any extra logging, debugging code, and commented out code.
  • I have updated any related documentation (if necessary).

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This text will be read by a screen reader while navigating the page. Does it make more sense to label it "Loading data, please wait" or something else? "Spinner" is a completely visual concept and won't make sense to a screen reader user.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I updated the default label text.

<div class="loading-container">
<div class="loading-text" *ngIf="loadingText">{{loadingText}}</div>
<mat-progress-spinner [color]="loaderColor" mode="indeterminate"></mat-progress-spinner>
<mat-progress-spinner aria-label="Loading Spinner" [color]="loaderColor" mode="indeterminate"></mat-progress-spinner>
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would there ever be a case where a consumer would want to customize the label message? For example to say "Loading x Page/data" etc?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It is now easily customizable

@JHamoni676 JHamoni676 merged commit f7b505e into master Oct 28, 2025
1 check passed
@JHamoni676 JHamoni676 deleted the jonahh-RRPS-8949-add-aria-label-to-loading-spinner branch October 28, 2025 13:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants