@esimplicity/stack-tests 0.1.3 → 0.1.6

package/README.md

@@ -1,4 +1,4 @@
-# @kata/stack-tests
+# @esimplicity/stack-tests
 
 Reusable Playwright-BDD fixtures, ports, adapters, and step registrations for API, UI, and hybrid testing. Designed to be consumed as a dev dependency across repos.
 
@@ -9,13 +9,13 @@ GitHub Packages (recommended for release builds):
 ```bash
 npm config set @kata:registry https://npm.pkg.github.com
 npm set //npm.pkg.github.com/:_authToken=YOUR_GITHUB_TOKEN
-npm install -D @kata/stack-tests @playwright/test playwright-bdd
+npm install -D @esimplicity/stack-tests @playwright/test playwright-bdd
 ```
 
 Workspace/local development (from this monorepo):
 
 ```bash
-bun add -d @kata/stack-tests@"file:../packages/stack-tests" @playwright/test playwright-bdd
+bun add -d @esimplicity/stack-tests@"file:../packages/stack-tests" @playwright/test playwright-bdd
 ```
 
 ## What’s included
@@ -37,7 +37,7 @@ import {
   PlaywrightUiAdapter,
   UniversalAuthAdapter,
   DefaultCleanupAdapter,
-} from '@kata/stack-tests';
+} from '@esimplicity/stack-tests';
 
 export const test = createBddTest({
   createApi: ({ apiRequest }) => new PlaywrightApiAdapter(apiRequest),
@@ -51,7 +51,7 @@ export const test = createBddTest({
 ```ts
 // features/steps/steps_api/index.ts
 import { test } from '../fixtures';
-import { registerApiSteps } from '@kata/stack-tests/steps';
+import { registerApiSteps } from '@esimplicity/stack-tests/steps';
 registerApiSteps(test);
 ```
 

package/dist/{chunk-73J5FNGG.js → chunk-VWBEMXYC.js}

@@ -206,10 +206,106 @@ function registerSharedVarSteps(test) {
   });
 }
 
-// src/steps/ui.basic.ts
+// src/steps/shared.flags.ts
 import { createBdd as createBdd7 } from "playwright-bdd";
+var globalFlags = {};
+function isFlagEnabled(world, flagName) {
+  const worldFlags = world._featureFlags || {};
+  if (flagName in worldFlags) {
+    return worldFlags[flagName];
+  }
+  return globalFlags[flagName] ?? false;
+}
+function setFlag(world, flagName, enabled) {
+  if (!world._featureFlags) {
+    world._featureFlags = {};
+  }
+  world._featureFlags[flagName] = enabled;
+  world.vars[`flag_${flagName}`] = String(enabled);
+}
+function registerFlagSteps(test) {
+  const { Given, Then } = createBdd7(test);
+  Given(
+    "the feature flag {string} is enabled",
+    async ({ world }, flagName) => {
+      setFlag(world, flagName, true);
+      console.log(`[BDD] Feature flag "${flagName}" enabled`);
+    }
+  );
+  Given(
+    "the feature flag {string} is disabled",
+    async ({ world }, flagName) => {
+      setFlag(world, flagName, false);
+      console.log(`[BDD] Feature flag "${flagName}" disabled`);
+    }
+  );
+  Given(
+    "the feature flag {string} is set to {string}",
+    async ({ world }, flagName, value) => {
+      const enabled = value.toLowerCase() === "true" || value === "1";
+      setFlag(world, flagName, enabled);
+      console.log(`[BDD] Feature flag "${flagName}" set to ${enabled}`);
+    }
+  );
+  Given(
+    "the following feature flags are enabled:",
+    async ({ world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1) || [];
+      for (const row of rows) {
+        const flagName = row.flag || row[0];
+        setFlag(world, flagName, true);
+        console.log(`[BDD] Feature flag "${flagName}" enabled`);
+      }
+    }
+  );
+  Given(
+    "the following feature flags are disabled:",
+    async ({ world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1) || [];
+      for (const row of rows) {
+        const flagName = row.flag || row[0];
+        setFlag(world, flagName, false);
+        console.log(`[BDD] Feature flag "${flagName}" disabled`);
+      }
+    }
+  );
+  Then(
+    "the feature flag {string} should be enabled",
+    async ({ world }, flagName) => {
+      const enabled = isFlagEnabled(world, flagName);
+      if (!enabled) {
+        throw new Error(`Expected feature flag "${flagName}" to be enabled, but it was disabled`);
+      }
+    }
+  );
+  Then(
+    "the feature flag {string} should be disabled",
+    async ({ world }, flagName) => {
+      const enabled = isFlagEnabled(world, flagName);
+      if (enabled) {
+        throw new Error(`Expected feature flag "${flagName}" to be disabled, but it was enabled`);
+      }
+    }
+  );
+  Then(
+    "I log all feature flags",
+    async ({ world }) => {
+      const worldFlags = world._featureFlags || {};
+      console.log("[DEBUG] Feature flags:");
+      for (const [name, enabled] of Object.entries(worldFlags)) {
+        console.log(`  - ${name}: ${enabled ? "enabled" : "disabled"}`);
+      }
+      if (Object.keys(worldFlags).length === 0) {
+        console.log("  (no flags set)");
+      }
+    }
+  );
+}
+
+// src/steps/ui.basic.ts
+import { createBdd as createBdd8 } from "playwright-bdd";
 function registerUiBasicSteps(test) {
-  const { Given, When, Then } = createBdd7(test);
+  const { Given, When, Then } = createBdd8(test);
   Given("I navigate to {string}", { tags: "@ui or @hybrid" }, async ({ ui, world }, path) => {
     await ui.goto(interpolate(path, world.vars));
   });
@@ -240,7 +336,7 @@ function registerUiBasicSteps(test) {
 }
 
 // src/steps/ui.wizard.ts
-import { createBdd as createBdd8 } from "playwright-bdd";
+import { createBdd as createBdd9 } from "playwright-bdd";
 function resolveValue(input, world) {
   const interpolated = interpolate(input, world.vars);
   if (interpolated === input && world.vars[input] !== void 0) {
@@ -338,7 +434,7 @@ function parseRegex(input) {
   return new RegExp(raw);
 }
 function registerWizardSteps(test) {
-  const { Given, When, Then } = createBdd8(test);
+  const { Given, When, Then } = createBdd9(test);
   Given("I open {string} page", { tags: "@ui or @hybrid" }, async ({ ui, world }, urlOrVar) => {
     await ui.goto(resolveValue(urlOrVar, world));
   });
@@ -510,10 +606,596 @@ function registerWizardSteps(test) {
   );
 }
 
+// src/steps/ui.form.ts
+import { createBdd as createBdd10 } from "playwright-bdd";
+function registerFormSteps(test) {
+  const { Given, When } = createBdd10(test);
+  When(
+    "I fill the form:",
+    { tags: "@ui or @hybrid" },
+    async ({ ui, world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1).map((row) => ({
+        field: row[0],
+        value: row[1]
+      })) || [];
+      for (const row of rows) {
+        const field = interpolate(row.field, world.vars);
+        const value = interpolate(row.value, world.vars);
+        await ui.fillLabel(field, value);
+      }
+    }
+  );
+  When(
+    "I fill the form with {string} locators:",
+    { tags: "@ui or @hybrid" },
+    async ({ ui, world }, locatorMethod, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1).map((row) => ({
+        field: row[0],
+        value: row[1]
+      })) || [];
+      for (const row of rows) {
+        const field = interpolate(row.field, world.vars);
+        const value = interpolate(row.value, world.vars);
+        await ui.inputInElement("fill", value, "1", field, locatorMethod);
+      }
+    }
+  );
+  When(
+    "I fill and submit the form:",
+    { tags: "@ui or @hybrid" },
+    async ({ ui, world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1).map((row) => ({
+        field: row[0],
+        value: row[1]
+      })) || [];
+      for (const row of rows) {
+        const field = interpolate(row.field, world.vars);
+        const value = interpolate(row.value, world.vars);
+        await ui.fillLabel(field, value);
+      }
+      await ui.pressKey("Enter");
+    }
+  );
+  Given(
+    "I clear and fill the form:",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1).map((row) => ({
+        field: row[0],
+        value: row[1]
+      })) || [];
+      for (const row of rows) {
+        const field = interpolate(row.field, world.vars);
+        const value = interpolate(row.value, world.vars);
+        const locator = page.getByLabel(field);
+        await locator.clear();
+        await locator.fill(value);
+      }
+    }
+  );
+}
+
+// src/steps/ui.debug.ts
+import { createBdd as createBdd11 } from "playwright-bdd";
+function registerDebugSteps(test) {
+  const { When, Then } = createBdd11(test);
+  When(
+    "I capture the page HTML as {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, varName) => {
+      const content = await page.content();
+      world.vars[varName] = content;
+    }
+  );
+  Then(
+    "I log the current URL",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      console.log(`[DEBUG] Current URL: ${page.url()}`);
+    }
+  );
+  Then(
+    "I log the page title",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const title = await page.title();
+      console.log(`[DEBUG] Page title: ${title}`);
+    }
+  );
+  When(
+    "I save a screenshot as {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, filename) => {
+      const resolvedFilename = interpolate(filename, world.vars);
+      await page.screenshot({ path: resolvedFilename });
+      console.log(`[DEBUG] Screenshot saved: ${resolvedFilename}`);
+    }
+  );
+  When(
+    "I save a full page screenshot as {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, filename) => {
+      const resolvedFilename = interpolate(filename, world.vars);
+      await page.screenshot({ path: resolvedFilename, fullPage: true });
+      console.log(`[DEBUG] Full page screenshot saved: ${resolvedFilename}`);
+    }
+  );
+  When(
+    "I pause for debugging",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      console.log('[DEBUG] Pausing for debugging. Press "Resume" in Playwright Inspector to continue.');
+      await page.pause();
+    }
+  );
+  Then(
+    "I print visible text",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const text = await page.innerText("body");
+      const truncated = text.length > 2e3 ? `${text.substring(0, 2e3)}...(truncated)` : text;
+      console.log(`[DEBUG] Visible text:
+${truncated}`);
+    }
+  );
+  Then(
+    "I count elements matching {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, selector) => {
+      const resolvedSelector = interpolate(selector, world.vars);
+      const count = await page.locator(resolvedSelector).count();
+      console.log(`[DEBUG] Found ${count} elements matching "${resolvedSelector}"`);
+    }
+  );
+  Then(
+    "I print browser console messages",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      console.log("[DEBUG] Browser console messages will be captured from this point.");
+      page.on("console", (msg) => {
+        console.log(`[BROWSER ${msg.type().toUpperCase()}] ${msg.text()}`);
+      });
+    }
+  );
+  When(
+    "I capture viewport size",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }) => {
+      const viewport = page.viewportSize();
+      if (viewport) {
+        world.vars.viewportWidth = String(viewport.width);
+        world.vars.viewportHeight = String(viewport.height);
+        console.log(`[DEBUG] Viewport size: ${viewport.width}x${viewport.height}`);
+      } else {
+        console.log("[DEBUG] Viewport size not available");
+      }
+    }
+  );
+  Then(
+    "I log all cookies",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const context = page.context();
+      const cookies = await context.cookies();
+      console.log(`[DEBUG] Cookies (${cookies.length}):`);
+      for (const cookie of cookies) {
+        console.log(`  - ${cookie.name}: ${cookie.value.substring(0, 50)}${cookie.value.length > 50 ? "..." : ""}`);
+      }
+    }
+  );
+  Then(
+    "I log localStorage",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const storage = await page.evaluate(() => {
+        const items = {};
+        for (let i = 0; i < localStorage.length; i++) {
+          const key = localStorage.key(i);
+          if (key) {
+            items[key] = localStorage.getItem(key) || "";
+          }
+        }
+        return items;
+      });
+      console.log("[DEBUG] localStorage:");
+      for (const [key, value] of Object.entries(storage)) {
+        const truncated = value.length > 100 ? `${value.substring(0, 100)}...` : value;
+        console.log(`  - ${key}: ${truncated}`);
+      }
+    }
+  );
+  When(
+    "I highlight element {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, selector) => {
+      const resolvedSelector = interpolate(selector, world.vars);
+      await page.evaluate((sel) => {
+        const elements = document.querySelectorAll(sel);
+        elements.forEach((el) => {
+          el.style.outline = "3px solid red";
+          el.style.outlineOffset = "2px";
+        });
+      }, resolvedSelector);
+      console.log(`[DEBUG] Highlighted ${await page.locator(resolvedSelector).count()} element(s) matching "${resolvedSelector}"`);
+    }
+  );
+}
+
+// src/steps/ui.layout.ts
+import { expect as expect3 } from "@playwright/test";
+import { createBdd as createBdd12 } from "playwright-bdd";
+function registerLayoutSteps(test) {
+  const { Given, When, Then } = createBdd12(test);
+  Then(
+    "I should see the {string} panel",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, panelName) => {
+      const resolvedName = interpolate(panelName, world.vars);
+      const panel = page.getByTestId(`${resolvedName}-panel`);
+      await expect3(panel).toBeVisible();
+    }
+  );
+  Then(
+    "I should not see the {string} panel",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, panelName) => {
+      const resolvedName = interpolate(panelName, world.vars);
+      const panel = page.getByTestId(`${resolvedName}-panel`);
+      await expect3(panel).toBeHidden();
+    }
+  );
+  Then(
+    "the {string} panel should be {string}",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, panelName, state) => {
+      const resolvedName = interpolate(panelName, world.vars);
+      const panel = page.getByTestId(`${resolvedName}-panel`);
+      if (state === "visible") {
+        await expect3(panel).toBeVisible();
+      } else if (state === "hidden") {
+        await expect3(panel).toBeHidden();
+      } else {
+        throw new Error(`Unknown panel state: ${state}. Expected 'visible' or 'hidden'.`);
+      }
+    }
+  );
+  Then(
+    "the {string} panel should be full width",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, panelName) => {
+      const resolvedName = interpolate(panelName, world.vars);
+      const panel = page.getByTestId(`${resolvedName}-panel`);
+      const isFullWidth = await panel.evaluate((el) => {
+        return !el.classList.contains("split") && !el.classList.contains("narrow") && !el.classList.contains("split-view-list");
+      });
+      expect3(isFullWidth, `Expected "${resolvedName}" panel to be full width`).toBe(true);
+    }
+  );
+  Then(
+    "the {string} panel should be narrow",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, panelName) => {
+      const resolvedName = interpolate(panelName, world.vars);
+      const panel = page.getByTestId(`${resolvedName}-panel`);
+      const isNarrow = await panel.evaluate((el) => {
+        return el.classList.contains("split") || el.classList.contains("narrow") || el.classList.contains("split-view-list");
+      });
+      expect3(isNarrow, `Expected "${resolvedName}" panel to be narrow`).toBe(true);
+    }
+  );
+  Then(
+    "I should see a split view layout",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const splitContainer = page.locator("[data-testid='split-view'], .split-view, [data-split-view]");
+      await expect3(splitContainer.first()).toBeVisible();
+    }
+  );
+  Then(
+    "I should not see a split view layout",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const splitContainer = page.locator("[data-testid='split-view'], .split-view, [data-split-view]");
+      const count = await splitContainer.count();
+      expect3(count === 0 || !await splitContainer.first().isVisible()).toBe(true);
+    }
+  );
+  Then(
+    "the sidebar should be visible",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const sidebar = page.locator("[data-testid='sidebar'], aside, nav.sidebar, .sidebar");
+      await expect3(sidebar.first()).toBeVisible();
+    }
+  );
+  Then(
+    "the sidebar should be hidden",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const sidebar = page.locator("[data-testid='sidebar'], aside.sidebar, nav.sidebar");
+      const count = await sidebar.count();
+      if (count > 0) {
+        await expect3(sidebar.first()).toBeHidden();
+      }
+    }
+  );
+  Then(
+    "the sidebar should be collapsed",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const sidebar = page.locator("[data-testid='sidebar'], aside, nav.sidebar, .sidebar").first();
+      const isCollapsed = await sidebar.evaluate((el) => {
+        return el.classList.contains("collapsed") || el.classList.contains("minimized") || el.getAttribute("data-collapsed") === "true";
+      });
+      expect3(isCollapsed, "Expected sidebar to be collapsed").toBe(true);
+    }
+  );
+  Then(
+    "I should see a modal dialog",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const modal = page.locator("[role='dialog'], [data-testid='modal'], .modal, [aria-modal='true']");
+      await expect3(modal.first()).toBeVisible();
+    }
+  );
+  Then(
+    "I should not see a modal dialog",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const modal = page.locator("[role='dialog'], [data-testid='modal'], .modal, [aria-modal='true']");
+      const count = await modal.count();
+      if (count > 0) {
+        await expect3(modal.first()).toBeHidden();
+      }
+    }
+  );
+  Then(
+    "I should see the {string} modal",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, modalName) => {
+      const resolvedName = interpolate(modalName, world.vars);
+      const modal = page.getByTestId(`${resolvedName}-modal`);
+      await expect3(modal).toBeVisible();
+    }
+  );
+  Given(
+    "the viewport is {string} size",
+    { tags: "@ui or @hybrid" },
+    async ({ page }, sizeName) => {
+      const sizes = {
+        mobile: { width: 375, height: 667 },
+        tablet: { width: 768, height: 1024 },
+        desktop: { width: 1280, height: 800 },
+        "large-desktop": { width: 1920, height: 1080 }
+      };
+      const size = sizes[sizeName.toLowerCase()];
+      if (!size) {
+        throw new Error(`Unknown viewport size: ${sizeName}. Available: ${Object.keys(sizes).join(", ")}`);
+      }
+      await page.setViewportSize(size);
+    }
+  );
+  Given(
+    "the viewport is {int}x{int}",
+    { tags: "@ui or @hybrid" },
+    async ({ page }, width, height) => {
+      await page.setViewportSize({ width, height });
+    }
+  );
+  Then(
+    "the layout should be responsive",
+    { tags: "@ui or @hybrid" },
+    async ({ page }) => {
+      const original = page.viewportSize();
+      await page.setViewportSize({ width: 375, height: 667 });
+      await page.waitForTimeout(100);
+      await page.setViewportSize({ width: 1280, height: 800 });
+      await page.waitForTimeout(100);
+      if (original) {
+        await page.setViewportSize(original);
+      }
+    }
+  );
+  Then(
+    "the {string} tab should be active",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, tabName) => {
+      const resolvedName = interpolate(tabName, world.vars);
+      const tab = page.getByRole("tab", { name: resolvedName });
+      await expect3(tab).toHaveAttribute("aria-selected", "true");
+    }
+  );
+  Then(
+    "the {string} tab should not be active",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, tabName) => {
+      const resolvedName = interpolate(tabName, world.vars);
+      const tab = page.getByRole("tab", { name: resolvedName });
+      await expect3(tab).toHaveAttribute("aria-selected", "false");
+    }
+  );
+  When(
+    "I click the {string} tab",
+    { tags: "@ui or @hybrid" },
+    async ({ page, world }, tabName) => {
+      const resolvedName = interpolate(tabName, world.vars);
+      const tab = page.getByRole("tab", { name: resolvedName });
+      await tab.click();
+    }
+  );
+}
+
+// src/steps/ui.auth.ts
+import { createBdd as createBdd13 } from "playwright-bdd";
+
+// src/adapters/ui/fetch-intercept-auth.adapter.ts
+var defaultBypassConfig = {
+  urlPattern: "/api/",
+  headers: {
+    "x-user-id": (data) => data.userId,
+    "x-tenant-id": (data) => data.tenantId || "",
+    "x-user-roles": (data) => data.roles.join(",")
+  },
+  localStorageKey: "mockAuth"
+};
+var defaultBearerConfig = {
+  urlPattern: "/api/",
+  headers: {
+    Authorization: (data) => `Bearer ${data.token || ""}`
+  }
+};
+async function setupFetchIntercept(page, authData, config = defaultBypassConfig) {
+  const staticHeaders = {};
+  for (const [key, value] of Object.entries(config.headers)) {
+    staticHeaders[key] = typeof value === "function" ? value(authData) : value;
+  }
+  const headers = {};
+  for (const [key, value] of Object.entries(staticHeaders)) {
+    if (value) {
+      headers[key] = value;
+    }
+  }
+  const urlPattern = config.urlPattern instanceof RegExp ? config.urlPattern.source : config.urlPattern || "";
+  await page.addInitScript(
+    (params) => {
+      if (params.localStorageKey) {
+        localStorage.setItem(params.localStorageKey, JSON.stringify(params.authData));
+      }
+      const originalFetch = window.fetch;
+      window.fetch = function(input, init) {
+        const url = typeof input === "string" ? input : input instanceof URL ? input.href : input.url;
+        const shouldIntercept = !params.urlPattern || url.includes(params.urlPattern);
+        if (shouldIntercept) {
+          const modifiedInit = init || {};
+          modifiedInit.headers = {
+            ...modifiedInit.headers || {},
+            ...params.headers
+          };
+          return originalFetch.call(this, input, modifiedInit);
+        }
+        return originalFetch.call(this, input, init);
+      };
+    },
+    { authData, headers, urlPattern, localStorageKey: config.localStorageKey }
+  );
+}
+async function clearFetchIntercept(page) {
+  await page.reload();
+}
+async function setupBypassAuth(page, userId, roles, tenantId) {
+  await setupFetchIntercept(page, { userId, roles, tenantId }, defaultBypassConfig);
+}
+async function setupBearerAuth(page, token) {
+  await setupFetchIntercept(
+    page,
+    { userId: "", roles: [], token },
+    defaultBearerConfig
+  );
+}
+
+// src/steps/ui.auth.ts
+function registerUiAuthSteps(test) {
+  const { Given } = createBdd13(test);
+  Given(
+    "I am authenticated in UI as {string}",
+    { tags: "@ui" },
+    async ({ page, world }, rolesStr) => {
+      const roles = rolesStr.split(",").map((r) => r.trim());
+      const testRunId = world.testRunId || world.vars.test_run_id || Date.now();
+      const userId = `test-user-${testRunId}`;
+      const isAdmin = roles.includes("admin");
+      const tenantId = isAdmin ? void 0 : "org-a";
+      await setupBypassAuth(page, userId, roles, tenantId);
+      world.vars.currentUserId = userId;
+      world.vars.currentRoles = roles.join(",");
+      if (tenantId) {
+        world.vars.currentTenantId = tenantId;
+      }
+      console.log(`[BDD] UI authenticated as ${roles.join(", ")} (user: ${userId})`);
+    }
+  );
+  Given(
+    "I am authenticated in UI as {string} for tenant {string}",
+    { tags: "@ui" },
+    async ({ page, world }, rolesStr, tenantId) => {
+      const roles = rolesStr.split(",").map((r) => r.trim());
+      const testRunId = world.testRunId || world.vars.test_run_id || Date.now();
+      const userId = `test-user-${testRunId}`;
+      const resolvedTenantId = interpolate(tenantId, world.vars);
+      await setupBypassAuth(page, userId, roles, resolvedTenantId);
+      world.vars.currentUserId = userId;
+      world.vars.currentTenantId = resolvedTenantId;
+      world.vars.currentRoles = roles.join(",");
+      console.log(`[BDD] UI authenticated as ${roles.join(", ")} for tenant ${resolvedTenantId}`);
+    }
+  );
+  Given(
+    "I am authenticated in UI as {string} with id {string}",
+    { tags: "@ui" },
+    async ({ page, world }, rolesStr, userId) => {
+      const roles = rolesStr.split(",").map((r) => r.trim());
+      const resolvedUserId = interpolate(userId, world.vars);
+      const tenantId = "org-a";
+      await setupBypassAuth(page, resolvedUserId, roles, tenantId);
+      world.vars.currentUserId = resolvedUserId;
+      world.vars.currentTenantId = tenantId;
+      world.vars.currentRoles = roles.join(",");
+      console.log(`[BDD] UI authenticated as ${roles.join(", ")} with id ${resolvedUserId}`);
+    }
+  );
+  Given(
+    "I am authenticated in UI with bearer token {string}",
+    { tags: "@ui" },
+    async ({ page, world }, token) => {
+      const resolvedToken = interpolate(token, world.vars);
+      await setupBearerAuth(page, resolvedToken);
+      console.log("[BDD] UI authenticated with bearer token");
+    }
+  );
+  Given(
+    "I am authenticated in UI with headers:",
+    { tags: "@ui" },
+    async ({ page, world }, dataTable) => {
+      const rows = dataTable.hashes ? dataTable.hashes() : dataTable.rawTable?.slice(1).map((row) => ({
+        header: row[0],
+        value: row[1]
+      })) || [];
+      const headers = {};
+      for (const row of rows) {
+        headers[row.header] = interpolate(row.value, world.vars);
+      }
+      await setupFetchIntercept(
+        page,
+        { userId: headers["x-user-id"] || "", roles: (headers["x-user-roles"] || "").split(","), tenantId: headers["x-tenant-id"] },
+        {
+          urlPattern: "/api/",
+          headers,
+          localStorageKey: "mockAuth"
+        }
+      );
+      console.log(`[BDD] UI authenticated with custom headers: ${Object.keys(headers).join(", ")}`);
+    }
+  );
+  Given(
+    "I switch UI user to {string} with id {string}",
+    { tags: "@ui" },
+    async ({ page, world }, rolesStr, userId) => {
+      const roles = rolesStr.split(",").map((r) => r.trim());
+      const resolvedUserId = interpolate(userId, world.vars);
+      const tenantId = world.vars.currentTenantId || "org-a";
+      await page.reload();
+      await setupBypassAuth(page, resolvedUserId, roles, tenantId);
+      world.vars.currentUserId = resolvedUserId;
+      world.vars.currentRoles = roles.join(",");
+      console.log(`[BDD] UI switched to user ${resolvedUserId} with roles ${roles.join(", ")}`);
+    }
+  );
+}
+
 // src/steps/tui.basic.ts
