From galata using playwright to playwright with galata

[fcollonval]

Problem

playwright is an amazing tool with a strong support from Microsoft and the community. So we can only expect it to grow in reliability and ease of usage. In particular with v1.12 a test runner was released with the builtin ability to compare image, generate trace, create videos, running tests in parallel, fixtures, reporters,... . I think we should onboard that as there is no value for us to try keeping up the pace by hiding the tool.

Proposed Solution

• Embrace playwright test runner
  • Port current report generator to be a valid playwright reporter
  • Unlock the ability to create test from the code generator tool by copy-paste

while keeping the nice helpers functions.

[welcome]

Thank you for opening your first issue in this project! Engagement like this is essential for open source projects! 🤗

If you haven't done so already, check out Jupyter's Code of Conduct. Also, please try to follow the issue template as it helps other other community members to contribute more effectively.

You can meet the other Jovyans by joining our Discourse forum. There is also an intro thread there where you can stop by and say Hi! 👋

Welcome to the Jupyter community! 🎉

[jtpio]

Thanks @fcollonval for opening this.

Embrace playwright test runner

Historically and for more context, Galata switched from using puppeteer to playwright in #11. The diff was relatively small since both frameworks have almost the same API.

If we decide to go full playwright from now on, then I think it would indeed make sense to embrace more of the existing tooling 👍

[mbektas]

Sure, this is a good idea. We currently customize test and describe methods of jest for some bookkeeping (https://github.com/jupyterlab/galata/blob/main/packages/galata/src/galata.ts#L43-L73) we will need to make sure we can do similar with playwright/test. It might even have a better way to access current test name and other test info.

[fcollonval]

test is definitely meant to be overridden as this is the way to define fixture; doc example:

// example.spec.ts
import { test as base } from '@playwright/test';
import { TodoPage } from './todo-page';

// Extend basic test by providing a "table" fixture.
const test = base.extend<{ todoPage: TodoPage }>({
  todoPage: async ({ page }, use) => {
    const todoPage = new TodoPage(page);
    await todoPage.goto();
    await todoPage.addToDo('item1');
    await todoPage.addToDo('item2');
    await use(todoPage);
    await todoPage.removeAll();
  },
});

test('should add an item', async ({ todoPage }) => {
  await todoPage.addToDo('my item');
  // ...
});

test('should remove an item', async ({ todoPage }) => {
  await todoPage.remove('item1');
  // ...
});

[jtpio]

Just switched from jest to @playwright/test when updating RetroLab in jupyterlab/retrolab#167 (retrolab has been using plain playwright and not galata, yet).

The setup and code is much simpler and feels less convoluted. Also as mentioned above fixtures would also be great to have in galata.