testdriverai 7.1.2 → 7.1.4

package/docs/v7/presets/webapp.mdx

@@ -13,13 +13,12 @@ The `webApp()` preset provides a generic interface for testing web applications.
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('web app test', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://myapp.com',
-    browser: 'chrome'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://myapp.com' });
   
   await testdriver.find('Login button').click();
 });
@@ -83,12 +82,12 @@ webApp(context, options): Promise<WebAppResult>
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('user login flow', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://myapp.com/login'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://myapp.com/login' });
   
   await testdriver.find('email input').type('user@example.com');
   await testdriver.find('password input').type('password123');
@@ -102,12 +101,12 @@ test('user login flow', async (context) => {
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('product purchase', async (context) => {
-  const { testdriver, dashcam } = await webApp(context, {
-    url: 'https://shop.example.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://shop.example.com' });
   
   // Search for product
   await testdriver.find('search input').type('laptop');
@@ -131,12 +130,12 @@ test('product purchase', async (context) => {
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('single page app routing', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://spa.example.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://spa.example.com' });
   
   // Navigate through SPA routes
   await testdriver.find('About link').click();
@@ -154,12 +153,12 @@ test('single page app routing', async (context) => {
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('form validation errors', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://myapp.com/register'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://myapp.com/register' });
   
   // Submit empty form
   await testdriver.find('Submit button').click();
@@ -183,12 +182,12 @@ test('form validation errors', async (context) => {
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('data fetching and display', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://api-demo.example.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://api-demo.example.com' });
   
   // Trigger data fetch
   await testdriver.find('Load Data button').click();
@@ -208,13 +207,12 @@ test('data fetching and display', async (context) => {
 
 ```javascript
 import { test } from 'vitest';
-import { webApp } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
 
 test('mobile menu', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://responsive.example.com',
-    maximized: false // Start in default window size
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://responsive.example.com' });
   
   // Resize to mobile
   await testdriver.exec('sh', 'xdotool getactivewindow windowsize 375 667', 5000);
@@ -231,13 +229,12 @@ test('mobile menu', async (context) => {
 
 ## Browser Support
 
-Currently, `webApp()` only supports Chrome:
+Currently supports Chrome:
 
 ```javascript
 // ✅ Supported
-const { testdriver } = await webApp(context, {
-  browser: 'chrome'
-});
+const testdriver = TestDriver(context, { headless: true });
+await testdriver.provision.chrome({ url: 'https://myapp.com' });
 
 // ❌ Not yet supported
 const { testdriver } = await webApp(context, {
@@ -310,9 +307,9 @@ The behavior is identical, but `webApp()` provides a more generic interface for
 
 ```javascript
 test('login and navigate', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://myapp.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://myapp.com' });
   
   // Login
   await testdriver.find('email').type('user@example.com');
@@ -332,9 +329,9 @@ test('login and navigate', async (context) => {
 
 ```javascript
 test('upload file', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://upload.example.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://upload.example.com' });
   
   // Click upload button
   await testdriver.find('Upload file button').click();
@@ -352,9 +349,9 @@ test('upload file', async (context) => {
 
 ```javascript
 test('search with filters', async (context) => {
-  const { testdriver } = await webApp(context, {
-    url: 'https://catalog.example.com'
-  });
+  const testdriver = TestDriver(context, { headless: true });
+  
+  await testdriver.provision.chrome({ url: 'https://catalog.example.com' });
   
   // Enter search query
   await testdriver.find('search input').type('laptop');

package/interfaces/cli/commands/init.js

@@ -143,7 +143,10 @@ class InitCommand extends BaseCommand {
         },
         keywords: ["testdriver", "testing", "e2e"],
         author: "",
-        license: "ISC"
+        license: "ISC",
+        engines: {
+          node: ">=20.19.0"
+        }
       };
 
       fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2) + "\n");
@@ -159,6 +162,7 @@ class InitCommand extends BaseCommand {
   async createVitestExample() {
     const testDir = path.join(process.cwd(), "tests");
     const testFile = path.join(testDir, "example.test.js");
+    const loginSnippetFile = path.join(testDir, "login.js");
     const configFile = path.join(process.cwd(), "vitest.config.js");
 
     // Create test directory if it doesn't exist
@@ -167,23 +171,73 @@ class InitCommand extends BaseCommand {
       console.log(chalk.gray(`  Created directory: ${testDir}`));
     }
 
-    // Create example Vitest test
+    // Create login snippet file
+    const loginSnippetContent = `/**
+ * Login snippet - reusable login function
+ * 
+ * This demonstrates how to create reusable test snippets that can be
+ * imported and used across multiple test files.
+ */
+export async function login(testdriver) {
+
+  // The password is displayed on screen, have TestDriver extract it
+  const password = await testdriver.extract('the password');
+
+  // Find the username field
+  const usernameField = await testdriver.find(
+    'Username, label above the username input field on the login form'
+  );
+  await usernameField.click();
+
+  // Type username
+  await testdriver.type('standard_user');
+
+  // Enter password form earlier 
+  // Marked as secret so it's not logged or stored
+  await testdriver.pressKeys(['tab']);
+  await testdriver.type(password, { secret: true });
+
+  // Submit the form
+  await testdriver.find('submit button on the login form').click();
+}
+`;
+
+    fs.writeFileSync(loginSnippetFile, loginSnippetContent);
+    console.log(chalk.green(`  Created login snippet: ${loginSnippetFile}`));
+
+    // Create example Vitest test that uses the login snippet
     const vitestContent = `import { test, expect } from 'vitest';
-import { chrome } from 'testdriverai/presets';
+import { TestDriver } from 'testdriverai/vitest/hooks';
+import { login } from './login.js';
+
+test('should login and add item to cart', async (context) => {
+
+  // Create TestDriver instance - automatically connects to sandbox
+  const testdriver = TestDriver(context);
+
+  // Launch chrome and navigate to demo app
+  await testdriver.provision.chrome({ url: 'http://testdriver-sandbox.vercel.app/login' });
+
+  // Use the login snippet to handle authentication
+  // This demonstrates how to reuse test logic across multiple tests
+  await login(testdriver);
 
-test('should navigate to example.com and find elements', async (context) => {
-  // The chrome preset handles connection, browser launch, and cleanup automatically
-  const { testdriver } = await chrome(context, {
-    url: 'https://example.com'
-    // apiKey automatically read from process.env.TD_API_KEY via .env file
-  });
+  // Add item to cart
+  const addToCartButton = await testdriver.find(
+    'add to cart button under TestDriver Hat'
+  );
+  await addToCartButton.click();
 
-  // Find and verify elements
-  const heading = await testdriver.find('heading that says Example Domain');
-  expect(heading.found()).toBe(true);
+  // Open cart
+  const cartButton = await testdriver.find(
+    'cart button in the top right corner'
+  );
+  await cartButton.click();
 
-  const link = await testdriver.find('More information link');
-  expect(link.found()).toBe(true);
+  // Verify item in cart
+  const result = await testdriver.assert('TestDriver Hat is in the cart');
+  expect(result).toBeTruthy();
+  
 });
 `;
 
@@ -194,16 +248,20 @@ test('should navigate to example.com and find elements', async (context) => {
     if (!fs.existsSync(configFile)) {
       const configContent = `import { defineConfig } from 'vitest/config';
 import TestDriver from 'testdriverai/vitest';
-import dotenv from 'dotenv';
+import { config } from 'dotenv';
 
 // Load environment variables from .env file
-dotenv.config();
+config();
 
 export default defineConfig({
-  plugins: [TestDriver()],
   test: {
-    testTimeout: 120000,
-    hookTimeout: 120000,
+    testTimeout: 300000,
+    hookTimeout: 300000,
+    reporters: [
+      'default',
+      TestDriver(),
+    ],
+    setupFiles: ['testdriverai/vitest/setup'],
   },
 });
 `;
@@ -315,7 +373,7 @@ jobs:
     console.log(chalk.cyan("\n  Installing dependencies...\n"));
 
     try {
-      execSync("npm install -D vitest testdriverai && npm install dotenv", {
+      execSync("npm install -D vitest testdriverai@beta && npm install dotenv", {
         cwd: process.cwd(),
         stdio: "inherit"
       });
@@ -326,7 +384,7 @@ jobs:
           "\n⚠️  Failed to install dependencies automatically. Please run:",
         ),
       );
-      console.log(chalk.gray("     npm install -D vitest testdriverai"));
+      console.log(chalk.gray("     npm install -D vitest testdriverai@beta"));
       console.log(chalk.gray("     npm install dotenv\n"));
     }
   }

package/interfaces/vitest-plugin.mjs

@@ -423,7 +423,7 @@ export default function testDriverPlugin(options = {}) {
     options.apiRoot || process.env.TD_API_ROOT || "https://testdriver-api.onrender.com";
   pluginState.ciProvider = detectCI();
   pluginState.gitInfo = getGitInfo();
-  
+
   // Store TestDriver-specific options (excluding plugin-specific ones)
   const { apiKey, apiRoot, ...testDriverOptions } = options;
   pluginState.testDriverOptions = testDriverOptions;
@@ -441,7 +441,13 @@ export default function testDriverPlugin(options = {}) {
     logger.debug("Global TestDriver options:", testDriverOptions);
   }
 
-  return new TestDriverReporter(options);
+  // Create reporter instance
+  const reporter = new TestDriverReporter(options);
+  
+  // Add name property for Vitest
+  reporter.name = 'testdriver';
+  
+  return reporter;
 }
 
 /**
@@ -458,6 +464,10 @@ class TestDriverReporter {
     this.ctx = ctx;
     logger.debug("onInit called - UPDATED VERSION");
 
+    // Store project root for making file paths relative
+    pluginState.projectRoot = ctx.config.root || process.cwd();
+    logger.debug("Project root:", pluginState.projectRoot);
+
     // NOW read the API key and API root (after setupFiles have run, including dotenv/config)
     pluginState.apiKey = this.options.apiKey || process.env.TD_API_KEY;
     pluginState.apiRoot = this.options.apiRoot || process.env.TD_API_ROOT || "https://testdriver-api.onrender.com";
@@ -668,11 +678,15 @@ class TestDriverReporter {
         dashcamUrl = testResult.dashcamUrl || null;
         const platform = testResult.platform || null;
         sessionId = testResult.sessionId || null;
-        testFile =
+        const absolutePath =
           testResult.testFile ||
           test.file?.filepath ||
           test.file?.name ||
           "unknown";
+        // Make path relative to project root
+        testFile = pluginState.projectRoot && absolutePath !== "unknown"
+          ? path.relative(pluginState.projectRoot, absolutePath)
+          : absolutePath;
         testOrder =
           testResult.testOrder !== undefined ? testResult.testOrder : 0;
         // Don't override duration from file - use Vitest's result.duration
@@ -696,7 +710,7 @@ class TestDriverReporter {
         logger.debug(`No result file found for test: ${test.id}`);
         // Fallback to test object properties - try multiple sources
         // In Vitest, the file path is on test.module.task.filepath
-        testFile =
+        const absolutePath =
           test.module?.task?.filepath ||
           test.module?.file?.filepath ||
           test.module?.file?.name ||
@@ -706,13 +720,17 @@ class TestDriverReporter {
           test.suite?.file?.name ||
           test.location?.file ||
           "unknown";
+        // Make path relative to project root
+        testFile = pluginState.projectRoot && absolutePath !== "unknown"
+          ? path.relative(pluginState.projectRoot, absolutePath)
+          : absolutePath;
         logger.debug(`Resolved testFile: ${testFile}`);
       }
     } catch (error) {
       logger.error("Failed to read test result file:", error.message);
       // Fallback to test object properties - try multiple sources
       // In Vitest, the file path is on test.module.task.filepath
-      testFile =
+      const absolutePath =
         test.module?.task?.filepath ||
         test.module?.file?.filepath ||
         test.module?.file?.name ||
@@ -722,6 +740,10 @@ class TestDriverReporter {
         test.suite?.file?.name ||
         test.location?.file ||
         "unknown";
+      // Make path relative to project root
+      testFile = pluginState.projectRoot && absolutePath !== "unknown"
+        ? path.relative(pluginState.projectRoot, absolutePath)
+        : absolutePath;
       logger.debug(`Resolved testFile from fallback: ${testFile}`);
     }
 
@@ -901,8 +923,9 @@ function getGitInfo() {
         encoding: "utf8",
         stdio: ["pipe", "pipe", "ignore"]
       }).trim();
+      logger.debug("Git commit from local:", info.commit);
     } catch (e) {
-      // Git command failed, ignore
+      logger.debug("Failed to get git commit:", e.message);
     }
   }
 
@@ -912,8 +935,9 @@ function getGitInfo() {
         encoding: "utf8",
         stdio: ["pipe", "pipe", "ignore"]
       }).trim();
+      logger.debug("Git branch from local:", info.branch);
     } catch (e) {
-      // Git command failed, ignore
+      logger.debug("Failed to get git branch:", e.message);
     }
   }
 
@@ -923,8 +947,9 @@ function getGitInfo() {
         encoding: "utf8",
         stdio: ["pipe", "pipe", "ignore"]
       }).trim();
+      logger.debug("Git author from local:", info.author);
     } catch (e) {
-      // Git command failed, ignore
+      logger.debug("Failed to get git author:", e.message);
     }
   }
 
@@ -941,12 +966,14 @@ function getGitInfo() {
       const match = remoteUrl.match(/[:/]([^/:]+\/[^/:]+?)(\.git)?$/);
       if (match) {
         info.repo = match[1];
+        logger.debug("Git repo from local:", info.repo);
       }
     } catch (e) {
-      // Git command failed, ignore
+      logger.debug("Failed to get git repo:", e.message);
     }
   }
 
+  logger.info("Collected git info:", info);
   return info;
 }
 

package/lib/vitest/hooks.mjs

@@ -246,7 +246,11 @@ export function TestDriver(context, options = {}) {
             if (dashcamUrl) {
               const testId = context.task.id;
               const platform = testdriver.os || 'linux';
-              const testFile = context.task.file?.filepath || context.task.file?.name || 'unknown';
+              const absolutePath = context.task.file?.filepath || context.task.file?.name || 'unknown';
+              const projectRoot = process.cwd();
+              const testFile = absolutePath !== 'unknown'
+                ? path.relative(projectRoot, absolutePath)
+                : absolutePath;
               
               // Create results directory if it doesn't exist
               const resultsDir = path.join(os.tmpdir(), 'testdriver-results');