-import { createBdd as createBdd9 } from "playwright-bdd";
+import { createBdd as createBdd14 } from "playwright-bdd";
 function registerTuiBasicSteps(test) {
-  const { Given, When, Then } = createBdd9(test);
+  const { Given, When, Then } = createBdd14(test);
   Given("I start the TUI application", { tags: "@tui" }, async ({ tui }) => {
     await tui.start();
     await tui.waitForReady();
@@ -634,9 +1316,9 @@ ${result.diff || "No diff available"}`);
 }
 
 // src/steps/tui.wizard.ts
-import { createBdd as createBdd10 } from "playwright-bdd";
+import { createBdd as createBdd15 } from "playwright-bdd";
 function registerTuiWizardSteps(test) {
-  const { Given, When, Then } = createBdd10(test);
+  const { Given, When, Then } = createBdd15(test);
   When("I navigate down {int} times", { tags: "@tui" }, async ({ tui }, times) => {
     for (let i = 0; i < times; i++) {
       await tui.pressKey("down");
@@ -789,10 +1471,15 @@ function registerApiSteps(test) {
 function registerUiSteps(test) {
   registerUiBasicSteps(test);
   registerWizardSteps(test);
+  registerFormSteps(test);
+  registerDebugSteps(test);
+  registerLayoutSteps(test);
+  registerUiAuthSteps(test);
 }
 function registerSharedSteps(test) {
   registerSharedVarSteps(test);
   registerSharedCleanupSteps(test);
+  registerFlagSteps(test);
 }
 function registerHybridSuite(test) {
   registerHybridSteps(test);
@@ -801,6 +1488,13 @@ function registerTuiSteps(test) {
   registerTuiBasicSteps(test);
   registerTuiWizardSteps(test);
 }
+function registerAllSteps(test) {
+  registerApiSteps(test);
+  registerUiSteps(test);
+  registerTuiSteps(test);
+  registerSharedSteps(test);
+  registerHybridSuite(test);
+}
 
 export {
   interpolate,
@@ -809,19 +1503,33 @@ export {
   parseExpected,
   assertMasked,
   registerCleanup,
+  defaultBypassConfig,
+  defaultBearerConfig,
+  setupFetchIntercept,
+  clearFetchIntercept,
+  setupBypassAuth,
+  setupBearerAuth,
   registerApiHttpSteps,
   registerApiAssertionSteps,
   registerApiAuthSteps,
   registerHybridSteps,
   registerSharedCleanupSteps,
   registerSharedVarSteps,
+  isFlagEnabled,
+  setFlag,
+  registerFlagSteps,
   registerUiBasicSteps,
   registerWizardSteps,
+  registerFormSteps,
+  registerDebugSteps,
+  registerLayoutSteps,
+  registerUiAuthSteps,
   registerTuiBasicSteps,
   registerTuiWizardSteps,
   registerApiSteps,
   registerUiSteps,
   registerSharedSteps,
   registerHybridSuite,
-  registerTuiSteps
+  registerTuiSteps,
+  registerAllSteps
 };

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as playwright_bdd from 'playwright-bdd';
 export { test as baseTest } from 'playwright-bdd';
 import * as _playwright_test from '@playwright/test';
 import { APIResponse, PlaywrightTestArgs, PlaywrightWorkerArgs, APIRequestContext, Page } from '@playwright/test';
-export { registerApiAssertionSteps, registerApiAuthSteps, registerApiHttpSteps, registerApiSteps, registerHybridSteps, registerHybridSuite, registerSharedCleanupSteps, registerSharedSteps, registerSharedVarSteps, registerTuiBasicSteps, registerTuiSteps, registerTuiWizardSteps, registerUiBasicSteps, registerUiSteps, registerWizardSteps } from './steps/index.js';
+export { isFlagEnabled, registerAllSteps, registerApiAssertionSteps, registerApiAuthSteps, registerApiHttpSteps, registerApiSteps, registerDebugSteps, registerFlagSteps, registerFormSteps, registerHybridSteps, registerHybridSuite, registerLayoutSteps, registerSharedCleanupSteps, registerSharedSteps, registerSharedVarSteps, registerTuiBasicSteps, registerTuiSteps, registerTuiWizardSteps, registerUiAuthSteps, registerUiBasicSteps, registerUiSteps, registerWizardSteps, setFlag } from './steps/index.js';
 
 type CleanupItem = {
     method: 'DELETE' | 'POST' | 'PATCH' | 'PUT';
@@ -529,6 +529,64 @@ declare class TuiTesterAdapter implements TuiPort {
     getConfig(): TuiConfig;
 }
 
+/**
+ * Fetch Intercept Auth Adapter
+ *
+ * Provides UI authentication by intercepting fetch requests and injecting headers.
+ * Useful for testing UIs that communicate with APIs using fetch.
+ */
+
+interface FetchInterceptAuthData {
+    userId: string;
+    tenantId?: string;
+    roles: string[];
+    token?: string;
+}
+interface FetchInterceptConfig {
+    /**
+     * URL pattern to match for header injection.
+     * If not provided, headers are added to all fetch requests.
+     */
+    urlPattern?: string | RegExp;
+    /**
+     * Headers to inject. Can be static values or functions that receive auth data.
+     */
+    headers: Record<string, string | ((data: FetchInterceptAuthData) => string)>;
+    /**
+     * Key in localStorage to store auth data for UI components to read.
+     */
+    localStorageKey?: string;
+}
+/**
+ * Default configuration for bypass auth mode.
+ */
+declare const defaultBypassConfig: FetchInterceptConfig;
+/**
+ * Default configuration for bearer token auth.
+ */
+declare const defaultBearerConfig: FetchInterceptConfig;
+/**
+ * Set up fetch interception on a page.
+ *
+ * @param page - Playwright page
+ * @param authData - Authentication data to inject
+ * @param config - Configuration for interception
+ */
+declare function setupFetchIntercept(page: Page, authData: FetchInterceptAuthData, config?: FetchInterceptConfig): Promise<void>;
+/**
+ * Clear fetch interception setup (by reloading the page).
+ * Note: There's no clean way to remove addInitScript, so we reload.
+ */
+declare function clearFetchIntercept(page: Page): Promise<void>;
+/**
+ * Helper to set up bypass auth for a page.
+ */
+declare function setupBypassAuth(page: Page, userId: string, roles: string[], tenantId?: string): Promise<void>;
+/**
+ * Helper to set up bearer token auth for a page.
+ */
+declare function setupBearerAuth(page: Page, token: string): Promise<void>;
+
 type TagsForProjectInput = {
     projectTag: string;
     extraTags?: string;
@@ -537,4 +595,4 @@ type TagsForProjectInput = {
 declare function tagsForProject({ projectTag, extraTags, defaultExcludes }: TagsForProjectInput): string;
 declare function resolveExtraTags(raw?: string | null): string | undefined;
 
-export { type ApiMethod, type ApiPort, type ApiResult, type AuthPort, type CleanupItem, type CleanupPort, type CleanupRule, type CreateBddTestOptions, DefaultCleanupAdapter, PlaywrightApiAdapter, PlaywrightUiAdapter, type TuiConfig, type TuiFactory, type TuiKeyModifiers, type TuiMouseButton, type TuiMouseEvent, type TuiMouseEventType, type TuiPort, type TuiScreenCapture, type TuiSnapshotResult, TuiTesterAdapter, type TuiWaitOptions, type UiClickMode, type UiElementState, type UiInputMode, type UiLocatorMethod, type UiPort, type UiUrlAssertMode, UniversalAuthAdapter, type World, assertMasked, createBddTest, initWorld, interpolate, parseExpected, registerCleanup, resolveExtraTags, selectPath, tagsForProject, tryParseJson };
+export { type ApiMethod, type ApiPort, type ApiResult, type AuthPort, type CleanupItem, type CleanupPort, type CleanupRule, type CreateBddTestOptions, DefaultCleanupAdapter, type FetchInterceptAuthData, type FetchInterceptConfig, PlaywrightApiAdapter, PlaywrightUiAdapter, type TuiConfig, type TuiFactory, type TuiKeyModifiers, type TuiMouseButton, type TuiMouseEvent, type TuiMouseEventType, type TuiPort, type TuiScreenCapture, type TuiSnapshotResult, TuiTesterAdapter, type TuiWaitOptions, type UiClickMode, type UiElementState, type UiInputMode, type UiLocatorMethod, type UiPort, type UiUrlAssertMode, UniversalAuthAdapter, type World, assertMasked, clearFetchIntercept, createBddTest, defaultBearerConfig, defaultBypassConfig, initWorld, interpolate, parseExpected, registerCleanup, resolveExtraTags, selectPath, setupBearerAuth, setupBypassAuth, setupFetchIntercept, tagsForProject, tryParseJson };

package/dist/index.js

@@ -1,26 +1,40 @@
 import {
   assertMasked,
+  clearFetchIntercept,
+  defaultBearerConfig,
+  defaultBypassConfig,
   interpolate,
+  isFlagEnabled,
   parseExpected,
+  registerAllSteps,
   registerApiAssertionSteps,
   registerApiAuthSteps,
   registerApiHttpSteps,
   registerApiSteps,
   registerCleanup,
+  registerDebugSteps,
+  registerFlagSteps,
+  registerFormSteps,
   registerHybridSteps,
   registerHybridSuite,
+  registerLayoutSteps,
   registerSharedCleanupSteps,
   registerSharedSteps,
   registerSharedVarSteps,
   registerTuiBasicSteps,
   registerTuiSteps,
   registerTuiWizardSteps,
+  registerUiAuthSteps,
   registerUiBasicSteps,
   registerUiSteps,
   registerWizardSteps,
   selectPath,
+  setFlag,
+  setupBearerAuth,
+  setupBypassAuth,
+  setupFetchIntercept,
   tryParseJson
-} from "./chunk-73J5FNGG.js";
+} from "./chunk-VWBEMXYC.js";
 
 // src/fixtures.ts
 import { test as base } from "playwright-bdd";
@@ -854,28 +868,42 @@ export {
   UniversalAuthAdapter,
   assertMasked,
   base as baseTest,
+  clearFetchIntercept,
   createBddTest,
+  defaultBearerConfig,
+  defaultBypassConfig,
   initWorld,
   interpolate,
+  isFlagEnabled,
   parseExpected,
+  registerAllSteps,
   registerApiAssertionSteps,
   registerApiAuthSteps,
   registerApiHttpSteps,
   registerApiSteps,
   registerCleanup,
+  registerDebugSteps,
+  registerFlagSteps,
+  registerFormSteps,
   registerHybridSteps,
   registerHybridSuite,
+  registerLayoutSteps,
   registerSharedCleanupSteps,
   registerSharedSteps,
   registerSharedVarSteps,
   registerTuiBasicSteps,
   registerTuiSteps,
   registerTuiWizardSteps,
+  registerUiAuthSteps,
   registerUiBasicSteps,
   registerUiSteps,
   registerWizardSteps,
   resolveExtraTags,
   selectPath,
+  setFlag,
+  setupBearerAuth,
+  setupBypassAuth,
+  setupFetchIntercept,
   tagsForProject,
   tryParseJson
 };

package/dist/steps/index.d.ts

@@ -10,10 +10,60 @@ declare function registerSharedCleanupSteps(test: any): void;
 
 declare function registerSharedVarSteps(test: any): void;
 
+/**
+ * Feature Flag Step Definitions
+ *
+ * Steps for managing feature flags in tests.
+ * These steps store flag state in the world object for use in other steps.
+ */
+/**
+ * Check if a feature flag is enabled.
+ * Can be used by other steps for conditional logic.
+ */
+declare function isFlagEnabled(world: any, flagName: string): boolean;
+/**
+ * Set a feature flag value.
+ * Can be used programmatically by other steps or adapters.
+ */
+declare function setFlag(world: any, flagName: string, enabled: boolean): void;
+declare function registerFlagSteps(test: any): void;
+
 declare function registerUiBasicSteps(test: any): void;
 
 declare function registerWizardSteps(test: any): void;
 
+/**
+ * UI Form Step Definitions
+ *
+ * Steps for bulk form filling using Gherkin data tables.
+ * Tagged with @ui or @hybrid for selective execution.
+ */
+declare function registerFormSteps(test: any): void;
+
+/**
+ * UI Debug Step Definitions
+ *
+ * Steps for debugging and troubleshooting UI tests.
+ * Tagged with @ui or @hybrid for selective execution.
+ */
+declare function registerDebugSteps(test: any): void;
+
+/**
+ * UI Layout Assertion Step Definitions
+ *
+ * Steps for asserting layout states like panels, split views, and responsive behavior.
+ * Tagged with @ui or @hybrid for selective execution.
+ */
+declare function registerLayoutSteps(test: any): void;
+
+/**
+ * UI Auth Step Definitions
+ *
+ * Steps for authenticating in UI tests using fetch interception.
+ * Tagged with @ui for selective execution.
+ */
+declare function registerUiAuthSteps(test: any): void;
+
 /**
  * TUI Basic Step Definitions
  *
@@ -32,9 +82,37 @@ declare function registerTuiBasicSteps(test: any): void;
  */
 declare function registerTuiWizardSteps(test: any): void;
 
+/**
+ * Register all API step definitions.
+ * Steps are tagged with @api or @hybrid for selective execution.
+ */
 declare function registerApiSteps(test: any): void;
+/**
+ * Register all UI step definitions.
+ * Steps are tagged with @ui or @hybrid for selective execution.
+ *
+ * Includes:
+ * - Basic UI steps (navigation, clicks, fills)
+ * - Wizard steps (advanced interactions, locators, assertions)
+ * - Form steps (bulk form filling)
+ * - Debug steps (debugging utilities)
+ * - Layout steps (panel, split view, responsive assertions)
+ * - Auth steps (fetch interception auth)
+ */
 declare function registerUiSteps(test: any): void;
+/**
+ * Register shared step definitions (used by all test types).
+ *
+ * Includes:
+ * - Variable management steps
+ * - Cleanup steps
+ * - Feature flag steps
+ */
 declare function registerSharedSteps(test: any): void;
+/**
+ * Register hybrid step definitions.
+ * Steps that work with both API and UI in the same scenario.
+ */
 declare function registerHybridSuite(test: any): void;
 /**
  * Register all TUI (Terminal User Interface) step definitions.
@@ -42,7 +120,7 @@ declare function registerHybridSuite(test: any): void;
  *
  * @example
  * ```typescript
- * import { createBddTest, registerTuiSteps, TuiTesterAdapter } from '@kata/stack-tests';
+ * import { createBddTest, registerTuiSteps, TuiTesterAdapter } from '@esimplicity/stack-tests';
  *
  * const test = createBddTest({
  *   createTui: () => new TuiTesterAdapter({
@@ -54,5 +132,20 @@ declare function registerHybridSuite(test: any): void;
  * ```
  */
 declare function registerTuiSteps(test: any): void;
+/**
+ * Register all step definitions for a full-featured test suite.
+ * This is a convenience function that registers API, UI, TUI, Shared, and Hybrid steps.
+ *
+ * Note: TUI steps require the optional `tui-tester` peer dependency.
+ *
+ * @example
+ * ```typescript
+ * import { createBddTest, registerAllSteps } from '@esimplicity/stack-tests';
+ *
+ * const test = createBddTest({ ... });
+ * registerAllSteps(test);
+ * ```
+ */
+declare function registerAllSteps(test: any): void;
 
-export { registerApiAssertionSteps, registerApiAuthSteps, registerApiHttpSteps, registerApiSteps, registerHybridSteps, registerHybridSuite, registerSharedCleanupSteps, registerSharedSteps, registerSharedVarSteps, registerTuiBasicSteps, registerTuiSteps, registerTuiWizardSteps, registerUiBasicSteps, registerUiSteps, registerWizardSteps };
+export { isFlagEnabled, registerAllSteps, registerApiAssertionSteps, registerApiAuthSteps, registerApiHttpSteps, registerApiSteps, registerDebugSteps, registerFlagSteps, registerFormSteps, registerHybridSteps, registerHybridSuite, registerLayoutSteps, registerSharedCleanupSteps, registerSharedSteps, registerSharedVarSteps, registerTuiBasicSteps, registerTuiSteps, registerTuiWizardSteps, registerUiAuthSteps, registerUiBasicSteps, registerUiSteps, registerWizardSteps, setFlag };

package/dist/steps/index.js

@@ -1,34 +1,50 @@
 import {
+  isFlagEnabled,
+  registerAllSteps,
   registerApiAssertionSteps,
   registerApiAuthSteps,
   registerApiHttpSteps,
   registerApiSteps,
+  registerDebugSteps,
+  registerFlagSteps,
+  registerFormSteps,
   registerHybridSteps,
   registerHybridSuite,
+  registerLayoutSteps,
   registerSharedCleanupSteps,
   registerSharedSteps,
   registerSharedVarSteps,
   registerTuiBasicSteps,
   registerTuiSteps,
   registerTuiWizardSteps,
+  registerUiAuthSteps,
   registerUiBasicSteps,
   registerUiSteps,
-  registerWizardSteps
-} from "../chunk-73J5FNGG.js";
+  registerWizardSteps,
+  setFlag
+} from "../chunk-VWBEMXYC.js";
 export {
+  isFlagEnabled,
+  registerAllSteps,
   registerApiAssertionSteps,
   registerApiAuthSteps,
   registerApiHttpSteps,
   registerApiSteps,
+  registerDebugSteps,
+  registerFlagSteps,
+  registerFormSteps,
   registerHybridSteps,
   registerHybridSuite,
+  registerLayoutSteps,
   registerSharedCleanupSteps,
   registerSharedSteps,
   registerSharedVarSteps,
   registerTuiBasicSteps,
   registerTuiSteps,
   registerTuiWizardSteps,
+  registerUiAuthSteps,
   registerUiBasicSteps,
   registerUiSteps,
-  registerWizardSteps
+  registerWizardSteps,
+  setFlag
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esimplicity/stack-tests",
-  "version": "0.1.3",
+  "version": "0.1.6",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/scripts/postinstall.cjs

@@ -78,7 +78,7 @@ function main() {
   }
 
   // Always show success message
-  console.log(`${GREEN}${BOLD}@esimplicityinc/stack-tests${RESET} installed successfully!`);
+  console.log(`${GREEN}${BOLD}@esimplicity/stack-tests${RESET} installed successfully!`);
   console.log('');
 }