[Draft] 🎀 Add login on demand depending on user permission 🎀

.changeset/brown-bobcats-end.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Implemented on-demand authentication for Playwright tests to mitigate rate-limiting issues. Authenticates only the admin user during initial setup and uses a helper function to authenticate other roles as needed within tests.

.eslintrc.json

@@ -105,5 +105,5 @@
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/no-unused-vars": "off"
   },
-  "ignorePatterns": ["node_modules/", "**/types/**/*", "type-policies.ts"]
+  "ignorePatterns": ["node_modules/", "**/types/**/*", "type-policies.ts", "playwright/auth.js"]
 }

.github/actions/run-pw-tests/action.yml

@@ -35,6 +35,12 @@ inputs:
     description: "Project name form playwright config"
     required: false
     default: "e2e"
+  ACCOUNTS:
+    description: "Accounts hash"
+    required: true
+  E2E_ENCODE_PASS:
+    description: "Accounts hash"
+    required: true
 
 runs:
   using: "composite"
@@ -47,6 +53,16 @@ runs:
       shell: bash
       run: npm ci
 
+    - name: Restore accounts
+      shell: bash
+      env:
+        E2E_ENCODE_PASS: ${{ inputs.E2E_ENCODE_PASS }}
+        ACCOUNTS: ${{ inputs.ACCOUNTS }}
+        API_URL: ${{ inputs.API_URL }}
+        BASE_URL: ${{ inputs.BASE_URL }}
+      run: |
+        node playwright/auth.js restore $ACCOUNTS
+
     - name: Install Playwright Browsers
       shell: bash
       run: npx playwright install --with-deps

.github/workflows/pr-automation.yml

@@ -71,6 +71,8 @@ jobs:
 
   deploy-dashboard:
     if: github.event.pull_request.head.repo.full_name == 'saleor/saleor-dashboard'
+    outputs:
+      ACCOUNTS: ${{ steps.accounts.outputs.ACCOUNTS }}
     runs-on: ubuntu-22.04
     needs: initialize-cloud
     permissions:
@@ -150,6 +152,18 @@ jobs:
           env_url: ${{ needs.initialize-cloud.outputs.BASE_URL }}
           deployment_id: ${{ steps.deployment.outputs.deployment_id }}
           env: ${{ needs.initialize-cloud.outputs.POOL_NAME }}
+      - name: Prepare accounts
+        id: accounts
+        env:
+          BASE_URL: ${{ needs.initialize-cloud.outputs.BASE_URL }}
+          API_URL: ${{ needs.initialize-cloud.outputs.API_URL }}
+          E2E_USER_NAME: ${{ secrets.E2E_USER_NAME }}
+          E2E_USER_PASSWORD: ${{ secrets.E2E_USER_PASSWORD }}
+          E2E_ENCODE_PASS: ${{ secrets.E2E_ENCODE_PASS }}
+          E2E_PERMISSIONS_USERS_PASSWORD: ${{ secrets.E2E_PERMISSIONS_USERS_PASSWORD }}
+        run: |
+          ACCOUNTS=$(node playwright/auth.js login)
+          echo "ACCOUNTS=${ACCOUNTS}" >> "$GITHUB_OUTPUT"
 
   run-tests:
     if: ${{ contains(github.event.pull_request.labels.*.name, 'run pw-e2e') }}
@@ -159,6 +173,7 @@ jobs:
       fail-fast: false
       matrix:
         shard: ${{ fromJson(needs.initialize-cloud.outputs.SHARD_MATRIX) }}
+
     steps:
       - uses: actions/checkout@v4
 
@@ -174,6 +189,8 @@ jobs:
           MAILPITURL: ${{ secrets.MAILPITURL }}
           PW_WORKERS: ${{ vars.PW_WORKERS }}
           PW_RETRIES: ${{ vars.PW_RETRIES }}
+          ACCOUNTS: ${{ needs.deploy-dashboard.outputs.ACCOUNTS }}
+          E2E_ENCODE_PASS: ${{ secrets.E2E_ENCODE_PASS }}
 
   merge-reports:
     if: "!cancelled() && contains(github.event.pull_request.labels.*.name, 'run pw-e2e')"

package.json

