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

[SR] Linear - Add the interactive elements linear description to the whole graph container #2110

Open
wants to merge 45 commits into
base: main
Choose a base branch
from

Conversation

nishasy
Copy link
Contributor

@nishasy nishasy commented Jan 15, 2025

Summary:

Add the interactive Linear graph description to the full graph container.

This adds the "Interactive elements: Line..." description to the outermost graph container.

Issue: https://khanacademy.atlassian.net/browse/LEMS-1726

Test plan:

yarn jest packages/perseus/src/widgets/interactive-graphs/graphs/linear.test.tsx

Storybook

The [SRUX doc](https://khanacademy.atlassian.net/wiki/spaces/LC/pages/3460366348/Linear) still needs a label for the grab handle, but I tried my best in the meantime.

- Add a label and describedby for the grab handle.
- Add aria-live states for the different interactive elements
  so they don't override each other.

Issue: https://khanacademy.atlassian.net/browse/LEMS-1726

Test plan:
`yarn jest packages/perseus/src/widgets/interactive-graphs/graphs/linear.test.tsx`

Storybook
- http://localhost:6006/iframe.html?id=perseuseditor-widgets-interactive-graph--interactive-graph-linear&viewMode=story
- Try all the different slopes and intercepts
- Move different elements and confirm that the updated aria-label
  is what is read out, and none of the other elements override the
  currently focused one.
…whole graph container

Add the interactive Linear graph description to the full graph container.

This adds the "Interactive elements: Line..." description to the outermost graph container.

Issue: https://khanacademy.atlassian.net/browse/LEMS-1726

Test plan:
`yarn jest packages/perseus/src/widgets/interactive-graphs/graphs/linear.test.tsx`

Storybook
- Go to http://localhost:6006/iframe.html?globals=&args=&id=perseuseditor-widgets-interactive-graph--interactive-graph-linear&viewMode=story
- Confirm that there is the "interactive elements: ..." section in the SR tree
- Use screen reader to confirm it's read out loud
@nishasy nishasy self-assigned this Jan 15, 2025
Copy link
Contributor

github-actions bot commented Jan 15, 2025

npm Snapshot: Published

Good news!! We've packaged up the latest commit from this PR (8e9201d) and published it to npm. You
can install it using the tag PR2110.

Example:

yarn add @khanacademy/perseus@PR2110

If you are working in Khan Academy's webapp, you can run:

./dev/tools/bump_perseus_version.sh -t PR2110

Copy link
Contributor

github-actions bot commented Jan 15, 2025

Size Change: +109 B (+0.01%)

Total Size: 1.47 MB

Filename Size Change
packages/perseus/dist/es/index.js 412 kB +109 B (+0.03%)
ℹ️ View Unchanged
Filename Size
packages/kas/dist/es/index.js 39 kB
packages/keypad-context/dist/es/index.js 760 B
packages/kmath/dist/es/index.js 83.1 kB
packages/math-input/dist/es/index.js 78 kB
packages/math-input/dist/es/strings.js 1.79 kB
packages/perseus-core/dist/es/index.js 23.1 kB
packages/perseus-editor/dist/es/index.js 689 kB
packages/perseus-linter/dist/es/index.js 22.2 kB
packages/perseus-score/dist/es/index.js 103 kB
packages/perseus/dist/es/strings.js 5.04 kB
packages/pure-markdown/dist/es/index.js 3.66 kB
packages/simple-markdown/dist/es/index.js 12.5 kB

compressed-size-action

@nishasy nishasy marked this pull request as ready for review January 15, 2025 06:54
Base automatically changed from sr-ray to main January 16, 2025 00:04
@nishasy
Copy link
Contributor Author

nishasy commented Jan 16, 2025

The parent pull-request (#2036) has been merged into main, but this branch (sr-linear-interactive-elements) now has conflicts with the new base branch. These conflicts must be resolved before checks can complete on this pull-request.

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.

1 participant