Test for reconnect and theme (#3264)

add test

e2e/playwright/snapshot-tests.spec.ts

@@ -964,3 +964,69 @@ test.describe('Grid visibility', { tag: '@snapshot' }, () => {
     })
   })
 })
+
+test('theme persists', async ({ page, context }) => {
+  const u = await getUtils(page)
+  await context.addInitScript(async () => {
+    localStorage.setItem(
+      'persistCode',
+      `const part001 = startSketchOn('XY')
+  |> startProfileAt([-10, -10], %)
+  |> line([20, 0], %)
+  |> line([0, 20], %)
+  |> line([-20, 0], %)
+  |> close(%)
+  |> extrude(10, %)
+`
+    )
+  }, KCL_DEFAULT_LENGTH)
+
+  await page.setViewportSize({ width: 1200, height: 500 })
+
+  await u.waitForAuthSkipAppStart()
+  await page.waitForTimeout(500)
+
+  // await page.getByRole('link', { name: 'Settings Settings (tooltip)' }).click()
+  await expect(page.getByTestId('settings-link')).toBeVisible()
+  await page.getByTestId('settings-link').click()
+
+  // open user settingns
+  await page.getByRole('radio', { name: 'person User' }).click()
+
+  await page.getByTestId('app-theme').selectOption('light')
+
+  await page.getByTestId('settings-close-button').click()
+
+  const networkToggle = page.getByTestId('network-toggle')
+
+  // simulate network down
+  await u.emulateNetworkConditions({
+    offline: true,
+    // values of 0 remove any active throttling. crbug.com/456324#c9
+    latency: 0,
+    downloadThroughput: -1,
+    uploadThroughput: -1,
+  })
+
+  // Disconnect and reconnect to check the theme persists through a reload
+
+  // Expect the network to be down
+  await expect(networkToggle).toContainText('Offline')
+
+  // simulate network up
+  await u.emulateNetworkConditions({
+    offline: false,
+    // values of 0 remove any active throttling. crbug.com/456324#c9
+    latency: 0,
+    downloadThroughput: -1,
+    uploadThroughput: -1,
+  })
+
+  await expect(networkToggle).toContainText('Connected')
+
+  await expect(page.getByText('building scene')).not.toBeVisible()
+
+  await expect(page, 'expect screenshot to have light theme').toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+})