playwright-cucumber-ts-steps 0.1.2 → 0.1.4

package/{dist → lib}/helpers/utils/index.js

@@ -17,3 +17,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./fakerUtils"), exports);
 __exportStar(require("./optionsUtils"), exports);
 __exportStar(require("./resolveUtils"), exports);
+__exportStar(require("./sessionUtils"), exports);

package/{dist → lib}/helpers/utils/optionsUtils.d.ts

@@ -16,4 +16,9 @@ export declare function parseFillOptions(table?: DataTable): Partial<FillOptions
 export declare function parseCheckOptions(table?: DataTable): Partial<CheckOptions>;
 export declare function parseUncheckOptions(table?: DataTable): Partial<UncheckOptions>;
 export declare function parseSelectOptions(table?: DataTable): Partial<SelectOptionOptions>;
+export declare function parseGenericOptions(table?: DataTable): Record<string, any>;
+export declare function parseExpectOptions(table?: DataTable): {
+    timeout?: number;
+    log?: boolean;
+};
 export {};

package/{dist → lib}/helpers/utils/optionsUtils.js

@@ -8,6 +8,8 @@ exports.parseFillOptions = parseFillOptions;
 exports.parseCheckOptions = parseCheckOptions;
 exports.parseUncheckOptions = parseUncheckOptions;
 exports.parseSelectOptions = parseSelectOptions;
+exports.parseGenericOptions = parseGenericOptions;
+exports.parseExpectOptions = parseExpectOptions;
 function parseClickOptions(table) {
     return parseGenericOptions(table);
 }
