Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ic-data-dable] Screen reader sorting indicator shows on screen when using RTL language #2905

Open
irl opened this issue Dec 16, 2024 · 3 comments

Comments

@irl
Copy link
Contributor

irl commented Dec 16, 2024

Summary of the bug

When using a RTL language, (dir="rtl" on the ), the text "table unsorted" appears way over to the right instead of being off screen. See the screenshot below for an image of a live example of this.

🪜 How to reproduce

  1. Set dir="rtl" on <html>
  2. Add an ic-data-table
  3. Observe the text "table unsorted" appear when you scroll far enough to the left

📸 Screenshots or code

Screen Shot 2024-12-16 at 12 58 38

🖥 📱 Device

  • Type: desktop
  • Device: mac os
  • Browser version: Firefox 133

🧐 Expected behaviour

The text should be hidden, except for screen readers

📝 Acceptance Criteria

If relevant, describe in full detail the different interactions and edge cases that the component or patterns needs to fulfil.

Given dir attribute is "rtl"
When an ic-data-table is used
Then the screen reader hint is not visible

Additional info

In testing, switching the CSS to use right: instead of left: fixed the issue.

The :dir selector could be used to fix this.

@irl
Copy link
Contributor Author

irl commented Dec 20, 2024

There are numerous occasions of this error in the set of web-components, so it would be best to wait for a decision in #2906 before implementing a fix for the canary components.

@GCHQ-Developer-299
Copy link
Contributor

Akin to #2906, pushed to future release as we don't official support RTL languages - however, if external contributor addresses issue beforehand, that's great

@GCHQ-Developer-530
Copy link
Contributor

Might be useful: #3264

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: In Refinement
Development

No branches or pull requests

4 participants