-
Notifications
You must be signed in to change notification settings - Fork 9
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
Add a11y-use-next-tooltip rule #103
Conversation
🦋 Changeset detectedLatest commit: 1bfbc8a The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
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 |
src/rules/use-next-tooltip.js
Outdated
category: 'Best Practices', | ||
recommended: true, | ||
}, | ||
fixable: null, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I didn't add a fix option that updates the path from @primer/react
to @primer/react/next
because most of the time, Tooltip component itself will require updates as well. Let me know if you have a thought though!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I believe its still ok to fix. Any lessening of manual work is welcome right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think so! My only concern is that if we provide a fix to update the path, would it give an impression that "you are done and good to go"? Because after fixing the path, in many cases Tooltip will need an update too (i.e. aria-label
→ text
or adding type="description"
etc)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ok cool 👍 we can add it if someone requests it
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
in many cases Tooltip will need an update too (i.e. aria-label → text or adding type="description" etc)
Will the typescript compiler warn about those issues?
Bonus: Can aria-label → text also be fixed by the linter? 😇
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
(We chatted about these questions in our call with Sid, writing here for visibility)
Will the typescript compiler warn about those issues?
It does now :) With making the text prop required. primer/react#3925
Bonus: Can aria-label → text also be fixed by the linter? 😇
😇 I'm working on it to see if it is feasible to update the path as well as aria-label > text in one rule.
If anyone has any idea, thoughts, I'd love to hear 🙏🏻
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks like it worked
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I leave it upto you to decide if you want to make this lint rule generic or not.
One edge case I can think of is, if we have multiple components to lint for, will the variable system work correctly in that case?
ruleTester.run('use-next-tooltip', rule, { | ||
valid: [ | ||
`import {Tooltip} from '@primer/react/next'`, | ||
`import {UnderlineNav, Button} from '@primer/react'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not sure if we need this line of code too?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Probably not 😆 I was just adding examples to replicate real life cases but if it is confusing or you think it doesn't seem very related, I can totally remove it.
src/rules/use-next-tooltip.js
Outdated
category: 'Best Practices', | ||
recommended: true, | ||
}, | ||
fixable: null, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I believe its still ok to fix. Any lessening of manual work is welcome right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good!
I leave it upto you to decide if you want to make this lint rule generic or not.
Same same :)
3449de2
to
d651470
Compare
Closes #114
As a part of Tooltip adoption discussion, we decided to introduce an eslint rule that recommends switch over to the Tooltip v2 which will be released under the
primer/react/next
bundle based on the naming discussion.The rule also suggests fixes to update the import from
@primer/react
to@primer/react/next
as well as updating the prop name fromaria-label
totext