Make sure Next 14 is used for sandboxes

storybookjs · Oct 24, 2024 · d0830cf · d0830cf
1 parent 59fac37
commit d0830cf
Show file tree

Hide file tree

Showing 15 changed files with 178 additions and 188 deletions.
diff --git a/.github/workflows/generate-sandboxes.yml b/.github/workflows/generate-sandboxes.yml
@@ -6,9 +6,9 @@ on:
   workflow_dispatch:
   # To test fixes on push rather than wait for the scheduling, do the following:
   # 1. Uncomment the lines below and add your branch.
-  # push:
-  #   branches:
-  #     - <your-branch-name>
+  push:
+    branches:
+      - kasper/fix-sandboxes-next
   # 2. Change the "ref" value to <your-branch-name> in the actions/checkout step below.
   # 3. Comment out the whole "generate-main" job starting at line 77
   # 4. 👉 DON'T FORGET TO UNDO THE STEPS BEFORE YOU MERGE YOUR CHANGES!
@@ -28,8 +28,8 @@ jobs:
     steps:
       - uses: actions/checkout@v4
         with:
-          ref: next
-  
+          ref: kasper/fix-sandboxes-next
+
       - uses: actions/setup-node@v4
         with:
           node-version-file: ".nvmrc"
@@ -74,54 +74,54 @@ jobs:
             The generation of some or all sandboxes on the **next** branch has failed.
             [See the job summary for details](https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }})
 
-  generate-main:
-    name: Generate to main
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          ref: main
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version-file: ".nvmrc"
-
-      - name: Setup git user
-        run: |
-          git config --global user.name "storybook-bot"
-          git config --global user.email "[email protected]"
-
-      - name: Install dependencies
-        working-directory: ./scripts
-        run: node --experimental-modules ./check-dependencies.js
-
-      - name: Compile Storybook libraries
-        run: yarn task --task compile --start-from=auto --no-link
-
-      - name: Publish to local registry
-        run: yarn local-registry --publish
-
-      - name: Run local registry
-        run: yarn local-registry --open &
-
-      - name: Wait for registry
-        run: yarn wait-on tcp:127.0.0.1:6001
-
-      - name: Generate
-        id: generate
-        run: yarn generate-sandboxes --local-registry
-
-      - name: Publish
-        # publish sandboxes even if the generation fails, as some sandboxes might have been generated successfully
-        if: ${{ !cancelled() }}
-        run: yarn publish-sandboxes --remote=https://storybook-bot:${{ secrets.PAT_STORYBOOK_BOT }}@github.com/storybookjs/sandboxes.git --push --branch=main
-
-      - name: Report failure to Discord
-        if: failure()
-        env:
-          DISCORD_WEBHOOK: ${{ secrets.DISCORD_MONITORING_URL }}
-        uses: Ilshidur/action-discord@master
-        with:
-          args: |
-            The generation of some or all sandboxes on the **main** branch has failed.
-            [See the job summary for details](https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }})
+#  generate-main:
+#    name: Generate to main
+#    runs-on: ubuntu-latest
+#    steps:
+#      - uses: actions/checkout@v4
+#        with:
+#          ref: main
+#
+#      - uses: actions/setup-node@v4
+#        with:
+#          node-version-file: ".nvmrc"
+#
+#      - name: Setup git user
+#        run: |
+#          git config --global user.name "storybook-bot"
+#          git config --global user.email "[email protected]"
+#
+#      - name: Install dependencies
+#        working-directory: ./scripts
+#        run: node --experimental-modules ./check-dependencies.js
+#
+#      - name: Compile Storybook libraries
+#        run: yarn task --task compile --start-from=auto --no-link
+#
+#      - name: Publish to local registry
+#        run: yarn local-registry --publish
+#
+#      - name: Run local registry
+#        run: yarn local-registry --open &
+#
+#      - name: Wait for registry
+#        run: yarn wait-on tcp:127.0.0.1:6001
+#
+#      - name: Generate
+#        id: generate
+#        run: yarn generate-sandboxes --local-registry
+#
+#      - name: Publish
+#        # publish sandboxes even if the generation fails, as some sandboxes might have been generated successfully
+#        if: ${{ !cancelled() }}
+#        run: yarn publish-sandboxes --remote=https://storybook-bot:${{ secrets.PAT_STORYBOOK_BOT }}@github.com/storybookjs/sandboxes.git --push --branch=main
+#
+#      - name: Report failure to Discord
+#        if: failure()
+#        env:
+#          DISCORD_WEBHOOK: ${{ secrets.DISCORD_MONITORING_URL }}
+#        uses: Ilshidur/action-discord@master
+#        with:
+#          args: |
+#            The generation of some or all sandboxes on the **main** branch has failed.
+#            [See the job summary for details](https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }})
diff --git a/code/core/template/stories/hooks.stories.ts b/code/core/template/stories/hooks.stories.ts
@@ -6,6 +6,7 @@ import { useEffect, useState } from '@storybook/core/preview-api';
 
 export default {
   component: globalThis.Components.Button,
+  tags: ['!vitest'],
 };
 
 export const UseState = {

diff --git a/code/frameworks/angular/template/stories/basics/component-with-pipe/custom-pipes.stories.ts b/code/frameworks/angular/template/stories/basics/component-with-pipe/custom-pipes.stories.ts
@@ -11,6 +11,8 @@ const meta: Meta<WithPipeComponent> = {
       declarations: [CustomPipePipe],
     }),
   ],
