[Bug]: createPortal in decorator breaks react-element-to-jsx-string

[agriffis]

Describe the bug

If I attempt to use createPortal in a decorator, the story breaks like this:

Here is the decorator:

import {createPortal} from 'react-dom'

const myDecorator = Story => {
  return (
    <>
      {createPortal(<p>Hello</p>, document.body)}
      <Story />
    </>
  )
}

export default myDecorator

To Reproduce

Repo at https://github.com/agriffis/storybook-createportal

This was created with three steps:

1. pnpm create vite storybook-createportal
2. pnpx storybook@next init
3. Add the decorator, see https://github.com/agriffis/storybook-createportal/commit/afd5f95b9fc932f993e73649332db629a259fe96

To repro locally

git clone https://github.com/agriffis/storybook-createportal.git
cd storybook-createportal
pnpm i
pnpm storybook

System

System:
    OS: Linux 6.1 Fedora Linux 36 (Server Edition)
    CPU: (12) x64 Intel Core Processor (Skylake, IBRS)
  Binaries:
    Node: 16.18.1 - /usr/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.2.0 - /usr/local/bin/npm
  Browsers:
    Firefox: 111.0.1
  npmPackages:
    @storybook/addon-essentials: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/addon-interactions: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/addon-links: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/blocks: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/react: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/react-vite: ^7.0.0-rc.8 => 7.0.0-rc.8 
    @storybook/testing-library: ^0.0.14-next.1 => 0.0.14-next.1

Additional context

No response

[shilman]

21722 is a workaround for this

[quantizor]

I forked it and patched it if you want to throw a yarn resolutions entry into your project: https://www.npmjs.com/package/@styled/react-element-to-jsx-string

”react-element-to-jsx-string”: “npm:@styled/react-element-to-jsx-string“