@@ -107,6 +107,7 @@
     "zod": "^3.22.4"
   },
   "devDependencies": {
+    "@actions/core": "^1.10.1",
     "@changesets/changelog-github": "^0.4.8",
     "@changesets/cli": "^2.26.1",
     "@editorjs/embed": "^2.5.3",
@@ -307,6 +308,7 @@
     "qa:artifact-move-screenshots": "find cypress/reports/*/mochareports -type d -name \"*.js\" -exec mv {} cypress/reports/mochareports \\;",
     "qa:artifact-move-videos": "find cypress/reports/*/mochareports/videos -type f -name \"*.js.mp4\" -exec mv {} cypress/reports/mochareports/videos \\;",
     "qa:pw-e2e": "npx playwright test --grep @e2e",
+    "qa:pw-ci-setup": "npx playwright test --grep @setup",
     "qa:pw-ui": "npx playwright test --ui"
   },
   "description": "![Saleor Dashboard](https://user-images.githubusercontent.com/44495184/185379472-2a204c0b-9b7a-4a3e-93c0-2cb85205ed5e.png)"

playwright.config.ts

@@ -18,21 +18,21 @@ export default defineConfig({
   workers: parseInt(env.WORKERS || DEFAULT_WORKERS),
   reporter: process.env.CI
     ? [
-        ["blob"],
-        ["github"],
-        [
-          "playwright-testmo-reporter",
-          {
-            outputFile: "testmo/testmo.xml", // Optional: Output file path. Defaults to 'testmo.xml'.
-            embedBrowserType: true, // Optional: Embed browser type in the XML file. Defaults to false.
-            embedTestSteps: true, // Optional: Embed test steps in the XML file. Defaults to true.
-            testStepCategories: ["hook", "expect", "pw:api", "test.step"], // Optional: Test step categories to include in the XML file. Defaults to ["hook","expect","pw:api","test.step"]. Possible options are "hook", "expect", "pw:api", "test.step".
-            testTitleDepth: 1, // Optional: Test case title depth to report in the XML file. Defaults to 1. Increase this to 2 include suite name. Increase this even further to include the path.
-            attachmentBasePathCallback: () =>
-              process.env.URL_TO_RUN ? process.env.URL_TO_RUN : "",
-          },
-        ],
-      ]
+      ["blob"],
+      ["github"],
+      [
+        "playwright-testmo-reporter",
+        {
+          outputFile: "testmo/testmo.xml", // Optional: Output file path. Defaults to 'testmo.xml'.
+          embedBrowserType: true, // Optional: Embed browser type in the XML file. Defaults to false.
+          embedTestSteps: true, // Optional: Embed test steps in the XML file. Defaults to true.
+          testStepCategories: ["hook", "expect", "pw:api", "test.step"], // Optional: Test step categories to include in the XML file. Defaults to ["hook","expect","pw:api","test.step"]. Possible options are "hook", "expect", "pw:api", "test.step".
+          testTitleDepth: 1, // Optional: Test case title depth to report in the XML file. Defaults to 1. Increase this to 2 include suite name. Increase this even further to include the path.
+          attachmentBasePathCallback: () =>
+            process.env.URL_TO_RUN ? process.env.URL_TO_RUN : "",
+        },
+      ],
+    ]
     : [["html"], ["list"]],
   expect: { timeout: 10 * 1000 },
   maxFailures: 10,

playwright/api/basics.ts

@@ -1,3 +1,4 @@
+import * as core from "@actions/core";
 import { APIRequestContext } from "@playwright/test";
 
 interface User {
@@ -34,22 +35,34 @@ export class BasicApiService {
 
   async logInUserViaApi(user: User): Promise<ApiResponse<TokenCreateResponse>> {
     const query = `mutation TokenAuth{
-            tokenCreate(email: "${user.email}", password: "${user.password}") {
-                token
-                refreshToken
-                errors: errors {
-                    code
-                    message
-                }
-                user {
-                    id
-                }
-            }
-        }`;
+        tokenCreate(email: "${user.email}", password: "${user.password}") {
+          token
+          refreshToken
+          errors: errors {
+            code
+            message
+          }
+          user {
+            id
+          }
+        }
+      }`;
+
+    core.info(`Executing login request at: ${new Date().toISOString()}`);
+
     const loginResponse = await this.request.post(process.env.API_URL || "", {
       data: { query },
     });
-    const loginResponseJson = await loginResponse.json();
+
+    const loginResponseJson: { data: TokenCreateResponse } = await loginResponse.json();
+
+    if (loginResponseJson.data.tokenCreate.errors?.length > 0) {
+      const errorMessages = loginResponseJson.data.tokenCreate.errors
+        .map(e => e.message)
+        .join(", ");
+
+      throw new Error(`Login failed: ${errorMessages}`);
+    }
 
     return loginResponseJson as ApiResponse<TokenCreateResponse>;
   }