+  tags: ['!test', '!vitest'],
+  parameters: { chromatic: { disable: true } },
 };
 
 export default meta;

diff --git a/code/frameworks/angular/template/stories/basics/ng-module/import-module-chip.stories.ts b/code/frameworks/angular/template/stories/basics/ng-module/import-module-chip.stories.ts
@@ -10,6 +10,8 @@ const meta: Meta<ChipComponent> = {
       imports: [ChipsModule],
     }),
   ],
+  tags: ['!test', '!vitest'],
+  parameters: { chromatic: { disable: true } },
 };
 
 export default meta;

diff --git a/code/frameworks/angular/template/stories/basics/ng-module/import-module-for-root.stories.ts b/code/frameworks/angular/template/stories/basics/ng-module/import-module-for-root.stories.ts
@@ -28,6 +28,8 @@ const meta: Meta<ChipsGroupComponent> = {
     removeChipClick: { action: 'Remove chip' },
     removeAllChipsClick: { action: 'Remove all chips clicked' },
   },
+  tags: ['!test', '!vitest'],
+  parameters: { chromatic: { disable: true } },
 };
 
 export default meta;

diff --git a/code/frameworks/angular/template/stories/basics/ng-module/import-module.stories.ts b/code/frameworks/angular/template/stories/basics/ng-module/import-module.stories.ts
@@ -11,6 +11,8 @@ const meta: Meta<ChipsGroupComponent> = {
       imports: [ChipsModule],
     }),
   ],
+  tags: ['!test', '!vitest'],
+  parameters: { chromatic: { disable: true } },
 };
 
 export default meta;

diff --git a/code/frameworks/svelte-vite/package.json b/code/frameworks/svelte-vite/package.json
@@ -55,16 +55,16 @@
     "ts-dedent": "^2.2.0"
   },
   "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^3.0.1",
+    "@sveltejs/vite-plugin-svelte": "^4.0.0",
     "@types/node": "^22.0.0",
-    "svelte": "^5.0.0-next.268",
+    "svelte": "^5.0.5",
     "typescript": "^5.3.2",
     "vite": "^4.0.0"
   },
   "peerDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^2.0.0 || ^3.0.0",
+    "@sveltejs/vite-plugin-svelte": "^2.0.0 || ^3.0.0 || ^4.0.0",
     "storybook": "workspace:^",
