Typed Output For WebdriverIO Teams

ai-test-generator-4wdio-ts extends the JavaScript generator with TypeScript-first ergonomics. The repository has moved to amiya-pattnaik/ai-test-generator-4wdio-ts, while the npm package remains wdio-testgen-from-gherkin-ts until the rename lands.

If you like working with strict typing, the generated Page Objects expose explicit return types and locator signatures, so refactors show up immediately during compilation.

Highlights

• Typed Page Objects and specs: Strong typing flows through every generated file, which means IDEs can guide you when customizing or extending steps.
• Same AI selector engine: NLP-backed naming keeps selectors expressive while maintaining parity with the JavaScript variant.
• Type-aware CLI helpers: Development scripts for watch mode, test execution, and report generation ship with TypeScript definitions.
• Ready for Vitest: The repo includes optional Vitest suites to validate custom logic in src/utils.ts.

Setup

git clone git@github.com:amiya-pattnaik/ai-test-generator-4wdio-ts.git
cd ai-test-generator-4wdio-ts
npm install
npm install -g tsx
npm link

CLI usage after linking:

testgen steps --all
testgen tests --all
testgen run --report

Stick to project-local scripts?

npm run dev:testgen:steps -- --all
npm run dev:testgen:tests -- --all
npm run dev:testgen:run -- --report
npm run vitest                       # optional core logic tests

Programmatic Entry Points

import { processSteps, processTests } from 'wdio-testgen-from-gherkin-ts';

await processSteps({
  featuresPath: './features',
  outputPath: './stepMaps',
  force: true,
  verbose: true
});

await processTests({
  stepMapDir: './stepMaps',
  outputDir: './test',
  all: true,
  dryRun: false
});

The function names mirror the JavaScript bundle yet respond with typed objects, making it easier to compose pipelines in larger mono-repos.

Example Flow

Feature Input

Feature: Account login

  Scenario: Member authenticates
    Given I am on the "login" page
    When I fill "userName" with "member@example.com"
    And I fill "password" with "Secr3t!"
    And I click on "login"
    Then I should see "dashboardBanner"

Generated Step Map (excerpt)

{
  "scenario": "Member authenticates",
  "steps": [
    { "action": "open", "selectorName": "open", "note": "login" },
    { "action": "setValue", "selectorName": "userNameField", "note": "member@example.com" },
    { "action": "setValue", "selectorName": "passwordField", "note": "Secr3t!" },
    { "action": "click", "selectorName": "loginButton" },
    { "action": "assertVisible", "selectorName": "dashboardBanner" }
  ]
}

Generated Spec Snippet

import { expect } from '@wdio/globals';
import LoginPage from '../pageobjects/login.page';

describe('account login', () => {
  it('member authenticates', async () => {
    const pageObj = new LoginPage();
    await pageObj.open('login');
    await pageObj.userNameField.setValue('member@example.com');
    await pageObj.passwordField.setValue('Secr3t!');
    await pageObj.loginButton.click();
    await expect(pageObj.dashboardBanner).toBeDisplayed();
  });
});

Looking Ahead

Planned updates include richer action coverage, schema-driven data injection, and the final npm rename to match the ai-test-generator branding. If your team relies on specific WebdriverIO service integrations or reporters, share the details so I can consider first-class support.