Conversation
…d navigation to avoid using role=tab as an example. Instead, using role=button with aria-expanded=false, so that we can show that the role and aria attributes can be set.
🦋 Changeset detectedLatest commit: 4bafee2 The changes in this PR will be included in the next version bump. This PR includes changesets to release 0 packagesWhen changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Size Change: 0 B Total Size: 122 kB ℹ️ View Unchanged
|
npm Snapshot: NOT Published🤕 Oh noes!! We couldn't find any changesets in this PR (c8041f7). As a result, we did not publish an npm snapshot for you. |
A new build was pushed to Chromatic! 🚀https://5e1bf4b385e3fb0020b7073c-fcnrjkfahp.chromatic.com/ Chromatic results:
|
| aria-labelledby="tab-1" | ||
| style={styles.panel} | ||
| <Clickable | ||
| role="button" |
There was a problem hiding this comment.
Updated the example to use a different role and aria attribute. Based on the docs, I think the intent of this example was to show that Clickable can be interacted with and have aria attributes set! (?path=/docs/packages-clickable-clickable-accessibility--docs)
9fa68e6 to
abf88c3
Compare
| "@khanacademy/eslint-config": "^5.2.0", | ||
| "@khanacademy/eslint-plugin": "^3.1.1", | ||
| "@khanacademy/eslint-plugin-wonder-blocks": "workspace:*", | ||
| "@khanacademy/eslint-plugin-wonder-blocks": "^0.2.0", |
There was a problem hiding this comment.
Note: We use the released version of the package for linting the project, rather than the workspace version! This fixes this error in CI:
> [email protected] lint:ci /home/github/work/wonder-blocks/wonder-blocks
> eslint --ext .ts --ext .js --ext .tsx --ext .jsx "."
Oops! Something went wrong! :(
ESLint: 8.57.1
ESLint couldn't find the plugin "@khanacademy/eslint-plugin-wonder-blocks".
(The package "@khanacademy/eslint-plugin-wonder-blocks" was not found when loaded as a Node module from the directory "/home/github/work/wonder-blocks/wonder-blocks".)
It's likely that the plugin isn't installed correctly. Try reinstalling by running the following:
npm install @khanacademy/eslint-plugin-wonder-blocks@latest --save-dev
The plugin "@khanacademy/eslint-plugin-wonder-blocks" was referenced from the config file in ".eslintrc.js".
If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.
ELIFECYCLE Command failed with exit code 2.https://github.com/Khan/wonder-blocks/actions/runs/24484355505/job/71555787574?pr=3012
This would mean we need to release changes to the eslint plugin first before updating the WB repo to use any new rules!
There was a problem hiding this comment.
Interesting! Why does this work differently than other packages where we import from the workspace? Something to do with the tooling lifecycle? It does seem a little cumbersome to maintain.
There was a problem hiding this comment.
It's strange because using workspace:* works locally! I will dig into this more and follow up with my findings! I'll land the PR for now so I can get a blog post prepped for the frontend guild meeting later :)
One benefit of having to release the plugin package first before using it in WB packages is that we don't need to address any existing errors as part of lint rule creation work so it'll be easier to break up the work into smaller PRs!
There was a problem hiding this comment.
I figured it out! We needed to build the packages before running the lint check so it would use the built version of the plugin :) Updated here: #3014
GeraldRequired Reviewers
Don't want to be involved in this pull request? Comment |
marcysutton
left a comment
There was a problem hiding this comment.
Thanks for setting this up @beaesguerra! I left one question, but it's non-blocking.
| "@khanacademy/eslint-config": "^5.2.0", | ||
| "@khanacademy/eslint-plugin": "^3.1.1", | ||
| "@khanacademy/eslint-plugin-wonder-blocks": "workspace:*", | ||
| "@khanacademy/eslint-plugin-wonder-blocks": "^0.2.0", |
There was a problem hiding this comment.
Interesting! Why does this work differently than other packages where we import from the workspace? Something to do with the tooling lifecycle? It does seem a little cumbersome to maintain.
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #3012 +/- ##
============================
============================
Continue to review full report in Codecov by Sentry.
🚀 New features to boost your workflow:
|
Summary:
Enabling the
strictconfig from@khanacademy/eslint-plugin-wonder-blocksin the Wonder Blocks repo!The
strictconfig currently includes theno-custom-tab-rolefor now, so we address the lint errors that were detected after enabling the config.Issue: WB-2308
Test plan:
Confirm lint checks pass
Confirm the wb lint rules can be detected when errors aren't addressed
When running

pnpm lint:In an IDE:
