Add tests for connect button

1 files changed, 18 insertions, 2 deletions

diff --git a/gui/e2e/tunnel-state.spec.ts b/gui/e2e/tunnel-state.spec.ts
index fa3a425903..763c6ac624 100644
--- a/gui/e2e/tunnel-state.spec.ts
+++ b/gui/e2e/tunnel-state.spec.ts
@@ -61,7 +61,11 @@ test('App should show disconnected tunnel state', async () => {
   const headerColor = await getBackgroundColor(header);
   expect(headerColor).toBe(UNSECURED_COLOR);
 
-  await appWindow.screenshot({ path: getScreenShotPath('unsecured') });
+  const button = await appWindow.locator('button', { hasText: /secure my connection/i });
+  const buttonColor = await getBackgroundColor(button);
+  expect(buttonColor).toBe(SECURE_COLOR);
+
+  await appWindow.screenshot({ path: getScreenShotPath('disconnected') });
 });
 
 /**
@@ -87,6 +91,10 @@ test('App should show connecting tunnel state', async () => {
   const headerColor = await getBackgroundColor(header);
   expect(headerColor).toBe(SECURE_COLOR);
 
+  const button = await appWindow.locator('button', { hasText: /cancel/i });
+  const buttonColor = await getBackgroundColor(button);
+  expect(buttonColor).toBe('rgba(227, 64, 57, 0.6)');
+
   await appWindow.screenshot({ path: getScreenShotPath('connecting') });
 });
 
@@ -120,7 +128,11 @@ test('App should show connected tunnel state', async () => {
   const headerColor = await getBackgroundColor(header);
   expect(headerColor).toBe(SECURE_COLOR);
 
-  await appWindow.screenshot({ path: getScreenShotPath('secure') });
+  const button = await appWindow.locator('button', { hasText: /switch location/i });
+  const buttonColor = await getBackgroundColor(button);
+  expect(buttonColor).toBe('rgba(255, 255, 255, 0.2)');
+
+  await appWindow.screenshot({ path: getScreenShotPath('connected') });
 });
 
 /**
@@ -146,6 +158,10 @@ test('App should show disconnecting tunnel state', async () => {
   const headerColor = await getBackgroundColor(header);
   expect(headerColor).toBe(UNSECURED_COLOR);
 
+  const button = await appWindow.locator('button', { hasText: /secure my connection/i });
+  const buttonColor = await getBackgroundColor(button);
+  expect(buttonColor).toBe(SECURE_COLOR);
+
   await appWindow.screenshot({ path: getScreenShotPath('disconnecting') });
 });