If your team has written Playwright or Appium tests before, QA Wolf tests will look familiar. The selectors, interactions, and assertions work the same way. What’s different is the wrapper around them.
The import statement
import { flow, expect } from "@qawolf/flows/web";
flow is the outer container for every QA Wolf test. Import it from the package that matches your target platform. On web and Android, also import expect from the same package — this ensures assertions are wired into QA Wolf’s reporting.
On web and Android, importing expect from @playwright/test instead of the flows package will cause assertions to bypass QA Wolf’s reporting. Always import from the flows package.
The flow wrapper
flow() takes three arguments: a name, a platform string, and an asynchronous function containing the test logic.
export default flow(
"Test Name",
"Web - Chrome",
async ({ test, ...testContext }) => {
const { launch } = testContext;
// test steps go here
},
);
Name — what this test is called in your results, bug reports, and QA Wolf dashboard. Make it descriptive enough that a failing test name tells you where to look.
Platform string — the device and environment the test runs on. The format is "Platform - Device (OS Version)" for mobile and "Web - Browser" for web. The system resolves this at runtime into a running session. No additional configuration required.
Test function — the async function containing your test logic. It receives test for defining named steps and testContext for utilities. Web tests destructure launch from testContext to start a browser session. Mobile tests receive wdio for driver sessions.
In vanilla Playwright, you configure browsers in playwright.config.js. In vanilla Appium, you configure the target device through desired capabilities. In QA Wolf, the platform string handles both. The infrastructure resolves it at runtime.
The AAA framework
QA Wolf generates tests in the Arrange, Act, Assert (AAA) format.
Arrange sets up the state and launches the session.
Act performs the interaction being tested.
Assert verifies the expected outcome.
await test("Complete checkout", async () => {
//--------------------------------
// Arrange:
//--------------------------------
const { context } = await launch();
context.setDefaultTimeout(8000);
const page = await context.newPage();
await page.goto("https://www.example.com/checkout");
//--------------------------------
// Act:
//--------------------------------
await page.fill("[data-testid='email']", "test@example.com");
await page.click("[data-testid='submit']");
//--------------------------------
// Assert:
//--------------------------------
await expect(page).toHaveURL("https://www.example.com/confirmation");
});
Putting it together
Here is a complete, minimal QA Wolf test for each platform:
import { flow, expect } from "@qawolf/flows/web";
export default flow(
"Happy Path",
"Web - Chrome",
async ({ test, ...testContext }) => {
const { launch } = testContext;
await test("Load homepage", async () => {
//--------------------------------
// Arrange:
//--------------------------------
const { context } = await launch();
context.setDefaultTimeout(8000);
const page = await context.newPage();
await page.goto("https://www.qawolf.com/");
//--------------------------------
// Act:
//--------------------------------
//--------------------------------
// Assert:
//--------------------------------
});
},
);