How To Add Tags Dynamically In Playwright Tests

In this brief story, I want to share with you my approach to dynamically tagging Playwright tests.

By default, Playwright recommends that you use the — grep and — grep-invert command line flags for that.

test('TC01 Open LinkedIn URL @smoke', async ({page}) => {
  await page.goto("https://www.linkedin.com/in/truuts");
});

test('TC02 Open Medium URL', async ({page}) => {
  await page.goto("https://truuts.medium.com");
});

test('TC03 Open Facebook URL @smoke', async ({page}) => {
  await page.goto("https://www.facebook.com/eugene.truuts");
});

In this example, I have several tests, and two of them are tagged as “@smoke”. To run only smoke tests you can use the -grep test run flag:

npx playwright test --grep @smoke

This command will run the TC01 and TC03 tests only. You can check it by passing the — list parameter to get the test run listing:

Listing tests:
  [chromium] › example.spec.ts:6:5 › TC01 Open LinkedIn URL @smoke
  [chromium] › example.spec.ts:14:5 › TC03 Open Facebook URL @smoke

That looks pretty simple in the beginning, but then you have hundreds or even thousands of tests in your project, and managing such tags directly in test titles becomes really tricky. Different tags such as test priority…