-    "svelte": "^4.0.0 || ^5.0.0-next.65",
+    "svelte": "^4.0.0 || ^5.0.0",
     "vite": "^4.0.0 || ^5.0.0"
   },
   "engines": {

diff --git a/code/frameworks/svelte-webpack5/package.json b/code/frameworks/svelte-webpack5/package.json
@@ -52,13 +52,13 @@
     "@storybook/svelte": "workspace:*"
   },
   "devDependencies": {
-    "svelte": "^4.0.0",
-    "svelte-loader": "^3.1.9",
+    "svelte": "^5.0.5",
+    "svelte-loader": "^3.2.4",
     "typescript": "^5.3.2"
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "svelte": "^4.0.0 || ^5.0.0-next.65",
+    "svelte": "^4.0.0 || ^5.0.0",
     "svelte-loader": "*"
   },
   "engines": {

diff --git a/code/frameworks/sveltekit/package.json b/code/frameworks/sveltekit/package.json
@@ -70,7 +70,7 @@
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "svelte": "^4.0.0 || ^5.0.0-next.65",
+    "svelte": "^4.0.0 || ^5.0.0",
     "vite": "^4.0.0 || ^5.0.0"
   },
   "engines": {

diff --git a/code/lib/cli-storybook/src/sandbox-templates.ts b/code/lib/cli-storybook/src/sandbox-templates.ts
@@ -159,7 +159,7 @@ const baseTemplates = {
   'nextjs/default-js': {
     name: 'Next.js Latest (Webpack | JavaScript)',
     script:
-      'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',
+      'npx create-next-app@^14 {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',
     expected: {
       framework: '@storybook/nextjs',
       renderer: '@storybook/react',
@@ -176,7 +176,7 @@ const baseTemplates = {
   'nextjs/default-ts': {
     name: 'Next.js Latest (Webpack | TypeScript)',
     script:
-      'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',
+      'npx create-next-app@^14 {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',
     expected: {
       framework: '@storybook/nextjs',
       renderer: '@storybook/react',
@@ -210,7 +210,7 @@ const baseTemplates = {
   'experimental-nextjs-vite/default-ts': {
     name: 'Next.js Latest (Vite | TypeScript)',
     script:
-      'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',
+      'npx create-next-app@^14 {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',
     expected: {
       framework: '@storybook/experimental-nextjs-vite',
       renderer: '@storybook/react',

diff --git a/code/lib/create-storybook/src/scaffold-new-project.ts b/code/lib/create-storybook/src/scaffold-new-project.ts
@@ -46,9 +46,10 @@ const SUPPORTED_PROJECTS: Record<string, SupportedProject> = {
       language: 'TS',
     },
     createScript: {
-      npm: 'npm create next-app . -- --typescript --use-npm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
-      yarn: 'yarn create next-app . --typescript --use-yarn --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
-      pnpm: 'pnpm create next-app . --typescript --use-pnpm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
+      npm: 'npm create next-app@^14 . -- --typescript --use-npm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
+      // yarn doesn't support version ranges, so we have to use npx
+      yarn: 'npx create-next-app@^14 . --typescript --use-yarn --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
+      pnpm: 'pnpm create next-app^14 . --typescript --use-pnpm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
     },
   },
   'vue-vite-ts': {

diff --git a/code/presets/svelte-webpack/package.json b/code/presets/svelte-webpack/package.json
@@ -69,13 +69,13 @@
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {
-    "svelte": "^4.0.0",
-    "svelte-loader": "^3.1.9",
+    "svelte": "^5.0.0",
+    "svelte-loader": "^3.2.4",
     "typescript": "^5.3.2"
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "svelte": "^4.0.0 || ^5.0.0-next.65",
+    "svelte": "^4.0.0 || ^5.0.0",
     "svelte-loader": "*"
   },
   "engines": {

diff --git a/code/renderers/svelte/package.json b/code/renderers/svelte/package.json
@@ -65,16 +65,16 @@
     "type-fest": "~2.19"
   },
   "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^3.0.2",
-    "@testing-library/svelte": "^5.2.3",
+    "@sveltejs/vite-plugin-svelte": "^4.0.0",
+    "@testing-library/svelte": "^5.2.4",
     "expect-type": "^0.15.0",
-    "svelte": "^5.0.0-next.268",
+    "svelte": "^5.0.5",
     "svelte-check": "^4.0.5",
     "typescript": "^5.3.2"
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "svelte": "^4.0.0 || ^5.0.0-next.65"
+    "svelte": "^4.0.0 || ^5.0.0"
   },
   "engines": {
     "node": ">=18.0.0"