V2 message manager (#234)

* refactor: server run script
* refactor: extract message control feature
* refactor: socket usage for message control feature
* refactor: migrate e2e testing to playwright
* chore: add feature tests
* refactor: add validation on socket controller
* chore: jest tests server logic
* chore: update tests
* chore: run playwright tests on pull_requests

server/tests/features/message-control.spec.ts

@@ -0,0 +1,38 @@
+import { expect, test } from '@playwright/test';
+
+test('test', async ({ context }) => {
+  const editorPage = await context.newPage();
+  const featurePage = await context.newPage();
+
+  await editorPage.goto('http://localhost:4001/messagecontrol');
+
+  // stage timer message
+  await editorPage.getByPlaceholder('Shown in stage timer').click();
+  await editorPage.getByPlaceholder('Shown in stage timer').fill('testing');
+  await editorPage.getByRole('button', { name: 'toggle timer screen message' }).click();
+
+  await featurePage.goto('http://localhost:4001/timer');
+  await featurePage.getByText('testing').click();
+
+  // public screen message
+  await editorPage.getByPlaceholder('Shown in public screens').click();
+  await editorPage.getByPlaceholder('Shown in public screens').fill('testing public');
+  await editorPage.getByRole('button', { name: /toggle public screen message/i }).click();
+
+  await featurePage.goto('http://localhost:4001/public');
+  await featurePage.getByText('testing public').click();
+
+  // lower third message
+  await editorPage.getByPlaceholder('Shown in lower third').click();
+  await editorPage.getByPlaceholder('Shown in lower third').fill('testing lower');
+  await editorPage.getByRole('button', { name: /toggle lower third message/i }).click();
+  await featurePage.goto('http://localhost:4001/lower');
+  await featurePage.getByText('testing lower').click();
+
+  // on air state
+  await editorPage.getByRole('button', { name: 'Toggle On Air' }).click();
+  await featurePage.goto('http://localhost:4001/studio');
+  await featurePage.getByText('ON AIR').click();
+  const onAirActive = await featurePage.locator('data-testid=on-air-enabled');
+  await expect(onAirActive).toHaveText(/on air/i);
+});

server/tests/features/minimal-url.spec.ts

@@ -0,0 +1,14 @@
+import { expect, test } from '@playwright/test';
+
+test.describe('minimal view behaviour can be changed through params', () => {
+  test.use({ viewport: { width: 1920, height: 1080 } });
+  test('without overloads', async ({ page }) => {
+    await page.goto('http://localhost:4001/minimal');
+    await page.getByTestId('minimal-timer').click();
+  });
+  test('hide nav', async ({ page }) => {
+    await page.goto('http://localhost:4001/minimal?hidenav=true');
+    const navBar = await page.locator('data-test-id=nav-logo');
+    await expect(navBar).toHaveCount(0);
+  });
+});

server/tests/smoke-tests.test.ts

@@ -0,0 +1,78 @@
+import { expect, test } from '@playwright/test';
+
+test.describe('pages routes are available', () => {
+  test.use({ viewport: { width: 1920, height: 1080 } });
+  test.describe('backstage views', () => {
+    test('editor', async ({ page }) => {
+      await page.goto('http://localhost:4001/editor');
+
+      await expect(page).toHaveTitle(/ontime/);
+      await page.getByTestId('event-editor').click();
+      await page.getByTestId('panel-event-list').click();
+      await page.getByTestId('panel-timer-control').click();
+      await page.getByTestId('panel-messages-control').click();
+      await page.getByTestId('panel-info').click();
+    });
+    test('cuesheet', async ({ page }) => {
+      await page.goto('http://localhost:4001/cuesheet');
+
+      await expect(page).toHaveTitle(/ontime/);
+      await page.getByTestId('cuesheet').click();
+    });
+  });
+
+  test.describe('detached views', () => {
+    test('rundown', async ({ page }) => {
+      await page.goto('http://localhost:4001/eventlist');
+      await page.getByTestId('panel-event-list').click();
+    });
+    test('timer control', async ({ page }) => {
+      await page.goto('http://localhost:4001/timercontrol');
+      await page.getByTestId('panel-timer-control').click();
+    });
+    test('message control', async ({ page }) => {
+      await page.goto('http://localhost:4001/messagecontrol');
+      await page.getByTestId('panel-messages-control').click();
+    });
+    test('info', async ({ page }) => {
+      await page.goto('http://localhost:4001/info');
+      await page.getByTestId('panel-info').click();
+    });
+  });
+
+  test.describe('client routes', () => {
+    test('stage timer', async ({ page }) => {
+      await page.goto('http://localhost:4001/timer');
+      await page.getByTestId('timer-view').click();
+    });
+    test('clock', async ({ page }) => {
+      await page.goto('http://localhost:4001/clock');
+      await page.getByTestId('clock-view').click();
+    });
+    test('minimal timer', async ({ page }) => {
+      await page.goto('http://localhost:4001/minimal');
+      await page.getByTestId('minimal-timer').click();
+    });
+    test('backstage', async ({ page }) => {
+      await page.goto('http://localhost:4001/backstage');
+      await page.getByTestId('backstage-view').click();
+    });
+    test('public', async ({ page }) => {
+      await page.goto('http://localhost:4001/public');
+      await page.getByTestId('public-view').click();
+    });
+    test('pip', async ({ page }) => {
+      await page.goto('http://localhost:4001/pip');
+      await page.getByTestId('pip-view').click();
+    });
+    test('studio clock', async ({ page }) => {
+      await page.goto('http://localhost:4001/studio');
+      await page.getByTestId('studio-view').click();
+    });
+    test('lower', async ({ page }) => {
+      await page.goto('http://localhost:4001/lower');
+      const errorBoundary = await page.locator('data-test-id=error-container');
+      await expect(errorBoundary).toHaveCount(0);
+    });
+  });
+});