Add integration test for notebook

ui-tests/package.json

@@ -5,8 +5,11 @@
     "private": true,
     "scripts": {
         "start": "jupyter lab --config jupyter_server_test_config.py",
+        "start:notebook": "jupyter notebook --config jupyter_server_test_config.py",
         "test": "jlpm playwright test",
-        "test:update": "jlpm playwright test --update-snapshots"
+        "test:notebook": "jlpm playwright test -c playwright-notebook.config.js",
+        "test:update": "jlpm playwright test --update-snapshots",
+        "test:notebook:update": "jlpm playwright test -c playwright-notebook.config.js --update-snapshots"
     },
     "devDependencies": {
         "@jupyterlab/galata": "^5.0.0",

ui-tests/playwright-notebook.config.js

@@ -0,0 +1,19 @@
+/**
+ * Configuration for Playwright using default from @jupyterlab/galata
+ */
+const baseConfig = require('@jupyterlab/galata/lib/playwright-config');
+
+module.exports = {
+  ...baseConfig,
+      testMatch: 'tests/notebook*.spec.ts',
+      use: {
+        ...baseConfig.use,
+        appPath: ''
+      },
+  webServer: {
+    command: 'jlpm start:notebook',
+    url: 'http://localhost:8888/tree',
+    timeout: 120 * 1000,
+    reuseExistingServer: !process.env.CI
+  }
+};

ui-tests/playwright.config.js

@@ -5,6 +5,7 @@ const baseConfig = require('@jupyterlab/galata/lib/playwright-config');
 
 module.exports = {
   ...baseConfig,
+      testMatch: 'tests/jupyterlab*.spec.ts',
   webServer: {
     command: 'jlpm start',
     url: 'http://localhost:8888/lab',

ui-tests/tests/notebook-tour.spec.ts

@@ -0,0 +1,43 @@
+import { expect, test as base } from '@jupyterlab/galata';
+
+export const test = base.extend({
+  waitForApplication: async ({ baseURL }, use, testInfo) => {
+    const waitIsReady = async (page): Promise<void> => {
+      await page.waitForSelector('#main-panel');
+    };
+    await use(waitIsReady);
+  },
+});
+
+test('should run the welcome tour', async ({ page }) => {
+
+  await page.getByRole('button', { name: 'Start now' }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+
+  await expect
+    .soft(page.locator('.react-joyride__tooltip h4'))
+    .toHaveText('Command Palette');
+  await page.getByLabel('Done').click();
+});
+
+test('should run the notebook tour', async ({ page }) => {
+  await page.getByRole('menuitem', { name: 'File' }).click();
+  await page.getByText('New', { exact: true }).click();
+  await page.locator('#jp-mainmenu-file-new').getByText('Notebook').click();
+  await page.getByRole('button', { name: 'Select Kernel' }).click();
+  await page.getByRole('button', { name: 'Start now' }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await page.getByLabel('Next', { exact: true }).click();
+  await expect
+    .soft(page.locator('.react-joyride__tooltip p'))
+    .toHaveText(/Its name and its status are displayed here\.$/);
+  await page.getByLabel('Done').click();
+});