Snapshot testing with styled-components. Possible to render Stories to pure Javascript objects?

[daniel-heppner-ibigroup]

Summary

I've recently upgraded our old Storybook library from Storybook 6 to 7. As part of this upgrade, we had to retire the storyshots package since it's no longer supported. Storybook-test-runner, combined with Jest, is now used to take snapshots on a hosted Storybook using a headless browser.

This has the advantage of being true to the browser DOM, but it breaks compatibility with styled-components, since the class names generated by styled-components frequently changes and breaks the snapshots.

I'd like to go back to the old method of taking a snapshot of a pure Javascript object, combined with jest-styled-components to capture the CSS as well. I'm prepared to set this up using react-test-renderer, but I don't know how to get the component objects from Storybook in an automated fashion to feed into the renderer.

One backup solution I suppose would be to just rewrite the classnames using a regex, but then I lose any protection of the snapshots capturing the CSS.

Additional information

Using Storybook 7
Styled-components 5.1.9

Create a reproduction

No response