Update to Storybook 9 (#3053)

Author: bashmish

.changeset/shiny-sloths-drum.md

@@ -0,0 +1,9 @@
+---
+'@web/mocks': major
+'@web/storybook-addon-mocks': major
+'@web/storybook-builder': minor
+'@web/storybook-framework-web-components': minor
+'@web/storybook-utils': major
+---
+
+Migrate projects to Storybook 9

docs/docs/storybook-builder/migration-to-storybook-7.md

@@ -1,4 +1,4 @@
-# Storybook Builder >> Migration to Storybook 7 ||5
+# Storybook Builder >> Migration to Storybook 7 ||6
 
 This guide explains how to migrate from [`@web/dev-server-storybook` plugin](../dev-server/plugins/storybook.md) (that used opinionated Storybook 6 bundle `@web/storybook-prebuilt`) to Storybook 7 and new `@web/storybook-builder`.
 

docs/docs/storybook-builder/migration-to-storybook-8.md

@@ -1,4 +1,4 @@
-# Storybook Builder >> Migration from Storybook 7 to 8 ||4
+# Storybook Builder >> Migration from Storybook 7 to 8 ||5
 
 ## Update dependencies
 
@@ -11,7 +11,7 @@ You need to:
 
 ## General migration guide
 
-Make sure to follow the [Storybook's own migration guide](https://storybook.js.org/docs/migration-guide).
+Make sure to follow the [Storybook's own migration guide](https://storybook.js.org/docs/8/migration-guide).
 We recommend to read it carefully, even though big part of it is not directly related to `@web/storybook-builder` or `@web/storybook-framework-web-components`, many small details are too easy to miss, so go through it step by step.
 
 ## Specific migration notes

docs/docs/storybook-builder/migration-to-storybook-9.md

@@ -0,0 +1,27 @@
+# Storybook Builder >> Migration from Storybook 8 to 9 ||4
+
+## Update dependencies
+
+`@web/storybook-builder` for Storybook 9 is released as version `0.3.x` and expects all Storybook packages to be at least `9.1.20`.
+
+You need to:
+
+- update `@web/storybook-builder` and `@web/storybook-framework-web-components` to `^0.3.0`
+- remove outdated `@storybook/*` packages (see links below for more info)
+  - most common ones to remove are `@storybook/addon-essentials`, `@storybook/addon-interactions`, `@storybook/blocks`, `@storybook/test`
+  - most common one to add is `@storybook/addon-docs`
+- update dependencies under the namespace `@storybook/*` and the `storybook` itself to `^9.1.20`
+
+## General migration guide
+
+Make sure to follow the [Storybook's own migration guide](https://storybook.js.org/docs/releases/migration-guide-from-older-version) and look into more [detailed migration notes on GitHub](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-8x-to-900).
+
+We recommend to read all of it carefully, many small details are too easy to miss, so go through it step by step.
+Some changes will be Vite/Webpack specific and unrelated to `@web/storybook-builder` or `@web/storybook-framework-web-components`, skip them.
+
+## Specific migration notes
+
+A few dependencies might need to be updated, only if you use them:
+
+- update `@web/mocks` to `^2.0.0` and follow [it's migration guide](https://github.com/modernweb-dev/web/blob/master/packages/mocks/MIGRATION.md)
+- update `@web/storybook-utils` to `^2.0.0`

docs/docs/storybook-builder/overview.md

@@ -31,6 +31,11 @@ Then proceed to the [Configuration](./configuration.md).
 
 ## Storybook versions
 
+Storybook 9 is supported by:
+
+- `@web/storybook-builder@0.3.x`
+- `@web/storybook-framework-web-components@0.3.x`
+
 Storybook 8 is supported by:
 
 - `@web/storybook-builder@0.2.x`