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);
}
}
|