Merge pull request #784 from storyblok/chore/new-standard

chore: pnpm workspaces and granular CI

.github/ISSUE_TEMPLATE/config.yml

@@ -1 +1 @@
-blank_issues_enabled: false
+blank_issues_enabled: false

.github/ISSUE_TEMPLATE/issue.bug.yml

@@ -1,4 +1,4 @@
-name: "\U0001F41E SDK Bug Report"
+name: 🐞 SDK Bug Report
 description: Report an issue using Vue 3 Storyblok SDK
 labels: [pending-triage, pending-author]
 body:
@@ -11,7 +11,7 @@ body:
     attributes:
       label: Describe the issue you're facing
       description: A clear and concise description of what the bug is. If you intend to submit a PR for this issue, tell us in the description so we can review it. Thanks in advance!
-      placeholder: My Vue 3 Storyblok SDK configuration is ... ## Expected behavior ... ## Current Behavior ...
+      placeholder: My Vue 3 Storyblok SDK configuration is ... # # Expected behavior ... ## Current Behavior ...
     validations:
       required: true
   - type: input

.github/ISSUE_TEMPLATE/issue.fr.yml

@@ -1,4 +1,4 @@
-name: "\U0001F58C SDK Feature Request"
+name: 🖌 SDK Feature Request
 description: Propose a feature or improvement that the Storyblok SDK should have
 labels: [enhancement, pending-triage, pending-author]
 body:
@@ -10,15 +10,15 @@ body:
     id: feature-description
     attributes:
       label: Description
-      description: "Clear and concise description of what you want to include or enhance from the SDK. Please make the reason and usecases as detailed as possible. If you intend to submit a PR for this feature request, tell us in the description so we can review and be aware of it. Thanks in advance!"
+      description: 'Clear and concise description of what you want to include or enhance from the SDK. Please make the reason and usecases as detailed as possible. If you intend to submit a PR for this feature request, tell us in the description so we can review and be aware of it. Thanks in advance!'
       placeholder: As a developer using Storyblok SDK I want [wish] so that [benefit].
     validations:
       required: true
   - type: textarea
     id: suggested-solution
     attributes:
       label: Suggested solution or improvement
-      description: "Link to the PR or what implementation you will expect from us (links to external examples if needed)."
+      description: Link to the PR or what implementation you will expect from us (links to external examples if needed).
     validations:
       required: true
   - type: textarea

.github/dependabot.yml

@@ -1,31 +1,31 @@
 version: 2
 updates:
-  - package-ecosystem: "npm"
-    directory: "/"
+  - package-ecosystem: npm
+    directory: /
     schedule:
-      interval: "daily"
-      time: "04:00"
+      interval: daily
+      time: '04:00'
     commit-message:
       prefix: fix
       prefix-development: chore
       include: scope
     groups:
       linting-dx-tools:
         patterns:
-          - "*lint*" # eslint, eslint-*, vue-eslint-parser, lint-staged, @commitlint/*, @typescript-eslint/*
-          - "prettier"
-          - "husky"
-          - "@vue/tsconfig"
-          - "*babel*" # babel-*, @vue/babel-preset-app, @babel/*
+          - '*lint*' # eslint, eslint-*, vue-eslint-parser, lint-staged, @commitlint/*, @typescript-eslint/*
+          - prettier
+          - husky
+          - '@vue/tsconfig'
+          - '*babel*' # babel-*, @vue/babel-preset-app, @babel/*
         update-types:
-          - "minor"
-          - "patch"
+          - minor
+          - patch
       testing-tools:
         patterns:
-          - "cypress"
-          - "@cypress/*"
-          - "@vue/test-utils"
-          - "*jest*" # jest, babel-jest, @vue/vue3-jest
+          - cypress
+          - '@cypress/*'
+          - '@vue/test-utils'
+          - '*jest*' # jest, babel-jest, @vue/vue3-jest
         update-types:
-          - "minor"
-          - "patch"
+          - minor
+          - patch

.github/workflows/commitlint.yml

@@ -0,0 +1,31 @@
+name: CI
+
+on: [push, pull_request]
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  SKIP_INSTALL_SIMPLE_GIT_HOOKS: 1 # Skip installing simple-git-hooks
+
+jobs:
+  commitlint:
+    runs-on: ubuntu-24.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+      - name: Install dependencies
+        run: pnpm install
+      - name: Validate current commit (last commit) with commitlint
+        if: github.event_name == 'push'
+        run: pnpm commitlint --last --verbose
+      - name: Validate PR commits with commitlint
+        if: github.event_name == 'pull_request'
+        run: pnpm commitlint --from ${{ github.event.pull_request.base.sha }} --to ${{ github.event.pull_request.head.sha }} --verbose

