Support Storybook 7.0

[IanVS]

Issue: #118, #119, #111

closes #116

What Changed

This attempts to create a version of @storybook/testing-react that is compatible with the latest 7.0 alpha versions. So far, though, I'm a bit hung up on the types. Maybe @kasperpeulen can help me out. The current issue I've hit is that ReactFramework is no longer exported from @storybook/react, and I don't see it being exported anywhere else, either.

Checklist

Check the ones applicable to your change:

• Tests are updated
• Documentation is updated

Change Type

Indicate the type of change your pull request is:

• documentation
• patch
• minor
• major

Release Notes

💥 Breaking Change

This version adds support for Storybook 7.0. It requires you to be using Storybook 7.0, as there were several internal changes required, all of which depend on new Storybook packages.

🚀 Features

In Storybook 7.0, the play function can also be defined in the Meta (default export). This is now supported in @storybook/testing-react.

⚠️ Deprecations

The setGlobalConfig function is now deprecated in favor of setProjectAnnotations, which aligns better with Storybook 7.0 nomenclature.

From:

  import { setGlobalConfig } from '@storybook/testing-react';
  import * as globalStorybookConfig from './.storybook/preview';

  setGlobalConfig(globalStorybookConfig);

To:

  import { setProjectAnnotations } from '@storybook/testing-react';
  import * as globalStorybookConfig from './.storybook/preview';

  setProjectAnnotations(globalStorybookConfig);

---

📦 Published PR as canary version: 2.0.0--canary.120.dce8fc8.0

✨ Test out this PR locally via:

npm install @storybook/testing-react@2.0.0--canary.120.dce8fc8.0
# or 
yarn add @storybook/testing-react@2.0.0--canary.120.dce8fc8.0

Version

Published prerelease version: v2.0.0-next.0

Changelog

Release Notes

Support Storybook 7.0 (#120)

💥 Breaking Change

This version adds support for Storybook 7.0. It requires you to be using Storybook 7.0, as there were several internal changes required, all of which depend on new Storybook packages.

🚀 Features

In Storybook 7.0, the play function can also be defined in the Meta (default export). This is now supported in @storybook/testing-react.

⚠️ Deprecations

The setGlobalConfig function is now deprecated in favor of setProjectAnnotations, which aligns better with Storybook 7.0 nomenclature.

From:

  import { setGlobalConfig } from '@storybook/testing-react';
  import * as globalStorybookConfig from './.storybook/preview';

  setGlobalConfig(globalStorybookConfig);

To:

  import { setProjectAnnotations } from '@storybook/testing-react';
  import * as globalStorybookConfig from './.storybook/preview';

  setProjectAnnotations(globalStorybookConfig);

---

---

💥 Breaking Change

• Support Storybook 7.0 #120 (@IanVS @yannbf @kasperpeulen)

Authors: 3

• Ian VanSchooten (@IanVS)
• Kasper Peulen (@kasperpeulen)
• Yann Braga (@yannbf)

[socket-security]

Socket Security Pull Request Report

Dependency issues detected. If you merge this pull request, you will not be alerted to the instances of these issues again.

📜 Install scripts

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Packages should not be running non-essential scripts during install and there are often solutions to problems people solve with install scripts that can be run at publish time instead.

Package	Script field	Source
esbuild@0.14.54 (added)	postinstall	package.json via @storybook/react@7.0.0-alpha.62, @storybook/docs-tools@7.0.0-alpha.62, @storybook/core-common@7.0.0-alpha.62,example/package.json

😵‍💫 Bin script confusion

This package has multiple bin scripts with the same name. This can cause non-deterministic behavior when installing or could be a sign of a supply chain attack

Consider removing one of the conflicting packages. Packages should only export bin scripts with their name

Package	Bin script	Source
@storybook/cli@7.0.0-alpha.62 (added)	sb	example/package.json via storybook@7.0.0-alpha.62
storybook@7.0.0-alpha.62 (added)	sb	example/package.json
detect-port@1.5.1 (upgraded)	detect-port	example/package.json via @storybook/react@6.5.13, @storybook/core@6.5.13, @storybook/core-server@6.5.13
detect-port@1.5.1 (upgraded)	detect	example/package.json via @storybook/react@6.5.13, @storybook/core@6.5.13, @storybook/core-server@6.5.13

Pull request report summary

Issue	Status
Install scripts	⚠️ 1 issue
Native code	✅ 0 issues
Bin script confusion	⚠️ 4 issues
Bin script shell injection	✅ 0 issues
Unresolved require	✅ 0 issues
Invalid package.json	✅ 0 issues
HTTP dependency	✅ 0 issues
Git dependency	✅ 0 issues
Potential typo squat	✅ 0 issues
Known Malware	✅ 0 issues
Telemetry	✅ 0 issues
Protestware/Troll package	✅ 0 issues

Bot Commands

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of package-name@version specifiers. e.g. @SocketSecurity ignore foo@1.0.0 bar@2.4.2

• @SocketSecurity ignore esbuild@0.14.54
• @SocketSecurity ignore @storybook/cli@7.0.0-alpha.62
• @SocketSecurity ignore storybook@7.0.0-alpha.62
• @SocketSecurity ignore detect-port@1.5.1

Powered by socket.dev

[yannbf]

@shilman what do you say we try the new branch strategy in this package too?

[IanVS]

This is blocked on storybookjs/storybook#19704, I believe.

[IanVS]

It looks like the types here have diverged quite a bit from storybook 7. Now I'm seeing an error of:

Argument of type 'GenericArgs' is not assignable to parameter of type 'ComponentProps<GenericArgs> & GenericArgs'.
  Type 'GenericArgs' is not assignable to type 'ComponentProps<GenericArgs>'.

I'm not familiar enough with what's changed to fix this, unfortunately.

[yannbf]

I upgraded the example and fixed most of the issues, the only remaining one is the type for composeStories. It might involve some changes in other packages, I'll check this whenever I can with @kasperpeulen. Thanks for getting this going @IanVS !

Also, feel free to test the resulting canary in your project: 2.0.0--canary.120.168bc9a.0

[github-actions]

🚀 PR was released in v2.0.0 🚀