two column layout for desktop

tests/desktop.test.ts

@@ -9,3 +9,8 @@ test('desktop page does not have nav toggle', async ({ page }) => {
   await page.goto('/');
   await expect(page.locator('nav button')).toBeHidden();
 });
+
+test('desktop page has two-column layout', async ({ page }) => {
+  await page.goto('/');
+  await expect(page.locator('#pane-preview')).toBeVisible();
+});

tests/general.test.ts

@@ -14,7 +14,9 @@ test('nav items work', async ({ page }) => {
     const currentPaneId = `pane-${pane}`;
     await page.locator(`nav li[aria-controls="${currentPaneId}"]`).click();
     await expect(page.locator(`#${currentPaneId}`)).toBeVisible();
-    await expect(page.locator(lastPane)).toBeHidden();
+    if (lastPane !== '#pane-preview') {
+      await expect(page.locator(lastPane)).toBeHidden();
+    }
     lastPane = `#${currentPaneId}`;
   }
 });

tests/mobile.test.ts

@@ -19,3 +19,8 @@ test('nav toggle works', async ({ page }) => {
   await page.locator('nav button').click();
   await expect(page.locator('nav ul')).toBeHidden();
 });
+
+test('mobile page has single-column layout', async ({ page }) => {
+  await page.goto('/');
+  await expect(page.locator('#pane-preview')).toBeHidden();
+});