.github/workflows/dependabot-automerge.yml

@@ -18,11 +18,11 @@ jobs:
         id: metadata
         uses: dependabot/[email protected]
         with:
-          github-token: "${{ secrets.GITHUB_TOKEN }}"
+          github-token: '${{ secrets.GITHUB_TOKEN }}'
       - name: Enable auto-merge for Dependabot PRs
         if: ${{contains(steps.metadata.outputs.dependency-names, env.DEPENDENCY) && (steps.metadata.outputs.update-type == 'version-update:semver-patch' || steps.metadata.outputs.update-type == 'version-update:semver-minor')}}
         run: gh pr merge --auto --merge "$PR_URL"
         env:
-          DEPENDENCY: "@storyblok/js"
+          DEPENDENCY: '@storyblok/js'
           PR_URL: ${{github.event.pull_request.html_url}}
           GITHUB_TOKEN: ${{secrets.DEPENDABOT_TOKEN}}

.github/workflows/lint.yml

@@ -0,0 +1,28 @@
+name: Run linters
+on: [push]
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  SKIP_INSTALL_SIMPLE_GIT_HOOKS: 1 # Skip installing simple-git-hooks
+
+jobs:
+  lint:
+    name: Lint
+    runs-on: ubuntu-24.04
+    strategy:
+      matrix:
+        node-version: [20]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+      - name: Install dependencies
+        run: pnpm install
+      - name: Run Lint
+        run: pnpm run lint

.github/workflows/pkg.pr.new.yml

@@ -0,0 +1,38 @@
+name: Publish Any Commit
+on:
+  push:
+    branches:
+      - '**'
+    tags:
+      - '!**'
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  HUSKY: 0 # Bypass husky commit hook for CI
+
+permissions: {}
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.number }}
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-24.04
+    strategy:
+      matrix:
+        node-version: [20]
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - run: corepack enable
+      - uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+      - name: Install dependencies
+        run: pnpm install
+      - name: Build
+        run: pnpm build
+      - run: pnpx pkg-pr-new publish --compact --pnpm

.github/workflows/release.yml

@@ -9,25 +9,25 @@ on:
 jobs:
   release:
     runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [20]
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
-      - name: Setup Node
-        uses: actions/setup-node@v3
+        uses: actions/checkout@v4
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
         with:
-          node-version: "18"
-          cache: "npm"
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
       - name: Install dependencies
-        run: npm ci
+        run: pnpm install
       - name: Build lib
-        run: npm run build
-      - name: Jest run
-        run: npm run test:unit
-      - name: Cypress run
-        run: npm run test:e2e
+        run: pnpm build
       - name: Release
-        working-directory: lib
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-        run: npx semantic-release@18
+        run: pnpx semantic-release

.github/workflows/test.yml

@@ -0,0 +1,50 @@
+name: Run tests
+
+on: [push]
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  SKIP_INSTALL_SIMPLE_GIT_HOOKS: 1 # Skip installing simple-git-hooks
+
+jobs:
+  tests:
+    runs-on: ubuntu-24.04
+    strategy:
+      matrix:
+        node-version: [20]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+
+      - name: Cache Cypress binary
+        uses: actions/cache@v4
+        with:
+          path: ~/.cache/Cypress
+          key: cypress-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build Library
+        run: pnpm build
+
+      - name: Cypress run
+        run: pnpm run test
+
+      - name: Upload Cypress artifacts
+        if: failure()
+        uses: actions/upload-artifact@v4
+        with:
+          name: cypress-artifacts
+          path: |
+            cypress/screenshots
+            cypress/videos

cypress.config.ts

@@ -0,0 +1,36 @@
+import { defineConfig } from 'cypress';
+import vue from '@vitejs/plugin-vue';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __filename = fileURLToPath(import.meta.url); // get the resolved path to the file
+const __dirname = dirname(__filename); // get the name of the directory
+
+export default defineConfig({
+  component: {
+    devServer: {
+      framework: 'vue',
+      bundler: 'vite',
+      viteConfig: {
+        plugins: [vue()],
+        resolve: {
+          alias: {
+            '@storyblok/vue': resolve(__dirname, './src/index.ts'),
+          },
+        },
+        /* server: {
+          fs: {
+            allow: [
+              join(__dirname, '..', 'playground/vue'),
+              'cypress/testing-components',
+            ],
+          },
+        }, */
+      },
+    },
+  },
+
+  e2e: {
+
+  },
+});