6998: fix for the pseudo class ":first-child" is potentially unsafe

[yasharzolmajdi]

changed ':first-child' to ':first-of-type' in tabs

Issue: #6998

What I did

changed the pseudo class for tabs from ':first-child' to ':first-of-type'

How to test

Check to see if any error is present in development console.

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

Latest deployment for this branch: https://monorepo-git-fork-yasharzolmajdi-6998-pseudo-class-fix.storybook.now.sh

[shilman]

Thanks so much for fixing this! Do you mind updating the snapshots?

yarn test --core --update

[yasharzolmajdi]

@shilman sure, they are updated now

[shilman]

LGTM!!! 🙇

[ndelangen]

the problem with first-of-type is that if you have

<div>
  <span/>
  <i/>
  <b/>
</div>

All 3 inner elements match first-of-type.

first-child only matches the first element.

It's totally different.

Though we can try to make a concerted effort to make them do the same by making sure all element in the container are of the same type:

<div>
  <span/>
  <span/>
  <span/>
</div>

this is actually incredibly hard to enforce when things like Fragments, and render-props come into play.

Since we're not using SSR and have no plans to do so, I'd rather be able to turn off this warning tbh.

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[stale]

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!