diff --git a/.circleci/config.yml b/.circleci/config.yml index de37dcb620e1..ae4d26d0d487 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -1,1176 +1,1177 @@ commands: - cancel-workflow-on-failure: - description: Cancels the entire workflow in case the previous step has failed - steps: - - run: - command: | - echo "Canceling workflow as previous step resulted in failure." - echo "To execute all checks locally, please run yarn ci-tests" - curl -X POST --header "Content-Type: application/json" "https://circleci.com/api/v2/workflow/${CIRCLE_WORKFLOW_ID}/cancel?circle-token=${WORKFLOW_CANCELER}" - name: Cancel current workflow - when: on_fail - report-workflow-on-failure: - description: Reports failures to discord - parameters: - template: - default: none - description: | - Which template to report in discord. Applicable for parallel sandbox jobs - type: string - steps: - - run: - command: git fetch --unshallow - when: on_fail - - discord/status: - fail_only: true - failure_message: $(yarn get-report-message << pipeline.parameters.workflow >> << parameters.template >>) - only_for_branches: main,next,next-release,latest-release - start-event-collector: - description: Starts the event collector - steps: - - run: - background: true - command: yarn jiti ./event-log-collector.ts - name: Start Event Collector - working_directory: scripts + cancel-workflow-on-failure: + description: Cancels the entire workflow in case the previous step has failed + steps: + - run: + command: | + echo "Canceling workflow as previous step resulted in failure." + echo "To execute all checks locally, please run yarn ci-tests" + curl -X POST --header "Content-Type: application/json" "https://circleci.com/api/v2/workflow/${CIRCLE_WORKFLOW_ID}/cancel?circle-token=${WORKFLOW_CANCELER}" + name: Cancel current workflow + when: on_fail + report-workflow-on-failure: + description: Reports failures to discord + parameters: + template: + default: none + description: | + Which template to report in discord. Applicable for parallel sandbox jobs + type: string + steps: + - run: + command: git fetch --unshallow + when: on_fail + - discord/status: + fail_only: true + failure_message: $(yarn get-report-message << pipeline.parameters.workflow >> << parameters.template >>) + only_for_branches: main,next,next-release,latest-release + start-event-collector: + description: Starts the event collector + steps: + - run: + background: true + command: yarn jiti ./event-log-collector.ts + name: Start Event Collector + working_directory: scripts executors: - sb_node_18_browsers: - docker: - - environment: - NODE_OPTIONS: --max_old_space_size=6144 - image: cimg/node:18.20.3-browsers - parameters: - class: - default: small - description: The Resource class - enum: - - small - - medium - - medium+ - - large - - xlarge - type: enum - resource_class: <> - working_directory: /tmp/storybook - sb_node_22_browsers: - docker: - - environment: - NODE_OPTIONS: --max_old_space_size=6144 - image: cimg/node:22.15.0-browsers - parameters: - class: - default: small - description: The Resource class - enum: - - small - - medium - - medium+ - - large - - xlarge - type: enum - resource_class: <> - working_directory: /tmp/storybook - sb_node_22_classic: - docker: - - environment: - NODE_OPTIONS: --max_old_space_size=6144 - image: cimg/node:22.15.0 - parameters: - class: - default: small - description: The Resource class - enum: - - small - - medium - - medium+ - - large - - xlarge - type: enum - resource_class: <> - working_directory: /tmp/storybook - sb_playwright: - docker: - - environment: - NODE_OPTIONS: --max_old_space_size=6144 - image: mcr.microsoft.com/playwright:v1.52.0-noble - parameters: - class: - default: small - description: The Resource class - enum: - - small - - medium - - medium+ - - large - - xlarge - type: enum - resource_class: <> - working_directory: /tmp/storybook + sb_node_18_browsers: + docker: + - environment: + NODE_OPTIONS: --max_old_space_size=6144 + image: cimg/node:18.20.3-browsers + parameters: + class: + default: small + description: The Resource class + enum: + - small + - medium + - medium+ + - large + - xlarge + type: enum + resource_class: <> + working_directory: /tmp/storybook + sb_node_22_browsers: + docker: + - environment: + NODE_OPTIONS: --max_old_space_size=6144 + image: cimg/node:22.15.0-browsers + parameters: + class: + default: small + description: The Resource class + enum: + - small + - medium + - medium+ + - large + - xlarge + type: enum + resource_class: <> + working_directory: /tmp/storybook + sb_node_22_classic: + docker: + - environment: + NODE_OPTIONS: --max_old_space_size=6144 + image: cimg/node:22.15.0 + parameters: + class: + default: small + description: The Resource class + enum: + - small + - medium + - medium+ + - large + - xlarge + type: enum + resource_class: <> + working_directory: /tmp/storybook + sb_playwright: + docker: + - environment: + NODE_OPTIONS: --max_old_space_size=6144 + image: mcr.microsoft.com/playwright:v1.52.0-noble + parameters: + class: + default: small + description: The Resource class + enum: + - small + - medium + - medium+ + - large + - xlarge + type: enum + resource_class: <> + working_directory: /tmp/storybook jobs: - bench-packages: - executor: - class: small - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - when: - condition: - and: - - << pipeline.parameters.ghBaseBranch >> - - << pipeline.parameters.ghPrNumber >> - steps: + bench-packages: + executor: + class: small + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - when: + condition: + and: + - << pipeline.parameters.ghBaseBranch >> + - << pipeline.parameters.ghPrNumber >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: yarn bench-packages --base-branch << pipeline.parameters.ghBaseBranch >> --pull-request << pipeline.parameters.ghPrNumber >> --upload + name: Benchmarking packages against base branch + working_directory: scripts + - when: + condition: + or: + - not: << pipeline.parameters.ghBaseBranch >> + - not: << pipeline.parameters.ghPrNumber >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: yarn bench-packages --upload + name: Uploading package benchmarks for branch + working_directory: scripts + - store_artifacts: + path: bench/packages/results.json + - report-workflow-on-failure + - cancel-workflow-on-failure + bench-sandboxes: + executor: + class: small + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies + - run: + command: yarn task --task bench --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) --no-link --start-from=never --junit + name: Running Bench + - run: + command: yarn upload-bench $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) << pipeline.parameters.ghPrNumber >> << pipeline.parameters.ghBaseBranch >> + name: Uploading results + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) + build: + executor: + class: large + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - restore_cache: + keys: + - build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} + name: Restore Yarn cache - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + yarn task --task compile --start-from=auto --no-link --debug + git diff --exit-code + yarn dedupe --check + name: Compile - run: - command: yarn bench-packages --base-branch << pipeline.parameters.ghBaseBranch >> --pull-request << pipeline.parameters.ghPrNumber >> --upload - name: Benchmarking packages against base branch - working_directory: scripts - - when: - condition: - or: - - not: << pipeline.parameters.ghBaseBranch >> - - not: << pipeline.parameters.ghPrNumber >> - steps: + command: | + cd code + yarn local-registry --publish + name: Publish to Verdaccio + - report-workflow-on-failure + - store_artifacts: + path: code/bench/esbuild-metafiles + - save_cache: + key: build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} + name: Save Yarn cache + paths: + - ~/.yarn/berry/cache + - persist_to_workspace: + paths: + - code/node_modules + - code/addons + - scripts/node_modules + - code/bench + - code/examples + - code/frameworks + - code/lib + - code/core + - code/builders + - code/renderers + - code/presets + - .verdaccio-cache + root: . + check: + executor: + class: large + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - nx/set-shas: + main-branch-name: next + workflow-name: << pipeline.parameters.workflow >> + - restore_cache: + keys: + - build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} + name: Restore Yarn cache - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + yarn task --task compile --start-from=auto --no-link --debug + name: Compile - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + yarn task --task check --start-from=auto --no-link --debug + name: Check - run: - command: yarn bench-packages --upload - name: Uploading package benchmarks for branch - working_directory: scripts - - store_artifacts: - path: bench/packages/results.json - - report-workflow-on-failure - - cancel-workflow-on-failure - bench-sandboxes: - executor: - class: small - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - run: - command: yarn task --task bench --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) --no-link --start-from=never --junit - name: Running Bench - - run: - command: yarn upload-bench $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) << pipeline.parameters.ghPrNumber >> << pipeline.parameters.ghBaseBranch >> - name: Uploading results - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task bench) - build: - executor: - class: large - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - restore_cache: - keys: - - build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} - name: Restore Yarn cache - - run: - command: | - yarn task --task compile --start-from=auto --no-link --debug - git diff --exit-code - yarn dedupe --check - name: Compile - - run: - command: | - cd code - yarn local-registry --publish - name: Publish to Verdaccio - - report-workflow-on-failure - - store_artifacts: - path: code/bench/esbuild-metafiles - - save_cache: - key: build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} - name: Save Yarn cache - paths: - - ~/.yarn/berry/cache - - persist_to_workspace: - paths: - - code/node_modules - - code/addons - - scripts/node_modules - - code/bench - - code/examples - - code/frameworks - - code/lib - - code/core - - code/builders - - code/renderers - - code/presets - - .verdaccio-cache - root: . - check: - executor: - class: large - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - nx/set-shas: - main-branch-name: next - workflow-name: << pipeline.parameters.workflow >> - - restore_cache: - keys: - - build-yarn-2-cache-v5--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} - name: Restore Yarn cache - - run: - command: | - yarn task --task compile --start-from=auto --no-link --debug - name: Compile - - run: - command: | - yarn task --task check --start-from=auto --no-link --debug - name: Check - - run: - command: | - git diff --exit-code - name: Ensure no changes pending - - report-workflow-on-failure - - cancel-workflow-on-failure - chromatic-internal-storybook: - environment: - NODE_OPTIONS: --max_old_space_size=4096 - executor: - class: large - name: sb_node_22_browsers - steps: - - checkout - - attach_workspace: - at: . - - run: - command: yarn storybook:ui:chromatic - name: Running Chromatic - working_directory: code - - report-workflow-on-failure - - store_test_results: - path: test-results - chromatic-sandboxes: - executor: - class: medium - name: sb_node_22_browsers - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - checkout - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - run: - command: yarn task --task chromatic --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) --no-link --start-from=never --junit - name: Running Chromatic - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) - - store_test_results: - path: test-results - coverage: - executor: - class: small - name: sb_node_22_browsers - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - codecov/upload - - report-workflow-on-failure - create-sandboxes: - executor: - class: large - name: sb_node_22_browsers - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - # Enable corepack - sudo corepack enable - - # Verify yarn is working - which yarn - yarn --version - name: Setup Corepack - - start-event-collector - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task sandbox) - yarn task --task build --template $TEMPLATE --no-link --start-from=sandbox --junit - if [[ $TEMPLATE != bench/* ]]; then - yarn --cwd scripts jiti ./event-log-checker.ts build $TEMPLATE - fi - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && rm -rf node_modules - environment: - STORYBOOK_TELEMETRY_DEBUG: 1 - STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log - name: Create Sandboxes - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task sandbox) - - persist_to_workspace: - paths: - - sandbox/** - root: . - - store_test_results: - path: test-results - e2e-dev: - executor: - class: medium+ - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - run: - command: | - TEST_FILES=$(circleci tests glob "code/e2e-tests/*.{test,spec}.{ts,js,mjs}") - echo "$TEST_FILES" | circleci tests run --command="xargs yarn task --task e2e-tests-dev --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) --no-link --start-from=never --junit" --verbose --index=0 --total=1 - name: Running E2E Tests - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) - - store_test_results: - path: test-results - - store_artifacts: - destination: playwright - path: code/playwright-results/ - e2e-production: - executor: - class: medium - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - run: - command: | - TEST_FILES=$(circleci tests glob "code/e2e-tests/*.{test,spec}.{ts,js,mjs}") - echo "$TEST_FILES" | circleci tests run --command="xargs yarn task --task e2e-tests --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) --no-link --start-from=never --junit" --verbose --index=0 --total=1 - name: Running E2E Tests - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) - - store_test_results: - path: test-results - - store_artifacts: - destination: playwright - path: code/playwright-results/ - e2e-ui: - executor: - class: medium - name: sb_playwright - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: yarn install --no-immutable - environment: - YARN_ENABLE_IMMUTABLE_INSTALLS: false - name: Install dependencies - working_directory: test-storybooks/portable-stories-kitchen-sink/react - - run: - command: yarn playwright-e2e - name: Run E2E tests - working_directory: test-storybooks/portable-stories-kitchen-sink/react - - store_test_results: - path: test-results - - store_artifacts: - destination: playwright - path: test-storybooks/portable-stories-kitchen-sink/react/test-results/ - - report-workflow-on-failure - knip: - executor: - class: large - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - cd code - yarn knip --no-exit-code - name: Knip - - report-workflow-on-failure - - cancel-workflow-on-failure - lint: - executor: - class: medium+ - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - cd code - yarn lint - name: Lint - - report-workflow-on-failure - - cancel-workflow-on-failure - pretty-docs: - executor: - class: medium - name: sb_node_22_classic - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - restore_cache: - keys: - - prettydocs-yarn-2-cache-v8--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} - name: Restore Yarn cache - - run: - command: | - cd scripts - yarn install - name: Install - - save_cache: - key: prettydocs-yarn-2-cache-v8--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} - name: Save Yarn cache - paths: - - ~/.yarn/berry/cache - - run: - command: | - cd scripts - yarn docs:prettier:check - name: Prettier - script-checks: - executor: sb_node_22_browsers - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - cd scripts - yarn get-template --check - name: Check parallelism count - - run: - command: | - cd scripts - yarn check - name: Type check - - run: - command: | - cd scripts - yarn test --coverage - name: Run tests - - store_test_results: - path: scripts/junit.xml - - report-workflow-on-failure - - cancel-workflow-on-failure - smoke-test-sandboxes: - executor: - class: medium - name: sb_node_18_browsers - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: yarn task --task smoke-test --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task smoke-test) --no-link --start-from=never --junit - name: Smoke Testing Sandboxes - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task smoke-test) - - store_test_results: - path: test-results - test-init-empty: - executor: - class: small - name: sb_node_22_browsers - parameters: - packageManager: - type: string - template: - type: string - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - when: - condition: - equal: - - npm - - << parameters.packageManager >> - steps: + command: | + git diff --exit-code + name: Ensure no changes pending + - report-workflow-on-failure + - cancel-workflow-on-failure + chromatic-internal-storybook: + environment: + NODE_OPTIONS: --max_old_space_size=4096 + executor: + class: large + name: sb_node_22_browsers + steps: + - checkout + - attach_workspace: + at: . + - run: + command: yarn storybook:ui:chromatic + name: Running Chromatic + working_directory: code + - report-workflow-on-failure + - store_test_results: + path: test-results + chromatic-sandboxes: + executor: + class: medium + name: sb_node_22_browsers + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - checkout + - attach_workspace: + at: . - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies + - run: + command: yarn task --task chromatic --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) --no-link --start-from=never --junit + name: Running Chromatic + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task chromatic) + - store_test_results: + path: test-results + coverage: + executor: + class: small + name: sb_node_22_browsers + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - codecov/upload + - report-workflow-on-failure + create-sandboxes: + executor: + class: large + name: sb_node_22_browsers + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + # Enable corepack + sudo corepack enable + + # Verify yarn is working + which yarn + yarn --version + name: Setup Corepack + - start-event-collector - run: command: | - cd .. - mkdir empty-<< parameters.template >> - cd empty-<< parameters.template >> - npm set registry http://localhost:6001 - npx storybook init --yes --package-manager npm - npm run storybook -- --smoke-test + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task sandbox) + yarn task --task build --template $TEMPLATE --no-link --start-from=sandbox --junit + if [[ $TEMPLATE != bench/* ]]; then + yarn --cwd scripts jiti ./event-log-checker.ts build $TEMPLATE + fi + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && rm -rf node_modules environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> - name: Storybook init from empty directory (NPM) - - when: - condition: - equal: - - yarn1 - - << parameters.packageManager >> - steps: + STORYBOOK_TELEMETRY_DEBUG: 1 + STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log + name: Create Sandboxes + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task sandbox) + - persist_to_workspace: + paths: + - sandbox/** + root: . + - store_test_results: + path: test-results + e2e-dev: + executor: + class: medium+ + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + TEST_FILES=$(circleci tests glob "code/e2e-tests/*.{test,spec}.{ts,js,mjs}") + echo "$TEST_FILES" | circleci tests run --command="xargs yarn task --task e2e-tests-dev --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) --no-link --start-from=never --junit" --verbose --index=0 --total=1 + name: Running E2E Tests + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests-dev) + - store_test_results: + path: test-results + - store_artifacts: + destination: playwright + path: code/playwright-results/ + e2e-production: + executor: + class: medium + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: command: | - cd .. - mkdir empty-<< parameters.template >> - cd empty-<< parameters.template >> - npx storybook init --yes --package-manager yarn1 - yarn storybook --smoke-test + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies + - run: + command: | + TEST_FILES=$(circleci tests glob "code/e2e-tests/*.{test,spec}.{ts,js,mjs}") + echo "$TEST_FILES" | circleci tests run --command="xargs yarn task --task e2e-tests --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) --no-link --start-from=never --junit" --verbose --index=0 --total=1 + name: Running E2E Tests + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task e2e-tests) + - store_test_results: + path: test-results + - store_artifacts: + destination: playwright + path: code/playwright-results/ + e2e-ui: + executor: + class: medium + name: sb_playwright + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: yarn install --no-immutable environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> - name: Storybook init from empty directory (Yarn 1) - - when: - condition: - equal: - - yarn2 - - << parameters.packageManager >> - steps: + YARN_ENABLE_IMMUTABLE_INSTALLS: false + name: Install dependencies + working_directory: test-storybooks/portable-stories-kitchen-sink/react + - run: + command: yarn playwright-e2e + name: Run E2E tests + working_directory: test-storybooks/portable-stories-kitchen-sink/react + - store_test_results: + path: test-results + - store_artifacts: + destination: playwright + path: test-storybooks/portable-stories-kitchen-sink/react/test-results/ + - report-workflow-on-failure + knip: + executor: + class: large + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + cd code + yarn knip --no-exit-code + name: Knip + - report-workflow-on-failure + - cancel-workflow-on-failure + lint: + executor: + class: medium+ + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + cd code + yarn lint + name: Lint + - report-workflow-on-failure + - cancel-workflow-on-failure + pretty-docs: + executor: + class: medium + name: sb_node_22_classic + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - restore_cache: + keys: + - prettydocs-yarn-2-cache-v8--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} + name: Restore Yarn cache - run: command: | - cd .. - mkdir empty-<< parameters.template >> - cd empty-<< parameters.template >> - yarn set version berry - yarn config set registry http://localhost:6001 - yarn dlx storybook init --yes --package-manager yarn2 - yarn storybook --smoke-test - environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> - name: Storybook init from empty directory (Yarn 2) - - when: - condition: - equal: - - pnpm - - << parameters.packageManager >> - steps: + cd scripts + yarn install + name: Install + - save_cache: + key: prettydocs-yarn-2-cache-v8--{{ checksum "code/yarn.lock" }}--{{ checksum "scripts/yarn.lock" }} + name: Save Yarn cache + paths: + - ~/.yarn/berry/cache + - run: + command: | + cd scripts + yarn docs:prettier:check + name: Prettier + script-checks: + executor: sb_node_22_browsers + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: | + cd scripts + yarn get-template --check + name: Check parallelism count + - run: + command: | + cd scripts + yarn check + name: Type check + - run: + command: | + cd scripts + yarn test --coverage + name: Run tests + - store_test_results: + path: scripts/junit.xml + - report-workflow-on-failure + - cancel-workflow-on-failure + smoke-test-sandboxes: + executor: + class: medium + name: sb_node_18_browsers + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: yarn task --task smoke-test --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task smoke-test) --no-link --start-from=never --junit + name: Smoke Testing Sandboxes + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task smoke-test) + - store_test_results: + path: test-results + stories-tests: + executor: + class: xlarge + name: sb_playwright + parallelism: 2 + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: | + cd code + TEST_FILES=$(circleci tests glob "**/*.{stories}.{ts,tsx,js,jsx,cjs}" | sed "/^e2e-tests\//d" | sed "/^node_modules\//d") + echo "$TEST_FILES" | circleci tests run --command="xargs yarn test --reporter=junit --reporter=default --outputFile=../test-results/junit-${CIRCLE_NODE_INDEX}.xml" --verbose + name: Run tests + - store_test_results: + path: test-results + - report-workflow-on-failure + - cancel-workflow-on-failure + test-init-empty: + executor: + class: small + name: sb_node_22_browsers + parameters: + packageManager: + type: string + template: + type: string + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - when: + condition: + equal: + - npm + - << parameters.packageManager >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: | + cd .. + mkdir empty-<< parameters.template >> + cd empty-<< parameters.template >> + npm set registry http://localhost:6001 + npx storybook init --yes --package-manager npm + npm run storybook -- --smoke-test + environment: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> + name: Storybook init from empty directory (NPM) + - when: + condition: + equal: + - yarn1 + - << parameters.packageManager >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: | + cd .. + mkdir empty-<< parameters.template >> + cd empty-<< parameters.template >> + npx storybook init --yes --package-manager yarn1 + yarn storybook --smoke-test + environment: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> + name: Storybook init from empty directory (Yarn 1) + - when: + condition: + equal: + - yarn2 + - << parameters.packageManager >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: | + cd .. + mkdir empty-<< parameters.template >> + cd empty-<< parameters.template >> + yarn set version berry + yarn config set registry http://localhost:6001 + yarn dlx storybook init --yes --package-manager yarn2 + yarn storybook --smoke-test + environment: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> + name: Storybook init from empty directory (Yarn 2) + - when: + condition: + equal: + - pnpm + - << parameters.packageManager >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: | + cd .. + mkdir empty-<< parameters.template >> + cd empty-<< parameters.template >> + npm i -g pnpm + pnpm config set registry http://localhost:6001 + pnpm dlx storybook init --yes --package-manager pnpm + pnpm run storybook --smoke-test + environment: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> + name: Storybook init from empty directory (PNPM) + - when: + condition: + equal: + - react-vite-ts + - << parameters.template >> + steps: + - run: + background: true + command: | + cd code + yarn local-registry --open + name: Verdaccio + - run: + command: | + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 + name: Wait on Verdaccio + - run: + command: | + cd .. + mkdir empty-<< parameters.template >>-no-install + cd empty-<< parameters.template >>-no-install + npx storybook init --yes --skip-install + npm install + npm run build-storybook + environment: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> + name: Storybook init from empty directory (--skip-install) + - report-workflow-on-failure + test-init-features: + executor: + class: small + name: sb_node_22_browsers + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: background: true command: | - cd code - yarn local-registry --open + cd code + yarn local-registry --open name: Verdaccio - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 + cd code + yarn wait-on tcp:127.0.0.1:6001 + yarn wait-on tcp:127.0.0.1:6002 name: Wait on Verdaccio - run: command: | - cd .. - mkdir empty-<< parameters.template >> - cd empty-<< parameters.template >> - npm i -g pnpm - pnpm config set registry http://localhost:6001 - pnpm dlx storybook init --yes --package-manager pnpm - pnpm run storybook --smoke-test + cd .. + mkdir features-1 + cd features-1 + npm set registry http://localhost:6001 + npx create-storybook --yes --package-manager npm --features dev docs test + npx vitest environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> - name: Storybook init from empty directory (PNPM) - - when: - condition: - equal: - - react-vite-ts - - << parameters.template >> - steps: + IN_STORYBOOK_SANDBOX: true + STORYBOOK_DISABLE_TELEMETRY: true + STORYBOOK_INIT_EMPTY_TYPE: react-vite-ts + name: Storybook init for features + test-portable-stories: + executor: + class: medium + name: sb_playwright + parameters: + directory: + type: string + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: yarn install --no-immutable + environment: + YARN_ENABLE_IMMUTABLE_INSTALLS: false + name: Install dependencies + working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> + - run: + command: yarn jest + name: Run Jest tests + working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> + - run: + command: yarn vitest + name: Run Vitest tests + working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> + - run: + command: yarn playwright-ct + name: Run Playwright CT tests + working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> + - run: + command: yarn cypress + name: Run Cypress CT tests + working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> + - report-workflow-on-failure + test-runner-dev: + executor: + class: large + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: yarn task --task test-runner-dev --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner-dev) --no-link --start-from=never --junit + name: Running Test Runner in Dev mode + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner-dev) + - store_test_results: + path: test-results + test-runner-production: + executor: + class: medium+ + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: - background: true command: | - cd code - yarn local-registry --open - name: Verdaccio + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies + - start-event-collector + - run: + command: yarn task --task test-runner --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) --no-link --start-from=never --junit + environment: + STORYBOOK_TELEMETRY_DEBUG: 1 + STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log + name: Running Test Runner + - run: + command: yarn --cwd scripts jiti ./event-log-checker.ts test-run $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) + name: Check Telemetry + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) + - store_test_results: + path: test-results + unit-tests: + executor: + class: xlarge + name: sb_playwright + parallelism: 2 + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio + cd code + TEST_FILES=$(circleci tests glob "**/*.{test,spec,stories}.{ts,tsx,js,jsx,cjs}" | sed "/^e2e-tests\//d" | sed "/^node_modules\//d") + echo "$TEST_FILES" | circleci tests run --command="xargs yarn test --reporter=junit --reporter=default --outputFile=../test-results/junit-${CIRCLE_NODE_INDEX}.xml" --verbose + name: Run tests + - store_test_results: + path: test-results + - report-workflow-on-failure + - cancel-workflow-on-failure + vitest-integration: + executor: + class: xlarge + name: sb_playwright + parallelism: << parameters.parallelism >> + parameters: + parallelism: + type: integer + steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . - run: command: | - cd .. - mkdir empty-<< parameters.template >>-no-install - cd empty-<< parameters.template >>-no-install - npx storybook init --yes --skip-install - npm install - npm run build-storybook + TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) + cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn + name: Install sandbox dependencies + - start-event-collector + - run: + command: yarn task --task vitest-integration --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) --no-link --start-from=never --junit environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: << parameters.template >> - name: Storybook init from empty directory (--skip-install) - - report-workflow-on-failure - test-init-features: - executor: - class: small - name: sb_node_22_browsers - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - background: true - command: | - cd code - yarn local-registry --open - name: Verdaccio - - run: - command: | - cd code - yarn wait-on tcp:127.0.0.1:6001 - yarn wait-on tcp:127.0.0.1:6002 - name: Wait on Verdaccio - - run: - command: | - cd .. - mkdir features-1 - cd features-1 - npm set registry http://localhost:6001 - npx create-storybook --yes --package-manager npm --features dev docs test - npx vitest - environment: - IN_STORYBOOK_SANDBOX: true - STORYBOOK_DISABLE_TELEMETRY: true - STORYBOOK_INIT_EMPTY_TYPE: react-vite-ts - name: Storybook init for features - test-portable-stories: - executor: - class: medium - name: sb_playwright - parameters: - directory: - type: string - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: yarn install --no-immutable - environment: - YARN_ENABLE_IMMUTABLE_INSTALLS: false - name: Install dependencies - working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> - - run: - command: yarn jest - name: Run Jest tests - working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> - - run: - command: yarn vitest - name: Run Vitest tests - working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> - - run: - command: yarn playwright-ct - name: Run Playwright CT tests - working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> - - run: - command: yarn cypress - name: Run Cypress CT tests - working_directory: test-storybooks/portable-stories-kitchen-sink/<< parameters.directory >> - - report-workflow-on-failure - test-runner-dev: - executor: - class: large - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: yarn task --task test-runner-dev --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner-dev) --no-link --start-from=never --junit - name: Running Test Runner in Dev mode - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner-dev) - - store_test_results: - path: test-results - test-runner-production: - executor: - class: medium+ - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - start-event-collector - - run: - command: yarn task --task test-runner --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) --no-link --start-from=never --junit - environment: - STORYBOOK_TELEMETRY_DEBUG: 1 - STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log - name: Running Test Runner - - run: - command: yarn --cwd scripts jiti ./event-log-checker.ts test-run $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) - name: Check Telemetry - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task test-runner) - - store_test_results: - path: test-results - unit-tests: - executor: - class: xlarge - name: sb_playwright - parallelism: 2 - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - cd code - TEST_FILES=$(circleci tests glob "**/*.{test,spec}.{ts,tsx,js,jsx,cjs}" | sed "/^e2e-tests\//d" | sed "/^node_modules\//d") - echo "$TEST_FILES" | circleci tests run --command="xargs yarn test --reporter=junit --reporter=default --outputFile=../test-results/junit-${CIRCLE_NODE_INDEX}.xml" --verbose - name: Run tests - - store_test_results: - path: test-results - - report-workflow-on-failure - - cancel-workflow-on-failure - stories-tests: - executor: - class: xlarge - name: sb_playwright - parallelism: 2 - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - cd code - TEST_FILES=$(circleci tests glob "**/*.{stories}.{ts,tsx,js,jsx,cjs}" | sed "/^e2e-tests\//d" | sed "/^node_modules\//d") - echo "$TEST_FILES" | circleci tests run --command="xargs yarn test --reporter=junit --reporter=default --outputFile=../test-results/junit-${CIRCLE_NODE_INDEX}.xml" --verbose - name: Run tests - - store_test_results: - path: test-results - - report-workflow-on-failure - - cancel-workflow-on-failure - vitest-integration: - executor: - class: xlarge - name: sb_playwright - parallelism: << parameters.parallelism >> - parameters: - parallelism: - type: integer - steps: - - git-shallow-clone/checkout_advanced: - clone_options: --depth 1 --verbose - - attach_workspace: - at: . - - run: - command: | - TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) - cd sandbox/$(yarn get-sandbox-dir --template $TEMPLATE) && yarn - name: Install sandbox dependencies - - start-event-collector - - run: - command: yarn task --task vitest-integration --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) --no-link --start-from=never --junit - environment: - STORYBOOK_TELEMETRY_DEBUG: 1 - STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log - name: Running story tests in Vitest - - run: - command: yarn --cwd scripts jiti ./event-log-checker.ts test-run $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) - name: Check Telemetry - - report-workflow-on-failure: - template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) - - store_test_results: - path: test-results + STORYBOOK_TELEMETRY_DEBUG: 1 + STORYBOOK_TELEMETRY_URL: http://localhost:6007/event-log + name: Running story tests in Vitest + - run: + command: yarn --cwd scripts jiti ./event-log-checker.ts test-run $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) + name: Check Telemetry + - report-workflow-on-failure: + template: $(yarn get-template --cadence << pipeline.parameters.workflow >> --task vitest-integration) + - store_test_results: + path: test-results orbs: - browser-tools: circleci/browser-tools@1.4.1 - codecov: codecov/codecov@3.2.4 - discord: antonioned/discord@0.1.0 - git-shallow-clone: guitarrapc/git-shallow-clone@2.5.0 - node: circleci/node@5.2.0 - nx: nrwl/nx@1.6.2 + browser-tools: circleci/browser-tools@1.4.1 + codecov: codecov/codecov@3.2.4 + discord: antonioned/discord@0.1.0 + git-shallow-clone: guitarrapc/git-shallow-clone@2.5.0 + node: circleci/node@5.2.0 + nx: nrwl/nx@1.6.2 parameters: - ghBaseBranch: - default: next - description: The name of the base branch (the target of the PR) - type: string - ghPrNumber: - default: '' - description: The PR number - type: string - workflow: - default: skipped - description: Which workflow to run - enum: - - normal - - merged - - daily - - skipped - - docs - type: enum + ghBaseBranch: + default: next + description: The name of the base branch (the target of the PR) + type: string + ghPrNumber: + default: "" + description: The PR number + type: string + workflow: + default: skipped + description: Which workflow to run + enum: + - normal + - merged + - daily + - skipped + - docs + type: enum version: 2.1 workflows: - daily: - jobs: - - pretty-docs - - build - - lint: - requires: - - build - - knip: - requires: - - build - - bench-packages: - requires: - - build - - check - - unit-tests: - requires: - - build - - stories-tests: - requires: - - build - - script-checks: - requires: - - build - - chromatic-internal-storybook: - requires: - - build - - create-sandboxes: - parallelism: 30 - requires: + daily: + jobs: + - pretty-docs - build - - chromatic-sandboxes: - parallelism: 27 - requires: - - create-sandboxes - - e2e-production: - parallelism: 7 - requires: - - create-sandboxes - - e2e-dev: - parallelism: 25 - requires: - - create-sandboxes - - test-runner-production: - parallelism: 25 - requires: - - create-sandboxes - - vitest-integration: - parallelism: 9 - requires: - - create-sandboxes - - test-portable-stories: - matrix: - parameters: - directory: - - react - - vue3 - - nextjs - - svelte - requires: - - build - - e2e-ui: - requires: - - build - - test-init-features: - requires: - - build - - test-init-empty: - matrix: - parameters: - packageManager: - - npm - template: - - react-vite-ts - - nextjs-ts - - vue-vite-ts - - lit-vite-ts - requires: - - build - when: - equal: - - daily - - << pipeline.parameters.workflow >> - docs: - jobs: - - pretty-docs - when: - equal: - - docs - - << pipeline.parameters.workflow >> - merged: - jobs: - - pretty-docs - - build - - lint: - requires: - - build - - knip: - requires: - - build - - bench-packages: - requires: - - build - - check - - unit-tests: - requires: - - build - - stories-tests: - requires: - - build - - script-checks: - requires: - - build - - chromatic-internal-storybook: - requires: - - build - - coverage: - requires: - - unit-tests - - create-sandboxes: - parallelism: 17 - requires: - - build - - chromatic-sandboxes: - parallelism: 14 - requires: - - create-sandboxes - - e2e-production: - parallelism: 6 - requires: - - create-sandboxes - - e2e-dev: - parallelism: 12 - requires: - - create-sandboxes - - test-runner-production: - parallelism: 12 - requires: - - create-sandboxes - - vitest-integration: - parallelism: 5 - requires: - - create-sandboxes - - test-portable-stories: - matrix: - parameters: - directory: - - react - - vue3 - - nextjs - - svelte - requires: - - build - - e2e-ui: - requires: - - build - - test-init-features: - requires: - - build - when: - equal: - - merged - - << pipeline.parameters.workflow >> - normal: - jobs: - - pretty-docs - - build - - lint: - requires: - - build - - knip: - requires: - - build - - bench-packages: - requires: - - build - - check - - unit-tests: - requires: - - build - - stories-tests: - requires: - - build - - script-checks: - requires: - - build - - chromatic-internal-storybook: - requires: - - build - - coverage: - requires: - - unit-tests - - create-sandboxes: - parallelism: 13 - requires: - - build - - chromatic-sandboxes: - parallelism: 10 - requires: - - create-sandboxes - - e2e-production: - parallelism: 6 - requires: - - create-sandboxes - - e2e-dev: - parallelism: 8 - requires: - - create-sandboxes - - test-runner-production: - parallelism: 8 - requires: - - create-sandboxes - - vitest-integration: - parallelism: 5 - requires: - - create-sandboxes - - e2e-ui: - requires: - - build - - test-init-features: - requires: + - lint: + requires: + - build + - knip: + requires: + - build + - bench-packages: + requires: + - build + - check + - unit-tests: + requires: + - build + - stories-tests: + requires: + - build + - script-checks: + requires: + - build + - chromatic-internal-storybook: + requires: + - build + - create-sandboxes: + parallelism: 34 + requires: + - build + - chromatic-sandboxes: + parallelism: 31 + requires: + - create-sandboxes + - e2e-production: + parallelism: 7 + requires: + - create-sandboxes + - e2e-dev: + parallelism: 29 + requires: + - create-sandboxes + - test-runner-production: + parallelism: 29 + requires: + - create-sandboxes + - vitest-integration: + parallelism: 11 + requires: + - create-sandboxes + - test-portable-stories: + matrix: + parameters: + directory: + - react + - vue3 + - nextjs + - svelte + requires: + - build + - e2e-ui: + requires: + - build + - test-init-features: + requires: + - build + - test-init-empty: + matrix: + parameters: + packageManager: + - npm + template: + - react-vite-ts + - nextjs-ts + - vue-vite-ts + - lit-vite-ts + requires: + - build + when: + equal: + - daily + - << pipeline.parameters.workflow >> + docs: + jobs: + - pretty-docs + when: + equal: + - docs + - << pipeline.parameters.workflow >> + merged: + jobs: + - pretty-docs - build - - test-portable-stories: - matrix: - parameters: - directory: - - react - - vue3 - - nextjs - - svelte - requires: + - lint: + requires: + - build + - knip: + requires: + - build + - bench-packages: + requires: + - build + - check + - unit-tests: + requires: + - build + - stories-tests: + requires: + - build + - script-checks: + requires: + - build + - chromatic-internal-storybook: + requires: + - build + - coverage: + requires: + - unit-tests + - create-sandboxes: + parallelism: 19 + requires: + - build + - chromatic-sandboxes: + parallelism: 16 + requires: + - create-sandboxes + - e2e-production: + parallelism: 6 + requires: + - create-sandboxes + - e2e-dev: + parallelism: 14 + requires: + - create-sandboxes + - test-runner-production: + parallelism: 14 + requires: + - create-sandboxes + - vitest-integration: + parallelism: 6 + requires: + - create-sandboxes + - test-portable-stories: + matrix: + parameters: + directory: + - react + - vue3 + - nextjs + - svelte + requires: + - build + - e2e-ui: + requires: + - build + - test-init-features: + requires: + - build + when: + equal: + - merged + - << pipeline.parameters.workflow >> + normal: + jobs: + - pretty-docs - build - when: - equal: - - normal - - << pipeline.parameters.workflow >> + - lint: + requires: + - build + - knip: + requires: + - build + - bench-packages: + requires: + - build + - check + - unit-tests: + requires: + - build + - stories-tests: + requires: + - build + - script-checks: + requires: + - build + - chromatic-internal-storybook: + requires: + - build + - coverage: + requires: + - unit-tests + - create-sandboxes: + parallelism: 13 + requires: + - build + - chromatic-sandboxes: + parallelism: 10 + requires: + - create-sandboxes + - e2e-production: + parallelism: 6 + requires: + - create-sandboxes + - e2e-dev: + parallelism: 8 + requires: + - create-sandboxes + - test-runner-production: + parallelism: 8 + requires: + - create-sandboxes + - vitest-integration: + parallelism: 5 + requires: + - create-sandboxes + - e2e-ui: + requires: + - build + - test-init-features: + requires: + - build + - test-portable-stories: + matrix: + parameters: + directory: + - react + - vue3 + - nextjs + - svelte + requires: + - build + when: + equal: + - normal + - << pipeline.parameters.workflow >> + diff --git a/.circleci/src/jobs/stories-tests.yml b/.circleci/src/jobs/stories-tests.yml new file mode 100644 index 000000000000..588000bb34ae --- /dev/null +++ b/.circleci/src/jobs/stories-tests.yml @@ -0,0 +1,19 @@ +executor: + class: xlarge + name: sb_playwright +parallelism: 2 +steps: + - git-shallow-clone/checkout_advanced: + clone_options: --depth 1 --verbose + - attach_workspace: + at: . + - run: + command: | + cd code + TEST_FILES=$(circleci tests glob "**/*.{stories}.{ts,tsx,js,jsx,cjs}" | sed "/^e2e-tests\//d" | sed "/^node_modules\//d") + echo "$TEST_FILES" | circleci tests run --command="xargs yarn test --reporter=junit --reporter=default --outputFile=../test-results/junit-${CIRCLE_NODE_INDEX}.xml" --verbose + name: Run tests + - store_test_results: + path: test-results + - report-workflow-on-failure + - cancel-workflow-on-failure diff --git a/.circleci/src/workflows/daily.yml b/.circleci/src/workflows/daily.yml index a4048ab24a50..dd3d8594ace7 100644 --- a/.circleci/src/workflows/daily.yml +++ b/.circleci/src/workflows/daily.yml @@ -21,6 +21,9 @@ jobs: - unit-tests: requires: - build + - stories-tests: + requires: + - build - script-checks: requires: - build @@ -28,30 +31,30 @@ jobs: requires: - build - create-sandboxes: - parallelism: 30 + parallelism: 34 requires: - build # - smoke-test-sandboxes: # disabled for now # requires: # - create-sandboxes - chromatic-sandboxes: - parallelism: 27 + parallelism: 31 requires: - create-sandboxes - e2e-production: - parallelism: 25 + parallelism: 7 requires: - create-sandboxes - e2e-dev: - parallelism: 1 + parallelism: 29 requires: - create-sandboxes - test-runner-production: - parallelism: 25 + parallelism: 29 requires: - create-sandboxes - vitest-integration: - parallelism: 9 + parallelism: 11 requires: - create-sandboxes - test-portable-stories: diff --git a/.circleci/src/workflows/merged.yml b/.circleci/src/workflows/merged.yml index 587cb6414117..eb070d5f36f6 100644 --- a/.circleci/src/workflows/merged.yml +++ b/.circleci/src/workflows/merged.yml @@ -21,6 +21,9 @@ jobs: - unit-tests: requires: - build + - stories-tests: + requires: + - build - script-checks: requires: - build @@ -31,27 +34,27 @@ jobs: requires: - unit-tests - create-sandboxes: - parallelism: 17 + parallelism: 19 requires: - build - chromatic-sandboxes: - parallelism: 14 + parallelism: 16 requires: - create-sandboxes - e2e-production: - parallelism: 12 + parallelism: 6 requires: - create-sandboxes - e2e-dev: - parallelism: 1 + parallelism: 14 requires: - create-sandboxes - test-runner-production: - parallelism: 12 + parallelism: 14 requires: - create-sandboxes - vitest-integration: - parallelism: 5 + parallelism: 6 requires: - create-sandboxes - test-portable-stories: diff --git a/.circleci/src/workflows/normal.yml b/.circleci/src/workflows/normal.yml index b6e566bc67ff..9881c7ebb533 100644 --- a/.circleci/src/workflows/normal.yml +++ b/.circleci/src/workflows/normal.yml @@ -21,6 +21,9 @@ jobs: - unit-tests: requires: - build + - stories-tests: + requires: + - build - script-checks: requires: - build @@ -39,11 +42,11 @@ jobs: requires: - create-sandboxes - e2e-production: - parallelism: 8 + parallelism: 6 requires: - create-sandboxes - e2e-dev: - parallelism: 1 + parallelism: 8 requires: - create-sandboxes - test-runner-production: diff --git a/code/frameworks/nextjs-vite/package.json b/code/frameworks/nextjs-vite/package.json index 46ca778f7b30..7da12c8a2477 100644 --- a/code/frameworks/nextjs-vite/package.json +++ b/code/frameworks/nextjs-vite/package.json @@ -83,7 +83,7 @@ "@storybook/react": "workspace:*", "@storybook/react-vite": "workspace:*", "styled-jsx": "5.1.6", - "vite-plugin-storybook-nextjs": "^2.0.7" + "vite-plugin-storybook-nextjs": "2.1.0--canary.62.12de69e.0" }, "devDependencies": { "@types/node": "^22.0.0", diff --git a/code/lib/cli-storybook/src/sandbox-templates.ts b/code/lib/cli-storybook/src/sandbox-templates.ts index 8f04b42f074b..3c464f49f42b 100644 --- a/code/lib/cli-storybook/src/sandbox-templates.ts +++ b/code/lib/cli-storybook/src/sandbox-templates.ts @@ -177,6 +177,28 @@ export const baseTemplates = { }, skipTasks: ['e2e-tests', 'bench', 'vitest-integration'], }, + 'nextjs/15-ts': { + name: 'Next.js v15 (Webpack | TypeScript)', + script: + 'npx create-next-app@^15.5 {{beforeDir}} --eslint --tailwind --app --import-alias="@/*" --src-dir', + expected: { + framework: '@storybook/nextjs', + renderer: '@storybook/react', + builder: '@storybook/builder-webpack5', + }, + modifications: { + useCsfFactory: true, + mainConfig: { + features: { + experimentalRSC: true, + developmentModeForBuild: true, + experimentalTestSyntax: true, + }, + }, + extraDependencies: ['server-only', 'prop-types'], + }, + skipTasks: ['e2e-tests', 'bench', 'vitest-integration'], + }, 'nextjs/default-ts': { name: 'Next.js Latest (Webpack | TypeScript)', script: @@ -244,6 +266,29 @@ export const baseTemplates = { }, skipTasks: ['e2e-tests', 'bench'], }, + 'nextjs-vite/15-ts': { + name: 'Next.js v15 (Vite | TypeScript)', + script: + 'npx create-next-app@^15 {{beforeDir}} --eslint --tailwind --app --import-alias="@/*" --src-dir', + expected: { + framework: '@storybook/nextjs-vite', + renderer: '@storybook/react', + builder: '@storybook/builder-vite', + }, + modifications: { + useCsfFactory: true, + mainConfig: { + framework: '@storybook/nextjs-vite', + features: { + experimentalRSC: true, + developmentModeForBuild: true, + experimentalTestSyntax: true, + }, + }, + extraDependencies: ['server-only', '@storybook/nextjs-vite', 'vite', 'prop-types'], + }, + skipTasks: ['e2e-tests', 'bench'], + }, 'nextjs-vite/default-ts': { name: 'Next.js Latest (Vite | TypeScript)', script: @@ -851,6 +896,8 @@ export const merged: TemplateKey[] = [ ...normal, 'react-webpack/18-ts', 'react-webpack/17-ts', + 'nextjs/15-ts', + 'nextjs-vite/15-ts', 'preact-vite/default-ts', 'html-vite/default-ts', ]; @@ -863,6 +910,8 @@ export const daily: TemplateKey[] = [ 'react-vite/default-js', 'react-vite/prerelease-ts', 'react-webpack/prerelease-ts', + 'nextjs-vite/14-ts', + 'nextjs/14-ts', 'vue3-vite/default-js', 'lit-vite/default-js', 'svelte-vite/default-js', diff --git a/code/renderers/react/template/stories/test-fn.stories.tsx b/code/renderers/react/template/stories/test-fn.stories.tsx index dc0ceaddefee..8901edae6b00 100644 --- a/code/renderers/react/template/stories/test-fn.stories.tsx +++ b/code/renderers/react/template/stories/test-fn.stories.tsx @@ -4,7 +4,7 @@ import type { StoryContext } from '@storybook/react'; import { expect, fn } from 'storybook/test'; -import preview from '../../../../.storybook/preview'; +import preview from './preview'; const Button = (args: React.ComponentProps<'button'>) =>