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

Context Menu not accessible for low vision users who rely on zooming functionality #3255

Open
randall-krauskopf opened this issue Jul 3, 2024 · 1 comment
Assignees
Labels
Accepted Issue has been reproduced by MathJax team

Comments

@randall-krauskopf
Copy link

Issue Summary

The context menu sub menu positioning does not meet the WCAG 1.4.10 Reflow specification which is preventing consumers of this project from meeting accessibility standards.

I've also opened up a similar issue in the context-menu repo.

Steps to Reproduce:

  1. Load any MathJax equation that triggers the context menu
  2. Using the chrome debugger tools, set the viewport to 320x256
  3. Select the Desktop interaction from the "Device Type" menu so you can still right click and not use the tap functionality that it tries to simulate in the chrome debugger.
  4. Right click to bring up the context menu
  5. Observe that sub menus overlap the parent menu and obscure information

Expected behavior is that in narrower viewports the sub menus open up underneath the parent menu without any overlap and the user can still see all of the menu options in both the parent menu and sub menu.

I've provided additional demos of the bug as well as expected behavior in the Supporting Information section

Technical details:

  • MathJax Version: 3.2
  • Client OS: Sonoma 14.5
  • Browser: Chrome 126.0.6478.127

I am using the following MathJax configuration:

MathJax = {
  options: {
      enableMenu: true,
      renderActions: {
        addMenu: [100000],
      },
      safeOptions: {
        allow: {
          URLs: 'none',
          classes: 'none',
          cssIDs: 'none',
          styles: 'safe',
        },
        lengthMax: 2,
        safeStyles: {},
        styleLengths: {},
      },
    },
  };

and loading MathJax via a webpack configuration from an npm module

Supporting information:

Demo Video

CleanShot.2024-07-03.at.09.13.11.mp4

Example of non-overlap

This sub-menu component stacks the new sub menus vertically, while the user now needs to scroll to view the new menus there is no loss of information.

Demo Video

345457739-311cf83c-2dcb-41cb-85ff-db0ce567a3ab.mp4

@dpvc dpvc added the Accepted Issue has been reproduced by MathJax team label Jul 5, 2024
@dpvc
Copy link
Member

dpvc commented Jul 5, 2024

Thanks for the report. We will look into updating the menu to be more compliant.

@dpvc dpvc self-assigned this Feb 28, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Accepted Issue has been reproduced by MathJax team
Projects
None yet
Development

No branches or pull requests

2 participants