▲
Basically what Link currently does is detect if the direct child is an . If it is it'll React.cloneElement and add on the href as a property. Now if we add a warning for not It's hard to detect, because e.g. styled-components would wrap the with styles, and there's a bunch of other cases like that.
So the way we thought about fixing this is through not requiring nexting the and making always add in the . However, that'd be a super heavy breaking change which would affect everything - user layout, styling, accessibility.
The reason that they don’t have that specific check is that someone could take the a tag and do styled components, and that changes the markup from just an a tag, to being a component. If that you then detect that thing to do a warning, it will then not work.
However we’ve talked about the new use-link thing doesn’t return a link component it returns an a tag, so that would always be a link using an a tag however we can’t do use-link so I’m not sure if we can conserve that property going forward
======================
Considerations when writing technical documentation:
- Best practices and when the condition holds
- What conditions do you have to put on what you’re saying
- The condition is If anything else but a is within the Link tag then you need to abide by the best practices, otherwise the assistive technology and keyboard shortcuts might not work
If ( (Link wraps any supporting onClick) && (wrapped component not a) ) then Put ARIA attributes Put appropriate styling Put appropriate keyboard handlers // the component meets accessible guidelines )
Best practice:
- Use a for all links
- When you can’t use a, use role=“link” property
If neither holds, recommendation is to throw a warning
============================
Related issue:
https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/402
Adding different parameters to