storybook Console error about server-side rendering on a Docs page

Describe the bug A clear and concise description of what the bug is.

When opening any Docs page in Storybook following console warning appear in a browser console:

The pseudo class ":first-child" is potentially unsafe when doing server-side rendering. Try changing it to ":first-of-type".

Similar bug was fixed in #18103 but the fix didn't fix this bug.

To Reproduce To reproduce run locally (production build is not affected):

npx sb repro --template react_typescript
cd react_typescript
yarn storybook

Open “Button” component and then “Docs” tab:

Screen Shot 2022-06-23 at 15 17 32

Alternatively clone this repository https://github.com/hudochenkov/storybook-console-error-18103 (difference from steps above: I used React 17 and npm). But error is the same in both cases.

System

Environment Info:

  System:
    OS: macOS 12.4
    CPU: (8) arm64 Apple M1
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.13.2 - /usr/local/bin/npm
  Browsers:
    Chrome: 102.0.5005.61
    Firefox: 102.0
    Safari: 15.5
  npmPackages:
    @storybook/addon-actions: ^6.5.9 => 6.5.9
    @storybook/addon-docs: ^6.5.9 => 6.5.9
    @storybook/addon-essentials: ^6.5.9 => 6.5.9
    @storybook/addon-interactions: ^6.5.9 => 6.5.9
    @storybook/addon-links: ^6.5.9 => 6.5.9
    @storybook/builder-webpack4: ^6.5.9 => 6.5.9
    @storybook/manager-webpack4: ^6.5.9 => 6.5.9
    @storybook/react: ^6.5.9 => 6.5.9
    @storybook/testing-library: ^0.0.13 => 0.0.13

Additional context Console.error was introduced in 6.5, and doesn't exist in 6.4.22.

Jul 07 '22 08:07 hudochenkov

I've finally fixed the underlaying issue in Emotion and thus this issue here should get fixed by this PR: https://github.com/storybookjs/storybook/pull/18992