@nhonh/qabot 0.6.1 → 1.0.1

package/src/cli/interactive.js

@@ -0,0 +1,211 @@
+import Enquirer from "enquirer";
+import chalk from "chalk";
+import { logger } from "../core/logger.js";
+import { loadConfig } from "../core/config.js";
+import { analyzeProject } from "../analyzers/project-analyzer.js";
+import { VERSION } from "../core/constants.js";
+
+const V = chalk.hex("#A78BFA");
+const V2 = chalk.hex("#7C3AED");
+const DIM = chalk.hex("#6B7280");
+const W = chalk.hex("#F3F4F6");
+const G = chalk.hex("#34D399");
+
+export async function runInteractive(projectDir) {
+  const enquirer = new Enquirer();
+  const { config, isEmpty } = await loadConfig(projectDir);
+
+  logger.banner();
+
+  if (isEmpty) {
+    logger.warn("No qabot.config.json found in this directory.");
+    logger.blank();
+    const { shouldInit } = await enquirer.prompt({
+      type: "confirm",
+      name: "shouldInit",
+      message: V("Initialize QABot for this project?"),
+      initial: true,
+    });
+    if (shouldInit) return { action: "init" };
+    return null;
+  }
+
+  const profile = await analyzeProject(projectDir);
+  const projectName = config.project?.name || profile.name;
+  const allFeatures = Object.keys(config.features || {});
+
+  console.log(DIM("  Project: ") + W(projectName));
+  console.log(DIM("  Type:    ") + W(profile.type));
+  console.log(
+    DIM("  Tests:   ") + W(`${allFeatures.length} features detected`),
+  );
+  logger.blank();
+  console.log(V2("  " + "\u2500".repeat(48)));
+  logger.blank();
+
+  const { testType } = await enquirer.prompt({
+    type: "select",
+    name: "testType",
+    message: V("\u25C6") + W(" What would you like to do?"),
+    pointer: V("\u25B8 "),
+    choices: [
+      {
+        name: "e2e",
+        message: `${G("\u25CF")} E2E Browser Test       ${DIM("Playwright automation on live app")}`,
+      },
+      {
+        name: "unit",
+        message: `${chalk.hex("#60A5FA")("\u25CF")} Unit Test              ${DIM("Jest / Vitest in terminal")}`,
+      },
+      {
+        name: "generate",
+        message: `${chalk.hex("#FBBF24")("\u25CF")} AI Generate + Run      ${DIM("AI writes tests, then runs them")}`,
+      },
+      {
+        name: "full",
+        message: `${chalk.hex("#C084FC")("\u25CF")} Full Suite             ${DIM("Unit + E2E combined")}`,
+      },
+      {
+        name: "report",
+        message: `${chalk.hex("#22D3EE")("\u25CF")} View Report            ${DIM("Open last HTML report")}`,
+      },
+      {
+        name: "auth",
+        message: `${DIM("\u25CF")} Configure AI Provider  ${DIM("Setup OpenAI/Claude/Proxy")}`,
+      },
+    ],
+  });
+
+  if (testType === "report") return { action: "report" };
+  if (testType === "auth") return { action: "auth" };
+
+  logger.blank();
+
+  const featureChoices = [
+    {
+      name: "__all__",
+      message: chalk.bold("All features") + DIM(` (${allFeatures.length})`),
+    },
+    ...allFeatures.slice(0, 30).map((f) => {
+      const src = config.features[f]?.src || "";
+      const priority = config.features[f]?.priority || "";
+      const pColor =
+        priority === "P0"
+          ? chalk.hex("#F87171")
+          : priority === "P1"
+            ? chalk.hex("#FBBF24")
+            : DIM;
+      return {
+        name: f,
+        message: `${pColor(priority || "  ")} ${W(f)} ${DIM(src)}`,
+      };
+    }),
+  ];
+
+  const { feature } = await enquirer.prompt({
+    type: "select",
+    name: "feature",
+    message: V("\u25C6") + W(" Select feature"),
+    pointer: V("\u25B8 "),
+    choices: featureChoices,
+    limit: 18,
+  });
+
+  const selectedFeature = feature === "__all__" ? null : feature;
+
+  let targetUrl = null;
+  let headed = false;
+
+  if (testType === "e2e" || testType === "full") {
+    logger.blank();
+
+    const envEntries = Object.entries(config.environments || {});
+    const envChoices = envEntries.map(([name, env]) => ({
+      name: env.url || name,
+      message: `${V("\u25CF")} ${W(name.padEnd(16))} ${DIM(env.url || "")}`,
+    }));
+    envChoices.push({
+      name: "__custom__",
+      message: `${chalk.hex("#FBBF24")("\u25CF")} ${W("Custom URL")}        ${DIM("Enter URL manually")}`,
+    });
+
+    const { envUrl } = await enquirer.prompt({
+      type: "select",
+      name: "envUrl",
+      message: V("\u25C6") + W(" Target environment"),
+      pointer: V("\u25B8 "),
+      choices: envChoices,
+      limit: 12,
+    });
+
+    if (envUrl === "__custom__") {
+      const { customUrl } = await enquirer.prompt({
+        type: "input",
+        name: "customUrl",
+        message: V("\u25C6") + W(" Enter URL"),
+        validate: (v) =>
+          v.startsWith("http")
+            ? true
+            : "URL must start with http:// or https://",
+      });
+      targetUrl = customUrl;
+    } else {
+      targetUrl = envUrl;
+    }
+
+    logger.blank();
+
+    const { browserMode } = await enquirer.prompt({
+      type: "select",
+      name: "browserMode",
+      message: V("\u25C6") + W(" Browser mode"),
+      pointer: V("\u25B8 "),
+      choices: [
+        {
+          name: "headless",
+          message: `${DIM("\u25CF")} Headless       ${DIM("Fast, runs in background")}`,
+        },
+        {
+          name: "headed",
+          message: `${G("\u25CF")} Headed         ${DIM("Watch the browser live")}`,
+        },
+      ],
+    });
+    headed = browserMode === "headed";
+  }
+
+  logger.blank();
+  console.log(V2("  " + "\u2500".repeat(48)));
+  logger.blank();
+
+  const summary = [];
+  summary.push(DIM("  Action:  ") + V(testType.toUpperCase()));
+  summary.push(DIM("  Feature: ") + W(selectedFeature || "all"));
+  if (targetUrl)
+    summary.push(DIM("  URL:     ") + chalk.hex("#22D3EE")(targetUrl));
+  if (testType === "e2e" || testType === "full")
+    summary.push(
+      DIM("  Browser: ") + W(headed ? "Headed (visible)" : "Headless"),
+    );
+  summary.forEach((l) => console.log(l));
+  logger.blank();
+
+  const { confirm } = await enquirer.prompt({
+    type: "confirm",
+    name: "confirm",
+    message: V("\u25C6") + G(" Ready to run?"),
+    initial: true,
+  });
+
+  if (!confirm) {
+    logger.dim("Cancelled.");
+    return null;
+  }
+
+  return {
+    action: testType,
+    feature: selectedFeature,
+    url: targetUrl,
+    headed,
+  };
+}

