chore: add e2e test for updating theme (#16897)

site/e2e/tests/users/userSettings.spec.ts

@@ -0,0 +1,28 @@
+import { expect, test } from "@playwright/test";
+import { users } from "../../constants";
+import { login } from "../../helpers";
+import { beforeCoderTest } from "../../hooks";
+
+test.beforeEach(({ page }) => {
+	beforeCoderTest(page);
+});
+
+test("adjust user theme preference", async ({ page }) => {
+	await login(page, users.member);
+
+	await page.goto("/settings/appearance", { waitUntil: "domcontentloaded" });
+
+	await page.getByText("Light", { exact: true }).click();
+	await expect(page.getByLabel("Light")).toBeChecked();
+
+	// Make sure the page is actually updated to use the light theme
+	const [root] = await page.$$("html");
+	expect(await root.evaluate((it) => it.className)).toContain("light");
+
+	await page.goto("/", { waitUntil: "domcontentloaded" });
+
+	// Make sure the page is still using the light theme after reloading and
+	// navigating away from the settings page.
+	const [homeRoot] = await page.$$("html");
+	expect(await homeRoot.evaluate((it) => it.className)).toContain("light");
+});

site/e2e/tests/workspaces/createWorkspace.spec.ts

@@ -5,11 +5,11 @@ import {
 	createTemplate,
 	createWorkspace,
 	echoResponsesWithParameters,
+	login,
 	openTerminalWindow,
 	requireTerraformProvisioner,
 	verifyParameters,
 } from "../../helpers";
-import { login } from "../../helpers";
 import { beforeCoderTest } from "../../hooks";
 import {
 	fifthParameter,
@@ -150,9 +150,7 @@ test("create workspace with disable_param search params", async ({ page }) => {
 	await login(page, users.member);
 	await page.goto(
 		`/templates/${templateName}/workspace?disable_params=first_parameter,second_parameter`,
-		{
-			waitUntil: "domcontentloaded",
-		},
+		{ waitUntil: "domcontentloaded" },
 	);
 
 	await expect(page.getByLabel(/First parameter/i)).toBeDisabled();
@@ -173,9 +171,7 @@ test.skip("create docker workspace", async ({ context, page }) => {
 	// The workspace agents must be ready before we try to interact with the workspace.
 	await page.waitForSelector(
 		`//div[@role="status"][@data-testid="agent-status-ready"]`,
-		{
-			state: "visible",
-		},
+		{ state: "visible" },
 	);
 
 	// Wait for the terminal button to be visible, and click it.