chore: migrate to pnpm (#245)

migrate to release-please
reduce complexity of generateScreenshotPath
reduce complexity of getConfig fn
prepare directory structure for more examples
prepare codeclimate configuration for monorepo

.eslintrc.js

@@ -18,7 +18,7 @@ module.exports = {
       parser: "@typescript-eslint/parser",
       parserOptions: {
         sourceType: "module",
-        project: ["./tsconfig.json", "./example/tsconfig.json"],
+        project: ["./packages/cypress-plugin-visual-regression-diff/tsconfig.json", "./examples/webpack/tsconfig.json"],
         tsconfigRootDir: __dirname,
         warnOnUnsupportedTypeScriptVersion: false,
         EXPERIMENTAL_useSourceOfProjectReferenceRedirect: true,

.github/workflows/ci.yml

@@ -11,176 +11,111 @@ jobs:
   cache:
     name: CI cache
     runs-on: ubuntu-latest
-    outputs:
-      yarn-cache-key: ${{ steps.yarn-cache-key.outputs.key }}
     steps:
       - uses: actions/checkout@v3
+      - uses: pnpm/[email protected]
       - uses: actions/setup-node@v3
         with:
           node-version: "18.x"
-      - name: Remove git auth
-        run: git config --unset http.https://github.com/.extraheader
-      - name: Generate yarn cache-key
-        id: yarn-cache-key
-        run: echo "::set-output name=key::${{ runner.os }}-yarn-ci-cache-v3-${{ hashFiles('./yarn.lock') }}-${{ hashFiles('**/yarn.lock') }}"
-      - name: Configure Yarn cache
-        uses: actions/cache@v3
-        with:
-          key: ${{ steps.yarn-cache-key.outputs.key }}
-          path: |
-            ~/.cache/Cypress
-            .yarn
-            node_modules
-            example/node_modules
-      - name: Install dependencies
-        if: ${{ github.actor != 'dependabot[bot]' || github.ref == 'refs/heads/main' }}
-        run: yarn --immutable
-      - name: Reset yarn.lock (due to dependabot incompatibility with yarn 3)
-        if: ${{ github.actor == 'dependabot[bot]' && github.ref != 'refs/heads/main' }}
-        run: "git checkout HEAD~1 yarn.lock"
-      - name: Install dependencies & update yarn.lock (dependabot)
-        if: ${{ github.actor == 'dependabot[bot]' && github.ref != 'refs/heads/main' }}
-        run: "yarn install && git stage yarn.lock && git commit -m 'chore: update yarn.lock' && git push"
-        env:
-          YARN_ENABLE_IMMUTABLE_INSTALLS: false
+          cache: 'pnpm'
+      - run: pnpm install
 
   lint:
     name: lint
     runs-on: ubuntu-latest
     needs: cache
     steps:
       - uses: actions/checkout@v3
+      - uses: pnpm/[email protected]
       - uses: actions/setup-node@v3
         with:
           node-version: "18.x"
-      - name: remove git auth
-        run: git config --unset http.https://github.com/.extraheader
-      - name: Configure Yarn cache
-        uses: actions/cache@v3
-        with:
-          key: ${{ needs.cache.outputs.yarn-cache-key }}
-          path: |
-            ~/.cache/Cypress
-            .yarn
-            node_modules
-            example/node_modules
-      - name: Install dependencies
-        run: yarn --immutable
-      - name: Lint
-        run: yarn lint:ci
-      - name: Prettify
-        run: yarn prettify:ci
+          cache: 'pnpm'
+      - run: pnpm install
+      - run: pnpm lint:ci
+      - run: pnpm format:ci
 
   test:
     name: test
     runs-on: ubuntu-latest
     needs: cache
     steps:
       - uses: actions/checkout@v3
+      - uses: pnpm/[email protected]
       - uses: actions/setup-node@v3
         with:
           node-version: "18.x"
-      - name: remove git auth
-        run: git config --unset http.https://github.com/.extraheader
-      - name: Configure Yarn cache
-        uses: actions/cache@v3
-        with:
-          key: ${{ needs.cache.outputs.yarn-cache-key }}
-          path: |
-            ~/.cache/Cypress
-            .yarn
-            node_modules
-            example/node_modules
-      - name: Install dependencies
-        run: yarn --immutable
-      - name: Build plugin
-        run: yarn build
-      - name: Install example dependencies
-        run: cd example && yarn --immutable
+          cache: 'pnpm'
+      - run: pnpm install && cd ./examples/webpack && pnpm cypress install
+      - run: pnpm --filter cypress-plugin-visual-regression-diff -r build
       - name: Test e2e
-        run: yarn test:e2e:ci
+        run: pnpm test:e2e:ci
       - name: Test component-testing
-        run: yarn test:ct:ci
+        run: pnpm test:ct:ci
 
   test-integration-coverage:
     name: test-integration-coverage
     runs-on: ubuntu-latest
     needs: cache
     steps:
       - uses: actions/checkout@v3
+      - uses: pnpm/[email protected]
       - uses: actions/setup-node@v3
         with:
           node-version: "18.x"
-      - name: remove git auth
-        run: git config --unset http.https://github.com/.extraheader
-      - name: Configure Yarn cache
-        uses: actions/cache@v3
-        with:
-          key: ${{ needs.cache.outputs.yarn-cache-key }}
-          path: |
-            ~/.cache/Cypress
-            .yarn
-            node_modules
-            example/node_modules
-      - name: Install dependencies
-        run: yarn --immutable
+          cache: 'pnpm'
+      - run: pnpm install
       - name: Test integration (with coverage) and upload to CodeClimate
         if: ${{ github.ref == 'refs/heads/main' }}
         uses: paambaati/[email protected]
         env:
           CC_TEST_REPORTER_ID: ${{ secrets.CC_TEST_REPORTER_ID }}
         with:
           debug: true
-          coverageCommand: yarn test:integration:ci
+          coverageCommand: pnpm test:integration:ci
           coverageLocations: |
-            ${{github.workspace}}/coverage/lcov.info:lcov
+            ${{github.workspace}}/packages/*/coverage/lcov.info:lcov
       - name: Test integration (with coverage)
         if: ${{ github.ref != 'refs/heads/main' }}
-        run: yarn test:integration:ci
+        run: pnpm test:integration:ci
 
-  build-and-release:
-    name: build and release
+  prepare-release:
+    name: detect changes, bump package versions, generate changelog and commit it to main branch
     runs-on: ubuntu-latest
     needs: [cache, lint, test, test-integration-coverage]
     if: ${{ github.actor != 'dependabot[bot]' && github.ref == 'refs/heads/main' && github.event_name == 'push' }}
+    permissions:
+      contents: write
+      pull-requests: write
+    outputs:
+      releases_created: ${{ steps.release.outputs.releases_created }}
     steps:
-      - uses: actions/checkout@v3
+      - uses: google-github-actions/[email protected]
+        id: release
         with:
-          # pulls all commits (needed for lerna / semantic release to correctly version)
-          fetch-depth: "0"
-      - name: Setup git user
-        run: |
-          git config --global user.name "$(git --no-pager log --format=format:'%an' -n 1)"
-          git config --global user.email "$(git --no-pager log --format=format:'%ae' -n 1)"
+          command: manifest
+          default-branch: main
+
+  build-and-release:
+    name: build and release
+    runs-on: ubuntu-latest
+    needs: prepare-release
+    if: needs.prepare-release.outputs.releases_created
+    steps:
+      - uses: actions/checkout@v3
+      - uses: pnpm/[email protected]
       - uses: actions/setup-node@v3
         with:
           node-version: "18.x"
-      - name: remove git auth
-        run: git config --unset http.https://github.com/.extraheader
-      - name: Configure Yarn cache
-        uses: actions/cache@v3
-        with:
-          key: ${{ needs.cache.outputs.yarn-cache-key }}
-          path: |
-            ~/.cache/Cypress
-            .yarn
-            node_modules
-            example/node_modules
-      - name: Install dependencies
-        run: yarn --immutable
-      - name: Authenticate with Registry
-        run: |
-          yarn npm logout
-          echo "registry=http://registry.npmjs.org/" >> .npmrc
-          echo "//registry.npmjs.org/:_authToken=$NPM_TOKEN" >> .npmrc
-          npm whoami
-        env:
+          cache: 'pnpm'
+          registry-url: 'https://registry.npmjs.org'
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-      - name: release package
-        if: ${{ success() }}
-        run: yarn release:ci
+      - run: pnpm install
+      - name: Build packages to get cross-references working 🔧
+        run: pnpm build
+      - name: Release package
+        run: pnpm release:ci
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-          NPM_CONFIG_REGISTRY: https://registry.npmjs.org/
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.release-please-manifest.json

@@ -0,0 +1,3 @@
+{
+  "packages/cypress-plugin-visual-regression-diff": "3.3.9"
+}

CONTRIBUTING.md

@@ -22,7 +22,7 @@ Don’t hesitate to ask a question directly on the [discussions board](https://g
 
 - Checkout the master branch and (after you do your work) file a PR against it
 
-- Read through the [development setup](#development-setup) to learn how to work with this project. Always make sure that `yarn lint`, `yarn build` and `yarn test` pass
+- Read through the [development setup](#development-setup) to learn how to work with this project. Always make sure that `pnpm lint`, `pnpm build` and `pnpm test` pass
 
 - Please use [conventional commits v1.0.0 style guide](https://www.conventionalcommits.org/en/v1.0.0/) for commits and PR names
 
@@ -42,15 +42,15 @@ Don’t hesitate to ask a question directly on the [discussions board](https://g
 
 <!-- textlint-disable spelling -->
 
-You will need [Node.js](https://nodejs.org/en/) **version 16+** and [yarn](https://yarnpkg.com/getting-started/install).
+You will need [Node.js](https://nodejs.org/en/) **version 16+** and [pnpm](https://pnpm.io/installation).
 
 <!-- textlint-enable -->
 
 After cloning the repository, run:
 
 ```bash
-yarn i # installs the project dependencies
-cd example && yarn i # install dependencies for example project (useful for testing)
+pnpm i # installs the project dependencies
+cd examples/webpack && pnpm i # install dependencies for example project (useful for testing)
 ```
 
 ### Committing Changes
@@ -63,30 +63,30 @@ When fired in the project root they will run corresponding actions in every nest
 
 ```bash
 # build the project for NPM and example usage
-$ yarn build
+$ pnpm build
 
 # run tests once
-$ yarn test
+$ pnpm test
 
 # open cypress component runner from example directory
-# requires plugin to be built first via `yarn build`
-$ yarn test:ct
+# requires plugin to be built first via `pnpm build`
+$ pnpm test:ct
 
 # open cypress e2e runner from example directory
-# requires plugin to be built first via `yarn build`
-$ yarn test:e2e
+# requires plugin to be built first via `pnpm build`
+$ pnpm test:e2e
 
 # run integration tests once and collect coverage
-$ yarn test:integration:coverage
+$ pnpm test:integration:coverage
 
 # run integration tests in watch mode
-$ yarn test:integration:watch
+$ pnpm test:integration:watch
 
 # lint & try to autofix linting errors
-$ yarn fix:lint && yarn prettify
+$ pnpm fix:lint && pnpm format
 
 # lint files
-$ yarn lint && yarn prettify:ci
+$ pnpm lint && pnpm format:ci
 ```
 
 There are some other scripts available in the `scripts` section of the `package.json` file.

README.md

@@ -61,11 +61,14 @@
 You can install this library using your favorite package manager:
 
 ```bash
+# npm
+npm install --save-dev @frsource/cypress-plugin-visual-regression-diff
+
 # yarn
 yarn add -D @frsource/cypress-plugin-visual-regression-diff
 
-# npm
-npm install --save-dev @frsource/cypress-plugin-visual-regression-diff
+# pnpm
+pnpm add -D @frsource/cypress-plugin-visual-regression-diff
 ```
 
 Next, you need to import the library:
@@ -150,7 +153,7 @@ cy.matchImage();
 
 ## Example
 
-Still got troubles with installation? Have a look at [example directory of this repo](./example) to see how this plugin can be used in e2e or component-testing Cypress environment within your project.
+Still got troubles with installation? Have a look at [examples directory of this repo](./examples) to see how this plugin can be used in e2e or component-testing Cypress environment within your project.
 
 ## Automatic clean up of unused images