Fix “Appearance color options” table rendering and accessibility in P… #21
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…references The **"Appearance color options"** table in the *CSS Files → Editor → Appearance* preferences page was rendering with two columns instead of one, lacked a proper header for screen readers, and in some cases was not announced correctly by assistive technology. ### Changes Made - **Table recreation logic** - Dispose of any existing table and columns before creating a new instance. - Create a fresh `Table` with `SWT.FULL_SELECTION` and `TableColumnLayout` on the parent composite. - Use a single `TableViewerColumn` that displays both the color swatch (image) and label (text) in the same column. - **Header improvements** - Add a visible column header using `StructuredTextEditorPreferencePage_23`, stripping the mnemonic (`&`) and trailing colon. - Increase the column’s minimum width to prevent text truncation. - **Accessibility enhancements** - Add accessible name and help for the table so screen readers announce “Appearance color options.” - Provide row-level announcements in the format `Appearance color options: <label>`. - Set appropriate accessibility roles (`ACC.ROLE_TABLE` and `ACC.ROLE_TABLECELL`). ### Result This update ensures: - The table renders with **a single visible column** and header. - No phantom columns appear from previous initializations. - Screen readers can correctly identify and read out the table and its contents. - Improved accessibility compliance and usability for all users.
|
Hi @nitind , please let me know what you think. |
|
Thanks, Andrew! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The "Appearance color options" table in the CSS Files → Editor → Appearance preferences page was rendering with two columns instead of one, lacked a proper header for screen readers, and in some cases was not announced correctly by assistive technology.
Changes Made
TablewithSWT.FULL_SELECTIONandTableColumnLayouton the parent composite.TableViewerColumnthat displays both the color swatch (image) and label (text) in the same column.StructuredTextEditorPreferencePage_23, stripping the mnemonic (&) and trailing colon.Appearance color options: <label>.ACC.ROLE_TABLEandACC.ROLE_TABLECELL).Result
This update ensures:
Before:
After:
