microsoft / microsoft/playwright

[Bug]: Trace timeline Showing Hours when using APIRequestContext in fixture

Open
#40,068 0 comments 0 reactions 1 assignee View on GitHub

@pavelfeldman is already working on this.

Since Apr 13, 2026.

P3-collecting-feedback
Dominant language
TypeScript
Stars
96.3k
Forks
6.5k
Avg merge
1d 6h
Merged PRs (30d)
180

Description

Version

1.59.1

Steps to reproduce
  1. Create a fixture that is used to return an APIRequestContext
  2. Example:
import { APIRequestContext, request, test as base } from '@playwright/test';

type TestFixture = {
  GraphQLContext: APIRequestContext;
};

export { expect } from '@playwright/test';
export const test = base.extend<TestFixture>({
  GraphQLContext: async ({}, use) => {
    const context = await request.newContext({
      baseURL: process.env.GRAPHQLURL!,
      extraHTTPHeaders: {
        Authorization: `Bearer ${process.env.TOKEN1}`,
        'Content-Type': 'application/json',
      },
      timeout: 60000,
    });
    await use(context);
    await context.dispose();
  },
});

  1. Create a failing test that calls that fixture in the Before all hook
  2. Example:
import { expect, test } from '../../../fixtures/api_fixture';

test.describe(
  'Bug Demo Trace Timing Issue',
  {
    annotation: [
      { description: 'https://www.google.com/', type: 'Link' },
      { description: 'User Story', type: 'Type' },
      { description: 'P2', type: 'Priority' },
      { description: '5.0', type: 'Version' },
    ],
    tag: ['@Google'],
  },
  () => {
    test('Test Bug Demo Trace Timing Issue', async ({ page }) => {
      await test.step('Navigate', async () => {
        await page.goto('https://www.google.com/');
        await expect(page.locator('input[name="q"]')).toBeVisible();
      });

      await test.step('Search', async () => {
        await page.fill('input[name="q"]', 'Playwright');
        await page.press('input[name="q"]', 'Enter');
        await expect(page.locator('text=Playwright')).toBeVisible();
      });
      await test.step('Perform action', async () => {
        await page.click('text=Playwright');
        await expect(page.locator('text=Playwright: Fast and reliable end-to-end testing for modern web apps')).toBeVisible();
      });
    });

    test.beforeAll(async ({ GraphQLContext }) => {});

    test.afterAll(async ({ GraphQLContext }) => {});
  }
);
  1. Run Test in docker
  2. Check Tracefile
Expected behavior

I would expect not see hours of run time in the tracefile timeline if i run the same failing test locally and not in docker

Image
Actual behavior

Test shows hours of time in trace file

Image
Additional context

I use this way to create a graphQL API client that makes calls and does the data setup in before and after hooks and still shows those calls within the trace files

We use it like this

test.beforeAll(async ({ GraphQLContext }) => {
  const apiClient = new MYGraphClient(GraphQLContext);
  await apiClient.CreateSomething("Something");
});
Environment
docker run --add-host=hostmachine:host-gateway -p 3000:3000 --rm --init -it --workdir /home/pwuser --user pwuser mcr.microsoft.com/playwright:v1.59.1-noble /bin/sh -c \"npx -y playwright@1.59.1 run-server --port 3000 --host 0.0.0.0\""

System:
    OS: Windows 11 10.0.26200
    CPU: (12) x64 13th Gen Intel(R) Core(TM) i7-1365U
    Memory: 11.16 GB / 31.66 GB
  Binaries:
    Node: 24.12.0 - C:\Program Files\nodejs\node.EXE
    npm: 11.6.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: 10.14.0 - C:\Users\AndrewLumsden\AppData\Local\pnpm\pnpm.EXE
  Languages:
    Bash: 5.2.21 - C:\WINDOWS\system32\bash.EXE
  npmPackages:
    @playwright/test: ^1.59.1 => 1.59.1 
    playwright: ^1.59.1 => 1.59.1

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.