package/src/core/constants.js

@@ -1,4 +1,4 @@
-export const VERSION = "0.6.1";
+export const VERSION = "1.0.1";
 export const TOOL_NAME = "qabot";
 
 export const PROJECT_TYPES = [

package/src/core/logger.js

@@ -1,13 +1,13 @@
 import chalk from "chalk";
 
-const ICONS = {
-  info: "\u2139",
-  success: "\u2713",
-  warn: "\u26a0",
-  error: "\u2717",
-  step: "\u25b8",
-  bullet: "\u2022",
-};
+const V = chalk.hex("#A78BFA");
+const V2 = chalk.hex("#7C3AED");
+const V3 = chalk.hex("#C4B5FD");
+const G = chalk.hex("#34D399");
+const R = chalk.hex("#F87171");
+const Y = chalk.hex("#FBBF24");
+const DIM = chalk.hex("#6B7280");
+const W = chalk.hex("#F3F4F6");
 
 function formatMs(ms) {
   if (ms < 1000) return `${ms}ms`;
@@ -17,55 +17,74 @@ function formatMs(ms) {
 
 export const logger = {
   info(msg) {
-    console.log(chalk.blue(`  ${ICONS.info} ${msg}`));
+    console.log(V(`  \u25CF `) + W(msg));
   },
   success(msg) {
-    console.log(chalk.green(`  ${ICONS.success} ${msg}`));
+    console.log(G(`  \u2714 `) + W(msg));
   },
   warn(msg) {
-    console.log(chalk.yellow(`  ${ICONS.warn} ${msg}`));
+    console.log(Y(`  \u25B2 `) + Y(msg));
   },
   error(msg) {
-    console.log(chalk.red(`  ${ICONS.error} ${msg}`));
+    console.log(R(`  \u2716 `) + R(msg));
   },
 
   step(current, total, msg) {
-    console.log(
-      chalk.cyan(
-        `  ${ICONS.step} ${chalk.dim(`[${current}/${total}]`)} ${msg}`,
-      ),
-    );
+    const bar = progressBar(current, total, 12);
+    console.log(V(`  ${bar} `) + W(msg));
   },
 
   dim(msg) {
-    console.log(chalk.dim(`    ${msg}`));
+    console.log(DIM(`     ${msg}`));
   },
   blank() {
     console.log("");
   },
 
+  banner() {
+    logger.blank();
+    console.log(
+      V2("   \u2588\u2588\u2588\u2588\u2588  \u2588\u2588\u2588\u2588\u2588") +
+        W("  QABot"),
+    );
+    console.log(
+      V("   \u2588\u2588  \u2588\u2588 \u2588\u2588  \u2588\u2588") +
+        DIM("  AI-Powered QA Automation"),
+    );
+    console.log(
+      V3(
+        "   \u2588\u2588\u2588\u2588\u2588\u2588 \u2588\u2588\u2588\u2588\u2588\u2588",
+      ),
+    );
+    logger.blank();
+  },
+
   header(title) {
     logger.blank();
-    console.log(chalk.bold.white(`  ${title}`));
-    console.log(chalk.dim(`  ${"\u2500".repeat(50)}`));
+    console.log(V2("  \u2502"));
+    console.log(V2("  \u251C\u2500 ") + chalk.bold.white(title));
+    console.log(V2("  \u2502"));
+  },
+
+  section(title) {
+    logger.blank();
+    console.log(V("  \u25C6 ") + chalk.bold.white(title));
+    console.log(DIM("  " + "\u2500".repeat(48)));
   },
 
   box(title, lines) {
-    const w = 54;
-    const border = chalk.dim("\u2500".repeat(w));
+    const w = 52;
     logger.blank();
-    console.log(chalk.dim(`  \u250c${border}\u2510`));
+    console.log(V2("  \u256D" + "\u2500".repeat(w) + "\u256E"));
     console.log(
-      chalk.dim("  \u2502") +
-        chalk.bold.white(` ${title.padEnd(w - 1)}`) +
-        chalk.dim("\u2502"),
+      V2("  \u2502 ") + chalk.bold.white(title.padEnd(w - 2)) + V2(" \u2502"),
     );
-    console.log(chalk.dim(`  \u251c${border}\u2524`));
+    console.log(V2("  \u251C" + "\u2500".repeat(w) + "\u2524"));
     for (const line of lines) {
-      const padded = `  ${line}`.padEnd(w);
-      console.log(chalk.dim("  \u2502") + padded + chalk.dim(" \u2502"));
+      const content = `  ${line}`.padEnd(w - 1);
+      console.log(V2("  \u2502") + content + V2(" \u2502"));
     }
-    console.log(chalk.dim(`  \u2514${border}\u2518`));
+    console.log(V2("  \u2570" + "\u2500".repeat(w) + "\u256F"));
     logger.blank();
   },
 
@@ -75,30 +94,113 @@ export const logger = {
         Math.max(h.length, ...rows.map((r) => String(r[i] || "").length)) + 2,
     );
     const headerLine = headers
-      .map((h, i) => chalk.bold(h.padEnd(colWidths[i])))
+      .map((h, i) => V(h.padEnd(colWidths[i])))
       .join("");
-    const separator = colWidths.map((w) => "\u2500".repeat(w)).join("");
-    console.log(chalk.dim("  ") + headerLine);
-    console.log(chalk.dim(`  ${separator}`));
+    const separator = colWidths.map((w) => DIM("\u2500".repeat(w))).join("");
+    logger.blank();
+    console.log("  " + headerLine);
+    console.log("  " + separator);
     for (const row of rows) {
       const line = row
-        .map((cell, i) => String(cell || "").padEnd(colWidths[i]))
+        .map((cell, i) => {
+          const str = String(cell || "");
+          if (str.includes("\u2714")) return G(str.padEnd(colWidths[i]));
+          if (str.includes("\u2716")) return R(str.padEnd(colWidths[i]));
+          return W(str.padEnd(colWidths[i]));
+        })
         .join("");
-      console.log(`  ${line}`);
+      console.log("  " + line);
     }
   },
 
   testResult(name, status, duration) {
-    const icon =
-      status === "passed"
-        ? chalk.green(ICONS.success)
-        : status === "failed"
-          ? chalk.red(ICONS.error)
-          : chalk.yellow("\u25cb");
-    const dur = duration ? chalk.dim(` (${formatMs(duration)})`) : "";
-    const nameStr = status === "failed" ? chalk.red(name) : name;
-    console.log(`    ${icon} ${nameStr}${dur}`);
+    const icons = {
+      passed: G("\u2714"),
+      failed: R("\u2716"),
+      skipped: Y("\u25CB"),
+      running: V("\u25CF"),
+    };
+    const icon = icons[status] || DIM("\u25CB");
+    const dur = duration ? DIM(` ${formatMs(duration)}`) : "";
+    const nameStr =
+      status === "failed" ? R(name) : status === "skipped" ? Y(name) : W(name);
+    console.log(`     ${icon} ${nameStr}${dur}`);
+  },
+
+  liveTest(index, total, name, status, duration) {
+    const pct = Math.round((index / total) * 100);
+    const bar = progressBar(index, total, 20);
+    const icons = {
+      passed: G("\u2714"),
+      failed: R("\u2716"),
+      skipped: Y("\u25CB"),
+      running: V("\u29BF"),
+    };
+    const icon = icons[status] || V("\u29BF");
+    const dur = duration ? DIM(` ${formatMs(duration)}`) : "";
+    const counter = DIM(`[${index}/${total}]`);
+
+    process.stdout.write(
+      `\r  ${V(bar)} ${counter} ${icon} ${W(name)}${dur}${"".padEnd(20)}`,
+    );
+    if (status !== "running") process.stdout.write("\n");
+  },
+
+  progress(label, current, total) {
+    const bar = progressBar(current, total, 24);
+    const pct = total > 0 ? Math.round((current / total) * 100) : 0;
+    process.stdout.write(
+      `\r  ${V(bar)} ${V2(`${pct}%`)} ${DIM(label)}${"".padEnd(10)}`,
+    );
+  },
+
+  summary(passed, failed, skipped, duration) {
+    logger.blank();
+    console.log(V2("  \u256D" + "\u2500".repeat(42) + "\u256E"));
+    console.log(
+      V2("  \u2502") + chalk.bold.white("  Results".padEnd(42)) + V2("\u2502"),
+    );
+    console.log(V2("  \u251C" + "\u2500".repeat(42) + "\u2524"));
+    console.log(
+      V2("  \u2502") +
+        G(`  \u2714 ${String(passed).padStart(3)} passed`.padEnd(42)) +
+        V2("\u2502"),
+    );
+    if (failed > 0)
+      console.log(
+        V2("  \u2502") +
+          R(`  \u2716 ${String(failed).padStart(3)} failed`.padEnd(42)) +
+          V2("\u2502"),
+      );
+    if (skipped > 0)
+      console.log(
+        V2("  \u2502") +
+          Y(`  \u25CB ${String(skipped).padStart(3)} skipped`.padEnd(42)) +
+          V2("\u2502"),
+      );
+    console.log(
+      V2("  \u2502") +
+        DIM(`  \u23F1 ${formatMs(duration)}`.padEnd(42)) +
+        V2("\u2502"),
+    );
+    const total = passed + failed + skipped;
+    const rate = total > 0 ? Math.round((passed / total) * 100) : 0;
+    const rateColor = rate >= 80 ? G : rate >= 50 ? Y : R;
+    console.log(
+      V2("  \u2502") +
+        rateColor(`  ${rate}% pass rate`.padEnd(42)) +
+        V2("\u2502"),
+    );
+    console.log(V2("  \u2570" + "\u2500".repeat(42) + "\u256F"));
+    logger.blank();
   },
 };
 
+function progressBar(current, total, width) {
+  const pct = total > 0 ? current / total : 0;
+  const filled = Math.round(pct * width);
+  const empty = width - filled;
+  return "\u2588".repeat(filled) + DIM("\u2591".repeat(empty));
+}
+
 export { formatMs };

package/src/e2e/e2e-prompts.js

@@ -1,6 +1,6 @@
 export function buildE2EPrompt(featureName, context) {
   const sourceSection = context.sourceCode
-    ? `\n## Source Code (for understanding page structure)\n\`\`\`\n${context.sourceCode.slice(0, 6000)}\n\`\`\`\n`
+    ? `\n## Source Code Analysis\nUse this to understand the page structure, components, routes, buttons, forms, modals, and data flow:\n\`\`\`\n${context.sourceCode.slice(0, 8000)}\n\`\`\`\n`
     : "";
 
   const routeSection = context.route
@@ -8,59 +8,60 @@ export function buildE2EPrompt(featureName, context) {
     : "";
 
   const useCaseSection = context.useCases?.length
-    ? `\n## QA Use Cases\n${context.useCases.map((uc) => `### ${uc.scenario}\n${uc.steps.map((s, i) => `${i + 1}. ${s}`).join("\n")}`).join("\n\n")}\n`
+    ? `\n## QA Use Cases (from QA team)\n${context.useCases.map((uc) => `### ${uc.scenario}\n${uc.steps.map((s, i) => `${i + 1}. ${s}`).join("\n")}`).join("\n\n")}\n`
     : "";
 
-  return `You are a senior QA automation engineer writing Playwright E2E tests.
+  return `You are an expert QA automation engineer. Write comprehensive Playwright E2E tests.
 
 ## Feature: ${featureName}
 ## Base URL: ${context.baseUrl || "http://localhost:3000"}
-## Auth Provider: ${context.authProvider || "none"}
+## Auth: ${context.authProvider || "none"} (use auth helper if needed)
 ${routeSection}${sourceSection}${useCaseSection}
-## Task
-Write a Playwright test spec for the "${featureName}" feature. The test should:
-1. Navigate to the correct page
-2. Verify the page loads correctly (key elements visible)
-3. Test main user interactions
-4. Take screenshots at key checkpoints
-5. Verify expected outcomes
 
-## Playwright Rules
+## REQUIREMENTS — Generate AT LEAST 8 test cases covering:
+
+### Must Include (P0 — Critical):
+1. Page Load & Layout — verify page loads, key sections visible, no console errors
+2. Navigation — verify URL is correct, breadcrumbs/tabs work
+3. Primary User Action — the main thing a user does on this page (click button, submit form, etc)
+4. Data Display — verify data renders correctly (lists, cards, tables, amounts)
+
+### Should Include (P1 — Important):
+5. Secondary Actions — other clickable elements, links, toggles
+6. Error States — what happens when something goes wrong (empty data, network error)
+7. Loading States — skeleton/spinner shows while data loads
+8. Responsive/Mobile — if applicable, test viewport changes
+
+### Nice to Have (P2 — Edge Cases):
+9. Edge Cases — empty states, boundary values, special characters
+10. Authentication Guards — verify redirects when not logged in
+
+## PLAYWRIGHT RULES:
 1. Use \`const { test, expect } = require("@playwright/test");\`
-2. Use \`test.describe\` for grouping, \`test\` for individual tests
-3. Use accessible selectors: \`page.getByRole()\`, \`page.getByText()\`, \`page.getByTestId()\`
-4. Use \`await page.waitForLoadState("networkidle")\` after navigation
-5. Use \`await page.screenshot({ path: "e2e/screenshots/${featureName}-{step}.png" })\` at key points
-6. Use \`expect(page).toHaveURL()\` for navigation verification
-7. Use \`expect(locator).toBeVisible()\` for element verification
-8. Handle authentication if needed:
+2. ALWAYS start with \`test.describe("${featureName}", () => { ... })\`
+3. Use \`test.beforeEach\` for common setup (login + navigate)
+4. Use accessible selectors IN THIS ORDER of preference:
+   - \`page.getByRole("button", { name: /text/i })\`
+   - \`page.getByText(/text/i)\`
+   - \`page.getByTestId("id")\`
+   - \`page.locator("css-selector")\` (LAST resort)
+5. After every navigation: \`await page.waitForLoadState("networkidle")\`
+6. Take screenshot at EVERY test: \`await page.screenshot({ path: "e2e/screenshots/${featureName}-{testname}.png", fullPage: true })\`
+7. Use \`expect(locator).toBeVisible()\` not \`toBeTruthy()\`
+8. Use \`{ timeout: 15000 }\` for slow-loading elements
+9. Handle auth:
    \`\`\`
    const { login } = require("../helpers/auth.js");
-   test.beforeEach(async ({ page, baseURL }) => { await login(page, baseURL); });
+   test.beforeEach(async ({ page, baseURL }) => {
+     await login(page, baseURL);
+     await page.goto("${context.route || "/" + featureName}");
+     await page.waitForLoadState("networkidle");
+   });
    \`\`\`
-9. Each test should be independent
-10. Add reasonable timeouts for slow operations
-
-## Structure
-\`\`\`
-test.describe("${featureName}", () => {
-  test.beforeEach(async ({ page, baseURL }) => {
-    // login if needed
-    // navigate to feature page
-  });
-
-  test("page loads correctly", async ({ page }) => {
-    // verify key elements
-    // take screenshot
-  });
-
-  test("main interaction works", async ({ page }) => {
-    // perform action
-    // verify outcome
-    // take screenshot
-  });
-});
-\`\`\`
+10. Each test MUST have a clear assertion with \`expect()\`
+11. Add \`test.slow()\` for tests that need extra time
 
-Return ONLY the JavaScript code. No markdown fences. No explanation.`;
+## OUTPUT FORMAT:
+Return ONLY JavaScript code. No markdown fences. No explanation.
+Generate a COMPLETE runnable spec file with 8-12 tests.`;
 }