@@ -51,9 +53,7 @@ function parseGenericOptions(table) {
                 options[key] = value === "true";
                 break;
             case "modifiers":
-                options.modifiers = value
-                    .split(",")
-                    .map((v) => v.trim());
+                options.modifiers = value.split(",").map((v) => v.trim());
                 break;
             case "button":
                 if (["left", "middle", "right"].includes(value)) {
@@ -77,3 +77,12 @@ function parseGenericOptions(table) {
     }
     return options;
 }
+function parseExpectOptions(table) {
+    if (!table)
+        return {};
+    const obj = Object.fromEntries(table.rows());
+    return {
+        timeout: obj.timeout ? Number(obj.timeout) : undefined,
+        log: obj.log === "true",
+    };
+}

package/{dist → lib}/helpers/utils/resolveUtils.d.ts

@@ -2,3 +2,5 @@ import type { CustomWorld } from "../world";
 export declare function resolveValue(input: string): string;
 export declare function resolveLoginValue(raw: string, world: CustomWorld): string | undefined;
 export declare function deriveSessionName(emailOrUser: string, fallback?: string): string;
+export declare function resolveSessionPath(world: CustomWorld, name: string): string;
+export declare function normalizeDeviceName(name: string): string;

package/{dist → lib}/helpers/utils/resolveUtils.js

@@ -6,8 +6,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.resolveValue = resolveValue;
 exports.resolveLoginValue = resolveLoginValue;
 exports.deriveSessionName = deriveSessionName;
+exports.resolveSessionPath = resolveSessionPath;
+exports.normalizeDeviceName = normalizeDeviceName;
+// src/helpers/utils/resolveUtils.ts
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
+const test_1 = require("@playwright/test");
 // Dynamic resolver
 function resolveValue(input) {
     // Uppercase = environment variable (e.g. TEST_USER)
@@ -55,8 +59,14 @@ function resolveLoginValue(raw, world) {
 function deriveSessionName(emailOrUser, fallback = "default") {
     if (!emailOrUser)
         return `${fallback}User`;
-    const base = emailOrUser.includes("@")
-        ? emailOrUser.split("@")[0]
-        : emailOrUser;
+    const base = emailOrUser.includes("@") ? emailOrUser.split("@")[0] : emailOrUser;
     return `${base}User`;
 }
+function resolveSessionPath(world, name) {
+    const dir = path_1.default.resolve(world.data.artifactDir || "test-artifacts", "auth-cookies");
+    fs_1.default.mkdirSync(dir, { recursive: true });
+    return path_1.default.resolve(dir, name.endsWith(".json") ? name : `${name}.json`);
+}
+function normalizeDeviceName(name) {
+    return (Object.keys(test_1.devices).find((device) => device.toLowerCase().replace(/\s+/g, "") === name.toLowerCase().replace(/[-_\s]+/g, "")) || "");
+}

package/lib/helpers/utils/sessionUtils.d.ts

@@ -0,0 +1,3 @@
+import { BrowserContext } from "playwright";
+export declare function injectStorage(world: any, type: string, key: string, value: string): Promise<void>;
+export declare function saveSessionData(context: BrowserContext, file: string): Promise<void>;

package/lib/helpers/utils/sessionUtils.js

@@ -0,0 +1,40 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.injectStorage = injectStorage;
+exports.saveSessionData = saveSessionData;
+//sessionUtils.ts
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+async function injectStorage(world, type, key, value) {
+    const page = world.page;
+    if (type === "localStorage") {
+        await page.evaluate(([k, v]) => localStorage.setItem(k, v), [key, value]);
+    }
+    else if (type === "sessionStorage") {
+        await page.evaluate(([k, v]) => sessionStorage.setItem(k, v), [key, value]);
+    }
+    else if (type === "cookie") {
+        await page.context.addCookies([
+            {
+                name: key,
+                value,
+                domain: new URL(page.url()).hostname,
+                path: "/",
+                httpOnly: false,
+                secure: true,
+                sameSite: "Lax",
+            },
+        ]);
+    }
+}
+async function saveSessionData(context, file) {
+    const storageState = await context.storageState();
+    const outDir = "test-artifacts/auth-cookies";
+    const outPath = path_1.default.resolve(outDir, file);
+    fs_1.default.mkdirSync(outDir, { recursive: true });
+    fs_1.default.writeFileSync(outPath, JSON.stringify(storageState, null, 2));
+    console.log(`💾 Saved session to ${outPath}`);
+}

package/{dist → lib}/helpers/world.d.ts

@@ -1,5 +1,10 @@
 import { World, ITestCaseHookParameter } from "@cucumber/cucumber";
 import { Browser, Page, BrowserContext, Locator, FrameLocator } from "@playwright/test";
+export interface TestConfig {
+    enableScreenshots: boolean;
+    enableVisualTest: boolean;
+    artifactDir: string;
+}
 export declare class CustomWorld extends World {
     browser: Browser;
     context: BrowserContext;
@@ -10,8 +15,16 @@ export declare class CustomWorld extends World {
     data: Record<string, any>;
     logs: string[];
     testName?: string;
+    config: TestConfig;
     init(testInfo?: ITestCaseHookParameter): Promise<void>;
+    /**
+     * Returns the current interaction scope: either the main page or active frame.
+     */
     getScope(): Page | FrameLocator;
+    /**
+     * Returns a Locator scoped to the current iframe or page.
+     */
+    getLocator(selector: string): Locator;
     exitIframe(): void;
     log: (message: string) => void;
     cleanup(testInfo?: ITestCaseHookParameter): Promise<void>;

package/{dist → lib}/helpers/world.js

@@ -34,11 +34,10 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CustomWorld = void 0;
-// support/world.ts
 const cucumber_1 = require("@cucumber/cucumber");
 const test_1 = require("@playwright/test");
-const playwright_1 = require("playwright");
 const dotenv = __importStar(require("dotenv"));
+const playwright_1 = require("playwright");
 dotenv.config();
 const isHeadless = process.env.HEADLESS !== "false";
 const slowMo = process.env.SLOWMO ? Number(process.env.SLOWMO) : 0;
@@ -47,6 +46,11 @@ class CustomWorld extends cucumber_1.World {
         super(...arguments);
         this.data = {};
         this.logs = [];
+        this.config = {
+            enableScreenshots: true,
+            enableVisualTest: false,
+            artifactDir: "test-artifacts",
+        };
         this.log = (message) => {
             this.logs.push(message);
             console.log(`[LOG] ${message}`);
@@ -58,21 +62,30 @@ class CustomWorld extends cucumber_1.World {
         this.browser = await playwright_1.chromium.launch({ headless: isHeadless, slowMo });
         this.context = await this.browser.newContext({
             ...(device || {}),
-            recordVideo: { dir: "e2e/test-artifacts/videos" },
+            recordVideo: { dir: `${this.config.artifactDir}/videos` },
         });
         this.page = await this.context.newPage();
         this.testName = testInfo?.pickle.name;
         this.log(`🧪 Initialized context${isMobile ? " (mobile)" : ""}`);
     }
+    /**
+     * Returns the current interaction scope: either the main page or active frame.
+     */
     getScope() {
         return this.frame ?? this.page;
     }
+    /**
+     * Returns a Locator scoped to the current iframe or page.
+     */
+    getLocator(selector) {
+        return this.getScope().locator(selector);
+    }
     exitIframe() {
         this.frame = undefined;
         this.log("⬅️ Exited iframe, scope is now main page");
     }
     async cleanup(testInfo) {
-        const failed = testInfo?.result?.status === "FAILED";
+        testInfo?.result?.status === "FAILED";
         try {
             await this.page?.close();
         }
@@ -85,12 +98,6 @@ class CustomWorld extends cucumber_1.World {
         catch (err) {
             this.log(`⚠️ Error closing context: ${err.message}`);
         }
-        try {
-            await this.browser?.close();
-        }
-        catch (err) {
-            this.log(`⚠️ Error closing browser: ${err.message}`);
-        }
     }
 }
 exports.CustomWorld = CustomWorld;

package/lib/iframes/frames.d.ts

@@ -0,0 +1 @@
+export {};

package/{dist → lib}/index.d.ts

@@ -2,6 +2,7 @@ export * from "./actions/clickSteps";
 export * from "./actions/cookieSteps";
 export * from "./actions/debugSteps";
 export * from "./actions/elementFindSteps";
+export * from "./actions/fillFormSteps";
 export * from "./actions/inputSteps";
 export * from "./actions/interceptionSteps";
 export * from "./actions/miscSteps";
@@ -19,7 +20,6 @@ export * from "./assertions/semanticSteps";
 export * from "./assertions/storageSteps";
 export * from "./assertions/visualSteps";
 export * from "./iframes/frames";
-export * from "./custom_setups/globalLogin";
 export * from "./custom_setups/loginHooks";
 export * from "./helpers/compareSnapshots";
 export * from "./helpers/hooks";

package/{dist → lib}/index.js

@@ -19,6 +19,7 @@ __exportStar(require("./actions/clickSteps"), exports);
 __exportStar(require("./actions/cookieSteps"), exports);
 __exportStar(require("./actions/debugSteps"), exports);
 __exportStar(require("./actions/elementFindSteps"), exports);
+__exportStar(require("./actions/fillFormSteps"), exports);
 __exportStar(require("./actions/inputSteps"), exports);
 __exportStar(require("./actions/interceptionSteps"), exports);
 __exportStar(require("./actions/miscSteps"), exports);
@@ -39,7 +40,6 @@ __exportStar(require("./assertions/visualSteps"), exports);
 // Iframes
 __exportStar(require("./iframes/frames"), exports);
 // Setup (custom hooks, login, etc.)
-__exportStar(require("./custom_setups/globalLogin"), exports);
 __exportStar(require("./custom_setups/loginHooks"), exports);
 // Core helpers and utilities
 __exportStar(require("./helpers/compareSnapshots"), exports);

package/{dist → lib}/register.js

@@ -2,9 +2,5 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 // src/register.ts
 const checkPeerDeps_1 = require("./helpers/checkPeerDeps");
-(0, checkPeerDeps_1.checkPeerDependencies)([
-    "@cucumber/cucumber",
-    "@playwright/test",
-    "@faker-js/faker",
-]);
+(0, checkPeerDeps_1.checkPeerDependencies)(["@cucumber/cucumber", "@playwright/test", "@faker-js/faker"]);
 require("./index");

package/package.json

@@ -1,10 +1,13 @@
 {
   "name": "playwright-cucumber-ts-steps",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "A collection of reusable Playwright step definitions for Cucumber in TypeScript, designed to streamline end-to-end testing across web, API, and mobile applications.",
   "type": "commonjs",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
   "exports": {
     ".": {
       "import": "./dist/index.js"
@@ -22,7 +25,27 @@
     }
   },
   "scripts": {
-    "build": "tsc"
+    "build": "tsc",
+    "docs": "typedoc src",
+    "prepare": "husky",
+    "lint": "eslint . --ext .ts",
+    "lint:fix": "eslint . --ext .ts --fix",
+    "lint:tsc": "tsc --noEmit",
+    "format": "prettier --write .",
+    "clean": "rm -rf playwright/report",
+    "test": "npm run clean && cucumber-js --config playwright/config/cucumber.js",
+    "commitlint": "commitlint --edit"
+  },
+  "lint-staged": {
+    "*.{js,ts,tsx,json,md}": [
+      "eslint --fix",
+      "prettier --write"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
   },
   "repository": {
     "type": "git",
@@ -46,39 +69,38 @@
     "mobile",
     "visual-testing"
   ],
-  "author": "qaPaschalE",
+  "author": "qaPaschalE <paschal.enyimiri@gmail.com>",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/qaPaschalE/playwright-cucumber-ts-steps/issues"
   },
   "homepage": "https://github.com/qaPaschalE/playwright-cucumber-ts-steps#readme",
   "peerDependencies": {
-    "@cucumber/cucumber": "^11.3.0",
-    "@playwright/test": "^1.53.0",
-    "@faker-js/faker": "^9.8.0"
-  },
-  "peerDependenciesMeta": {
-    "@cucumber/cucumber": {
-      "optional": false
-    },
-    "@playwright/test": {
-      "optional": false
-    },
-    "@faker-js/faker": {
-      "optional": false
-    }
+    "@cucumber/cucumber": "*",
+    "@playwright/test": "*"
   },
-  "devDependencies": {
-    "@cucumber/cucumber": "^11.3.0",
+  "dependencies": {
+    "@cucumber/tag-expressions": "^6.2.0",
     "@faker-js/faker": "^9.8.0",
-    "@playwright/test": "^1.53.0",
-    "@types/pngjs": "^6.0.5",
     "dayjs": "^1.11.13",
     "dotenv-cli": "^8.0.0",
+    "glob": "^11.0.3",
     "parse": "^6.1.1",
     "pixelmatch": "^7.1.0",
-    "pngjs": "^7.0.0",
+    "pngjs": "^7.0.0"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^19.8.1",
+    "@commitlint/config-conventional": "^19.8.1",
+    "@types/pngjs": "^6.0.5",
+    "eslint": "^9.29.0",
+    "eslint-config-prettier": "^10.1.5",
+    "eslint-plugin-import": "^2.32.0",
+    "husky": "^9.1.7",
+    "lint-staged": "^16.1.2",
+    "prettier": "^3.5.3",
     "ts-node": "^10.9.2",
-    "typescript": "^5.8.3"
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.34.1"
   }
 }

package/dist/custom_setups/globalLogin.d.ts

@@ -1,2 +0,0 @@
-declare function globalSetup(): Promise<void>;
-export default globalSetup;

package/dist/custom_setups/globalLogin.js

@@ -1,25 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-// global-setup.ts
-const test_1 = require("@playwright/test");
-const path_1 = __importDefault(require("path"));
-async function globalSetup() {
-    const browser = await test_1.chromium.launch();
-    const page = await browser.newPage();
-    // Navigate to login and log in
-    await page.goto(process.env.PLAYWRIGHT_BASE_URL || "http://demoqa.com");
-    await page.getByPlaceholder("Email").fill("user@example.com");
-    await page.getByPlaceholder("Password").fill("SuperSecret123");
-    await page.getByRole("button", { name: "Login" }).click();
-    // Wait for navigation or some indicator that login is complete
-    await page.waitForURL("**/dashboard");
-    // Save session to file
-    await page
-        .context()
-        .storageState({ path: path_1.default.resolve(__dirname, "storageState.json") });
-    await browser.close();
-}
-exports.default = globalSetup;

package/dist/custom_setups/loginHooks.js

@@ -1,141 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-// e2e/step_definitions/auth/loginHooks.ts
-const cucumber_1 = require("@cucumber/cucumber");
-const test_1 = require("@playwright/test");
-const path_1 = __importDefault(require("path"));
-const resolveUtils_1 = require("../helpers/utils/resolveUtils");
-const fs_1 = __importDefault(require("fs"));
-const console_1 = require("console");
-async function tryRestoreSession(world, sessionName) {
-    const storagePath = path_1.default.resolve("e2e/support/helper/auth", `${sessionName}.json`);
-    if (fs_1.default.existsSync(storagePath)) {
-        await world.context?.addCookies([]);
-        await world.page.context().addInitScript(() => {
-            // preload logic if needed
-        });
-        await world.page.context().storageState({ path: storagePath });
-        world.log(`Session for ${sessionName} restored from file.`);
-        return true;
-    }
-    return false;
-}
-async function loginAndSaveSession(world, email, password, sessionName) {
-    const baseUrl = process.env.BASE_URL;
-    if (!baseUrl)
-        throw new Error("Missing BASE_URL in environment");
-    await pageLogin(world, baseUrl, email, password);
-    const sessionFile = path_1.default.resolve("e2e/support/helper/auth", `${sessionName}.json`);
-    await world.page.context().storageState({ path: sessionFile });
-    world.log(`Session saved to ${sessionFile}`);
-}
-const loginStep = async function (user, pass) {
-    const email = (0, resolveUtils_1.resolveValue)(user);
-    const password = (0, resolveUtils_1.resolveValue)(pass);
-    const sessionName = (0, resolveUtils_1.deriveSessionName)(email);
-    const restored = await tryRestoreSession(this, sessionName);
-    if (!restored) {
-        await loginAndSaveSession(this, email, password, sessionName);
-    }
-};
-(0, cucumber_1.When)("I am logged out", async function () {
-    const { page } = this;
-    await page.goto("/");
-    const url = page.url();
-    if (!url.includes("/login")) {
-        await page.locator("//div[@id=':rti:']//*[name()='svg']").last().click();
-        await page.getByText("Logout").click();
-        await (0, test_1.expect)(page.getByText("Log in")).toBeVisible();
-    }
-});
-(0, cucumber_1.When)("I login as a default user", async function () {
-    const baseUrl = process.env.BASE_URL;
-    const email = process.env.USER_EMAIL;
-    const password = process.env.USER_PASSWORD;
-    if (!baseUrl || !email || !password) {
-        console.warn("Missing base URL or credentials");
-        return;
-    }
-    await pageLogin(this, baseUrl, email, password);
-});
-(0, cucumber_1.When)("I login with user {string} and password {string}", loginStep);
-// Given("I login with user {string} and password {string}", loginStep);
-// Special alias step
-(0, cucumber_1.When)("I login as {string} user", async function (alias) {
-    const sessionFile = path_1.default.resolve("storage", `${alias}User.json`);
-    const email = process.env.USER_EMAIL;
-    const password = process.env.USER_PASSWORD;
-    const baseUrl = process.env.BASE_URL;
-    if (!email || !password) {
-        throw new Error("USER_EMAIL or USER_PASSWORD not set in .env");
-    }
-    if (fs_1.default.existsSync(sessionFile)) {
-        await this.context.addCookies([]); // optional reset
-        await this.context.addInitScript(() => { });
-        await this.context.storageState({ path: sessionFile });
-        this.log(`🗂️ Restored session from ${alias}User.json`);
-        // Wait for page to stabilize
-        await this.page.goto(baseUrl);
-        await this.page.waitForTimeout(1000);
-        const bodyText = await this.page.locator("body").innerText();
-        const url = this.page.url();
-        const looksLoggedOut = bodyText.match(/sign\s?in|login/i) || /login|signin/.test(url);
-        if (!looksLoggedOut) {
-            this.log("✅ Session is valid, no login required.");
-            return;
-        }
-        this.log("⚠️ Session appears invalid, re-logging in.");
-    }
-    // Perform login
-    await pageLogin(this, baseUrl, email, password);
-    await this.context.storageState({ path: sessionFile });
-    this.log(`💾 Saved session to ${alias}User.json`);
-});
-(0, cucumber_1.When)("I perform login with:", async function (dataTable) {
-    const loginData = Object.fromEntries(dataTable.raw());
-    const email = (0, resolveUtils_1.resolveLoginValue)(loginData.email, this);
-    const password = (0, resolveUtils_1.resolveLoginValue)(loginData.password, this) ?? process.env.USER_PASSWORD;
-    if (!email)
-        throw new Error("Missing or invalid email for login");
-    if (!password)
-        throw new Error("Missing or invalid password for login");
-    this.log?.(`🔐 Logging in with: ${email}`);
-    await this.page.goto(`${process.env.BASE_URL}/login`);
-    await this.page.waitForLoadState("networkidle");
-    await this.page.fill('input[type="email"]', email);
-    await this.page.fill('input[type="password"]', password);
-    const loginButton = this.page.getByRole("button", { name: /login/i });
-    await loginButton.click();
-    await this.page.waitForLoadState("networkidle");
-    this.log?.("✅ Login successful");
-});
-async function pageLogin(world, baseUrl, email, password) {
-    const { page } = world;
-    await page.goto(baseUrl);
-    await page.waitForLoadState("networkidle");
-    if (page.url().includes("/login")) {
-        await page.getByPlaceholder("email").fill(email);
-        await page.getByPlaceholder("password").fill(password);
-        await page.getByRole("button", { name: "Login" }).click();
-        await page.waitForLoadState("networkidle");
-        if (await page.getByText("Select an account").isVisible()) {
-            (0, console_1.log)("Login successful, navigating to accounts page");
-            await page.goto(`${baseUrl}/indicina`);
-        }
-        await (0, test_1.expect)(page.getByText("Total unique customers")).toBeVisible({
-            timeout: 10000,
-        });
-        // ✅ Save session after successful login
-        await page.context().storageState({
-            path: path_1.default.resolve("e2e/support/helper/auth", "session.json"),
-        });
-        world.data["loggedIn"] = true;
-        world.log?.("✅ Logged in and session saved.");
-    }
-    else {
-        console.log("Already logged in");
-    }
-}