Skip to content

A11y/tiptap button labels#2658

Merged
andrewleith merged 14 commits intomainfrom
a11y/tiptap-button-labels
Apr 15, 2026
Merged

A11y/tiptap button labels#2658
andrewleith merged 14 commits intomainfrom
a11y/tiptap-button-labels

Conversation

@amazingphilippe
Copy link
Copy Markdown
Contributor

@amazingphilippe amazingphilippe commented Apr 14, 2026

Summary | Résumé

This pull request refactors the rich text editor's toolbar and tooltips to enhance accessibility. It centralizes all editor UI labels and keyboard shortcuts (with platform-specific variants) into a new localization module, replaces ad-hoc label definitions with context-based translation, and updates the Cypress tests to accommodate these changes. Additionally, it improves tooltip accessibility and updates the test suite to check for both English and French UI labels.

Test instructions | Instructions pour tester la modification

  • Label toggles: Verify each toolbar button shows either "Apply {Label}" or "Remove {Label}"
  • aria-pressed: Confirm aria-pressed is falsetruefalse when applying/removing formatting for every button.
  • Live region announcements: After applying, live region contains "applied"; after removing, contains "removed".
  • Tooltips: Hover each toolbar button and assert the tooltip box appears and the tooltip label is not empty.
  • Toolbar keyboard focus: Press Alt+F10 to focus the toolbar; assert initial focus (H1) and that arrow keys move focus forwards/backwards and restore remembered position.
  • Shortcut toggles: For each keyboard shortcut (e.g., Mod+Alt+1 for Heading, Mod+b for Bold), verify the corresponding button toggles aria-pressed.
  • Link modal: Press Mod+K to open the link modal; verify it is visible and that Escape closes it.

Comment thread app/assets/javascripts/tiptap/TooltipWrapper.js Fixed
@github-actions
Copy link
Copy Markdown

Copy link
Copy Markdown
Member

@andrewleith andrewleith left a comment

Choose a reason for hiding this comment

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

A couple of comments below.

Comment thread app/assets/javascripts/tiptap/MenuBar.js Outdated
Comment thread app/assets/javascripts/tiptap/MenuBar.js Outdated
Comment thread app/assets/javascripts/tiptap/TooltipWrapper.js Fixed
Copy link
Copy Markdown
Member

@andrewleith andrewleith left a comment

Choose a reason for hiding this comment

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

LGTM!

andrewleith and others added 3 commits April 14, 2026 16:04
…ort, function or class'

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
@andrewleith andrewleith merged commit f14508f into main Apr 15, 2026
10 checks passed
@andrewleith andrewleith deleted the a11y/tiptap-button-labels branch April 15, 2026 14:41
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.

3 participants