summaryrefslogtreecommitdiffhomepage
path: root/gui/test/e2e/shared/tunnel-state.ts
blob: db7b7e36587887e5c21e4b5d46e057d3b1502d7b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
import { expect } from '@playwright/test';
import { Page } from 'playwright';
import { colors } from '../../../src/config.json';
import { anyOf } from '../utils';

const UNSECURED_COLOR = colors.red;
const SECURE_COLOR = colors.green;
const WHITE_COLOR = colors.white;

const UNSECURE_BUTTON_COLOR = anyOf(colors.red60, colors.red80);
const SECURE_BUTTON_COLOR = anyOf(colors.green, colors.green90);

const getLabel = (page: Page) => page.locator('span[role="status"]');
const getHeader = (page: Page) => page.locator('header');

export async function expectDisconnected(page: Page) {
  await expectTunnelState(page, {
    labelText: 'unsecured connection',
    labelColor: UNSECURED_COLOR,
    headerColor: UNSECURED_COLOR,
    buttonText: 'secure my connection',
    buttonColor: SECURE_BUTTON_COLOR,
  });
}

export async function expectConnecting(page: Page) {
  await expectTunnelState(page, {
    labelText: 'creating secure connection',
    labelColor: WHITE_COLOR,
    headerColor: SECURE_COLOR,
    buttonText: 'cancel',
    buttonColor: UNSECURE_BUTTON_COLOR,
  });
}

export async function expectConnected(page: Page) {
  await expectTunnelState(page, {
    labelText: 'secure connection',
    labelColor: SECURE_COLOR,
    headerColor: SECURE_COLOR,
    buttonText: 'disconnect',
    buttonColor: UNSECURE_BUTTON_COLOR,
  });
}

export async function expectDisconnecting(page: Page) {
  await expectTunnelState(page, {
    headerColor: UNSECURED_COLOR,
    buttonText: 'secure my connection',
    buttonColor: SECURE_BUTTON_COLOR,
  });
}

export async function expectError(page: Page) {
  await expectTunnelState(page, {
    labelText: 'blocked connection',
    labelColor: WHITE_COLOR,
    headerColor: SECURE_COLOR,
  });
}

export async function expectConnectingPq(page: Page) {
  await expectTunnelState(page, {
    labelText: 'creating quantum secure connection',
    labelColor: WHITE_COLOR,
    headerColor: SECURE_COLOR,
    buttonText: 'cancel',
    buttonColor: UNSECURE_BUTTON_COLOR,
  });
}

export async function expectConnectedPq(page: Page) {
  await expectTunnelState(page, {
    labelText: 'quantum secure connection',
    labelColor: SECURE_COLOR,
    headerColor: SECURE_COLOR,
    buttonText: 'disconnect',
    buttonColor: UNSECURE_BUTTON_COLOR,
  });
}

interface TunnelStateContent {
  labelText?: string | RegExp;
  labelColor?: string;
  headerColor: string;
  buttonText?: string;
  buttonColor?: string | RegExp;
}

export async function expectTunnelState(page: Page, content: TunnelStateContent) {
  const statusLabel = getLabel(page);
  if (content.labelText && content.labelColor) {
    await expect(statusLabel).toContainText(new RegExp(content.labelText, 'i'));
    await expect(statusLabel).toHaveCSS('color', content.labelColor);
  } else {
    await expect(statusLabel).toBeEmpty();
  }

  const header = getHeader(page);
  await expect(header).toHaveCSS('background-color', content.headerColor);

  if (content.buttonText && content.buttonColor) {
    const button = page.locator('button', { hasText: new RegExp(content.buttonText, 'i') });
    await expect(button).toHaveCSS('background-color', content.buttonColor);
  }
}