From 42dd4ccbcfde1841528aaec60fe3fa86a4723ce7 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Sat, 2 Sep 2023 16:23:02 +0200
Subject: [PATCH 01/24] feat: synced tabs

---
 packages/starlight/user-components/Tabs.astro | 38 +++++++++++++++++--
 1 file changed, 35 insertions(+), 3 deletions(-)

diff --git a/packages/starlight/user-components/Tabs.astro b/packages/starlight/user-components/Tabs.astro
index 82b3af179dd..62fa0983537 100644
--- a/packages/starlight/user-components/Tabs.astro
+++ b/packages/starlight/user-components/Tabs.astro
@@ -1,11 +1,16 @@
 ---
 import { processPanels } from './rehype-tabs';
 
+interface Props {
+	syncKey: string;
+}
+
+const { syncKey } = Astro.props;
 const panelHtml = await Astro.slots.render('default');
 const { html, panels } = processPanels(panelHtml);
 ---
 
-<starlight-tabs>
+<starlight-tabs data-sync-key={syncKey}>
 	{
 		panels && (
 			<div class="tablist-wrapper not-content">
@@ -70,14 +75,25 @@ const { html, panels } = processPanels(panelHtml);
 
 <script>
 	class StarlightTabs extends HTMLElement {
+		// A map of sync keys to all tabs that are synced to that key.
+		static #syncedTabs = new Map<string, StarlightTabs[]>();
+
 		tabs: HTMLAnchorElement[];
 		panels: HTMLElement[];
+		#syncKey: string | undefined;
 
 		constructor() {
 			super();
 			const tablist = this.querySelector<HTMLUListElement>('[role="tablist"]')!;
 			this.tabs = [...tablist.querySelectorAll<HTMLAnchorElement>('[role="tab"]')];
 			this.panels = [...this.querySelectorAll<HTMLElement>(':scope > [role="tabpanel"]')];
+			this.#syncKey = this.dataset.syncKey;
+
+			if (this.#syncKey) {
+				const syncedTabs = StarlightTabs.#syncedTabs.get(this.#syncKey) ?? [];
+				syncedTabs.push(this);
+				StarlightTabs.#syncedTabs.set(this.#syncKey, syncedTabs);
+			}
 
 			this.tabs.forEach((tab, i) => {
 				// Handle clicks for mouse users
@@ -113,7 +129,7 @@ const { html, panels } = processPanels(panelHtml);
 			});
 		}
 
-		switchTab(newTab: HTMLAnchorElement | null | undefined, index: number) {
+		switchTab(newTab: HTMLAnchorElement | null | undefined, index: number, shouldSync = true) {
 			if (!newTab) return;
 
 			// Mark all tabs as unselected and hide all tab panels.
@@ -131,7 +147,23 @@ const { html, panels } = processPanels(panelHtml);
 			// Restore active tab to the default tab order.
 			newTab.removeAttribute('tabindex');
 			newTab.setAttribute('aria-selected', 'true');
-			newTab.focus();
+			if (shouldSync) {
+				newTab.focus();
+				StarlightTabs.#syncTabs(this, index);
+			}
+		}
+
+		static #syncTabs(emitter: StarlightTabs, index: number) {
+			const syncKey = emitter.#syncKey;
+			if (!syncKey) return;
+			const syncedTabs = StarlightTabs.#syncedTabs.get(syncKey);
+			if (!syncedTabs) return;
+
+			for (const tabs of syncedTabs) {
+				if (tabs !== emitter) {
+					tabs.switchTab(tabs.tabs[index], index, false);
+				}
+			}
 		}
 	}
 

From 8dad024017cb0ea52c16a84508772a1519bb1172 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 10:54:04 +0200
Subject: [PATCH 02/24] test: add e2e tests

---
 .github/workflows/ci.yml                      | 14 +++
 packages/starlight/__e2e__/.gitignore         |  2 +
 .../__e2e__/fixtures/basics/astro.config.mjs  | 10 ++
 .../__e2e__/fixtures/basics/package.json      |  9 ++
 .../fixtures/basics/src/content/config.ts     |  6 ++
 .../fixtures/basics/src/content/docs/tabs.mdx | 37 +++++++
 .../__e2e__/fixtures/basics/src/env.d.ts      |  2 +
 packages/starlight/__e2e__/tabs.test.ts       | 97 +++++++++++++++++++
 packages/starlight/__e2e__/test-utils.ts      | 54 +++++++++++
 packages/starlight/package.json               |  4 +-
 packages/starlight/playwright.config.ts       | 15 +++
 packages/starlight/user-components/Tabs.astro | 15 +--
 pnpm-lock.yaml                                | 29 ++++++
 13 files changed, 286 insertions(+), 8 deletions(-)
 create mode 100644 packages/starlight/__e2e__/.gitignore
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/astro.config.mjs
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/package.json
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/src/content/config.ts
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs.mdx
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/src/env.d.ts
 create mode 100644 packages/starlight/__e2e__/tabs.test.ts
 create mode 100644 packages/starlight/__e2e__/test-utils.ts
 create mode 100644 packages/starlight/playwright.config.ts

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index fdc2756a123..f823edbec85 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -30,6 +30,20 @@ jobs:
       - name: Test packages
         run: pnpm -r test:coverage
 
+  e2e-test:
+    name: Run E2E tests
+    runs-on: ubuntu-20.04
+    steps:
+      - uses: actions/checkout@v3
+      - uses: pnpm/action-setup@v2
+      - uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+      - run: pnpm i
+      - name: Test packages
+        run: pnpm -r test:e2e
+
   pa11y:
     name: Check for accessibility issues
     runs-on: ubuntu-20.04
diff --git a/packages/starlight/__e2e__/.gitignore b/packages/starlight/__e2e__/.gitignore
new file mode 100644
index 00000000000..f5bd2c4897e
--- /dev/null
+++ b/packages/starlight/__e2e__/.gitignore
@@ -0,0 +1,2 @@
+# generated types
+.astro/
diff --git a/packages/starlight/__e2e__/fixtures/basics/astro.config.mjs b/packages/starlight/__e2e__/fixtures/basics/astro.config.mjs
new file mode 100644
index 00000000000..9e96cbad3d1
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/astro.config.mjs
@@ -0,0 +1,10 @@
+import starlight from '@astrojs/starlight';
+import { defineConfig } from 'astro/config';
+
+export default defineConfig({
+	integrations: [
+		starlight({
+			title: 'Basics',
+		}),
+	],
+});
diff --git a/packages/starlight/__e2e__/fixtures/basics/package.json b/packages/starlight/__e2e__/fixtures/basics/package.json
new file mode 100644
index 00000000000..1d38f940370
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/package.json
@@ -0,0 +1,9 @@
+{
+  "name": "@e2e/basics",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "@astrojs/starlight": "workspace:*",
+    "astro": "^3.0.6"
+  }
+}
diff --git a/packages/starlight/__e2e__/fixtures/basics/src/content/config.ts b/packages/starlight/__e2e__/fixtures/basics/src/content/config.ts
new file mode 100644
index 00000000000..45f60b01542
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/src/content/config.ts
@@ -0,0 +1,6 @@
+import { defineCollection } from 'astro:content';
+import { docsSchema } from '@astrojs/starlight/schema';
+
+export const collections = {
+	docs: defineCollection({ schema: docsSchema() }),
+};
diff --git a/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs.mdx b/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs.mdx
new file mode 100644
index 00000000000..17e643a6131
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs.mdx
@@ -0,0 +1,37 @@
+---
+title: Tabs
+---
+
+import { Tabs, TabItem } from '@astrojs/starlight/components';
+
+A set of tabs using the `pkg` sync key.
+
+<Tabs syncKey="pkg">
+	<TabItem label="npm">npm command</TabItem>
+	<TabItem label="pnpm">pnpm command</TabItem>
+	<TabItem label="yarn">yarn command</TabItem>
+</Tabs>
+
+A basic set of tabs.
+
+<Tabs>
+	<TabItem label="one">tab 1</TabItem>
+	<TabItem label="two">tab 2</TabItem>
+	<TabItem label="three">tab 3</TabItem>
+</Tabs>
+
+Another set of tabs using the `pkg` sync key and an extra tab.
+
+<Tabs syncKey="pkg">
+	<TabItem label="npm">another npm command</TabItem>
+	<TabItem label="pnpm">another pnpm command</TabItem>
+	<TabItem label="bun">another bun command</TabItem>
+	<TabItem label="yarn">another yarn command</TabItem>
+</Tabs>
+
+A set of tabs using the `style` sync key.
+
+<Tabs syncKey="style">
+	<TabItem label="css">css code</TabItem>
+	<TabItem label="tailwind">tailwind code</TabItem>
+</Tabs>
diff --git a/packages/starlight/__e2e__/fixtures/basics/src/env.d.ts b/packages/starlight/__e2e__/fixtures/basics/src/env.d.ts
new file mode 100644
index 00000000000..c13bd73c723
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/src/env.d.ts
@@ -0,0 +1,2 @@
+/// <reference path="../.astro/types.d.ts" />
+/// <reference types="astro/client" />
\ No newline at end of file
diff --git a/packages/starlight/__e2e__/tabs.test.ts b/packages/starlight/__e2e__/tabs.test.ts
new file mode 100644
index 00000000000..71f9c7a6359
--- /dev/null
+++ b/packages/starlight/__e2e__/tabs.test.ts
@@ -0,0 +1,97 @@
+import { expect, testFactory, type Locator } from './test-utils';
+
+const test = await testFactory('./fixtures/basics/');
+
+test('syncs tabs with a click event', async ({ page, starlight }) => {
+	await starlight.goto('/tabs');
+
+	const tabs = page.locator('starlight-tabs');
+	const pkgTabsA = tabs.nth(0);
+	const pkgTabsB = tabs.nth(2);
+
+	// Select the pnpm tab in the first set of synced tabs.
+	await pkgTabsA.getByRole('tab').filter({ hasText: 'pnpm' }).click();
+
+	await expectSelectedTab(pkgTabsA, 'pnpm', 'pnpm command');
+	await expectSelectedTab(pkgTabsB, 'pnpm', 'another pnpm command');
+
+	// Select the yarn tab in the second set of synced tabs.
+	await pkgTabsB.getByRole('tab').filter({ hasText: 'yarn' }).click();
+
+	await expectSelectedTab(pkgTabsB, 'yarn', 'another yarn command');
+	await expectSelectedTab(pkgTabsA, 'yarn', 'yarn command');
+});
+
+test('syncs tabs with a keyboard event', async ({ page, starlight }) => {
+	await starlight.goto('/tabs');
+
+	const tabs = page.locator('starlight-tabs');
+	const pkgTabsA = tabs.nth(0);
+	const pkgTabsB = tabs.nth(2);
+
+	// Select the pnpm tab in the first set of synced tabs with the keyboard.
+	await pkgTabsA.getByRole('tab', { selected: true }).press('ArrowRight');
+
+	await expectSelectedTab(pkgTabsA, 'pnpm', 'pnpm command');
+	await expectSelectedTab(pkgTabsB, 'pnpm', 'another pnpm command');
+
+	// Select back the npm tab in the second set of synced tabs with the keyboard.
+	const selectedTabB = pkgTabsB.getByRole('tab', { selected: true });
+	await selectedTabB.press('ArrowRight');
+	await selectedTabB.press('ArrowLeft');
+	await selectedTabB.press('ArrowLeft');
+
+	await expectSelectedTab(pkgTabsA, 'npm', 'npm command');
+	await expectSelectedTab(pkgTabsB, 'npm', 'another npm command');
+});
+
+test('syncs only tabs using the same sync key', async ({ page, starlight }) => {
+	await starlight.goto('/tabs');
+
+	const tabs = page.locator('starlight-tabs');
+	const pkgTabsA = tabs.nth(0);
+	const unsyncedTabs = tabs.nth(1);
+	const styleTabs = tabs.nth(3);
+
+	// Select the pnpm tab in the set of tabs synced with the 'pkg' key.
+	await pkgTabsA.getByRole('tab').filter({ hasText: 'pnpm' }).click();
+
+	await expectSelectedTab(unsyncedTabs, 'one', 'tab 1');
+	await expectSelectedTab(styleTabs, 'css', 'css code');
+});
+
+test('supports synced tabs with different tab items', async ({ page, starlight }) => {
+	await starlight.goto('/tabs');
+
+	const tabs = page.locator('starlight-tabs');
+	const pkgTabsA = tabs.nth(0);
+	const pkgTabsB = tabs.nth(2); // This set contains an extra tab item.
+
+	// Select the bun tab in the second set of synced tabs.
+	await pkgTabsB.getByRole('tab').filter({ hasText: 'bun' }).click();
+
+	await expectSelectedTab(pkgTabsA, 'npm', 'npm command');
+	await expectSelectedTab(pkgTabsB, 'bun', 'another bun command');
+});
+
+test('persists the focus when syncing tabs', async ({ page, starlight }) => {
+	await starlight.goto('/tabs');
+
+	const pkgTabsA = page.locator('starlight-tabs').nth(0);
+
+	// Focus the selected tab in the set of tabs synced with the 'pkg' key.
+	await pkgTabsA.getByRole('tab', { selected: true }).focus();
+	// Select the pnpm tab in the set of tabs synced with the 'pkg' key using the keyboard.
+	await page.keyboard.press('ArrowRight');
+
+	expect(
+		await pkgTabsA
+			.getByRole('tab', { selected: true })
+			.evaluate((node) => document.activeElement === node)
+	).toBe(true);
+});
+
+async function expectSelectedTab(tabs: Locator, label: string, panel: string) {
+	expect(await tabs.getByRole('tab', { selected: true }).textContent()).toBe(label);
+	expect(await tabs.getByRole('tabpanel').textContent()).toBe(panel);
+}
diff --git a/packages/starlight/__e2e__/test-utils.ts b/packages/starlight/__e2e__/test-utils.ts
new file mode 100644
index 00000000000..376ac910697
--- /dev/null
+++ b/packages/starlight/__e2e__/test-utils.ts
@@ -0,0 +1,54 @@
+import { fileURLToPath } from 'node:url';
+import { test as baseTest, type Page } from '@playwright/test';
+import { dev } from 'astro';
+
+export { expect, type Locator } from '@playwright/test';
+
+// Setup a test environment that will start a dev server for a given fixture path and provide a
+// Starlight Playwright fixture accessible from within all tests.
+export async function testFactory(fixturePath: string) {
+	let devServer: DevServer | undefined;
+
+	const test = baseTest.extend<{ starlight: StarlightPage }>({
+		starlight: async ({ page }, use) => {
+			if (!devServer) {
+				throw new Error('Could not find a dev server to run tests against.');
+			}
+
+			await use(new StarlightPage(devServer, page));
+		},
+	});
+
+	test.beforeAll(async () => {
+		devServer = await dev({
+			logLevel: 'error',
+			root: fileURLToPath(new URL(fixturePath, import.meta.url)),
+		});
+	});
+
+	test.afterAll(async () => {
+		await devServer?.stop();
+	});
+
+	return test;
+}
+
+// A Playwright test fixture accessible from within all tests.
+class StarlightPage {
+	constructor(
+		private readonly devServer: DevServer,
+		private readonly page: Page
+	) {}
+
+	// Navigate to a URL relative to the server used during a test run and return the resource response.
+	goto(url: string) {
+		return this.page.goto(this.resolveUrl(url));
+	}
+
+	// Resolve a URL relative to the server used during a test run.
+	resolveUrl(url: string) {
+		return `http://localhost:${this.devServer.address.port}${url.replace(/^\/?/, '/')}`;
+	}
+}
+
+type DevServer = Awaited<ReturnType<typeof dev>>;
diff --git a/packages/starlight/package.json b/packages/starlight/package.json
index 0d21e88220f..bc491d09a1f 100644
--- a/packages/starlight/package.json
+++ b/packages/starlight/package.json
@@ -4,7 +4,8 @@
   "description": "Build beautiful, high-performance documentation websites with Astro",
   "scripts": {
     "test": "vitest",
-    "test:coverage": "vitest run --coverage"
+    "test:coverage": "vitest run --coverage",
+    "test:e2e": "playwright install --with-deps chromium && playwright test"
   },
   "keywords": [
     "docs",
@@ -36,6 +37,7 @@
   },
   "devDependencies": {
     "@types/node": "^18.16.19",
+    "@playwright/test": "^1.37.1",
     "@vitest/coverage-v8": "^0.33.0",
     "astro": "^3.0.6",
     "vitest": "^0.33.0"
diff --git a/packages/starlight/playwright.config.ts b/packages/starlight/playwright.config.ts
new file mode 100644
index 00000000000..01098ea8b0d
--- /dev/null
+++ b/packages/starlight/playwright.config.ts
@@ -0,0 +1,15 @@
+import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+	forbidOnly: !!process.env['CI'],
+	projects: [
+		{
+			name: 'Chrome Stable',
+			use: {
+				...devices['Desktop Chrome'],
+				headless: true,
+			},
+		},
+	],
+	testMatch: '__e2e__/*.test.ts',
+});
diff --git a/packages/starlight/user-components/Tabs.astro b/packages/starlight/user-components/Tabs.astro
index 62fa0983537..36e36cf9d9a 100644
--- a/packages/starlight/user-components/Tabs.astro
+++ b/packages/starlight/user-components/Tabs.astro
@@ -149,20 +149,21 @@ const { html, panels } = processPanels(panelHtml);
 			newTab.setAttribute('aria-selected', 'true');
 			if (shouldSync) {
 				newTab.focus();
-				StarlightTabs.#syncTabs(this, index);
+				StarlightTabs.#syncTabs(this, newTab.textContent);
 			}
 		}
 
-		static #syncTabs(emitter: StarlightTabs, index: number) {
+		static #syncTabs(emitter: StarlightTabs, label: string | null) {
 			const syncKey = emitter.#syncKey;
-			if (!syncKey) return;
+			if (!syncKey || !label) return;
 			const syncedTabs = StarlightTabs.#syncedTabs.get(syncKey);
 			if (!syncedTabs) return;
 
-			for (const tabs of syncedTabs) {
-				if (tabs !== emitter) {
-					tabs.switchTab(tabs.tabs[index], index, false);
-				}
+			for (const receiver of syncedTabs) {
+				if (receiver === emitter) continue;
+				const labelIndex = receiver.tabs.findIndex((tab) => tab.textContent === label);
+				if (labelIndex === -1) continue;
+				receiver.switchTab(receiver.tabs[labelIndex], labelIndex, false);
 			}
 		}
 	}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e131dbc0abf..f5f47b5741d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -181,6 +181,9 @@ importers:
         specifier: ^5.3.7
         version: 5.3.7
     devDependencies:
+      '@playwright/test':
+        specifier: ^1.37.1
+        version: 1.37.1
       '@types/node':
         specifier: ^18.16.19
         version: 18.16.19
@@ -194,6 +197,15 @@ importers:
         specifier: ^0.33.0
         version: 0.33.0
 
+  packages/starlight/__e2e__/fixtures/basics:
+    dependencies:
+      '@astrojs/starlight':
+        specifier: workspace:*
+        version: link:../../..
+      astro:
+        specifier: ^3.0.6
+        version: 3.0.6(@types/node@18.16.19)
+
   packages/tailwind:
     dependencies:
       '@astrojs/starlight':
@@ -1288,6 +1300,17 @@ packages:
     dev: false
     optional: true
 
+  /@playwright/test@1.37.1:
+    resolution: {integrity: sha512-bq9zTli3vWJo8S3LwB91U0qDNQDpEXnw7knhxLM0nwDvexQAwx9tO8iKDZSqqneVq+URd/WIoz+BALMqUTgdSg==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dependencies:
+      '@types/node': 18.16.19
+      playwright-core: 1.37.1
+    optionalDependencies:
+      fsevents: 2.3.2
+    dev: true
+
   /@sideway/address@4.1.4:
     resolution: {integrity: sha512-7vwq+rOHVWjyXxVlR76Agnvhy8I9rpzjosTESvmhNeXOXdZZB15Fl+TI9x1SiHZH5Jv2wTGduSxFDIaq0m3DUw==}
     dependencies:
@@ -5059,6 +5082,12 @@ packages:
       pathe: 1.1.1
     dev: true
 
+  /playwright-core@1.37.1:
+    resolution: {integrity: sha512-17EuQxlSIYCmEMwzMqusJ2ztDgJePjrbttaefgdsiqeLWidjYz9BxXaTaZWxH1J95SHGk6tjE+dwgWILJoUZfA==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dev: true
+
   /postcss-import@15.1.0(postcss@8.4.29):
     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
     engines: {node: '>=14.0.0'}

From 695cd011ff6f0d1c5e683c12e67c797c6b37d2fa Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 10:56:01 +0200
Subject: [PATCH 03/24] docs: add synced tabs documentation

---
 docs/src/content/docs/guides/components.mdx | 40 +++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/docs/src/content/docs/guides/components.mdx b/docs/src/content/docs/guides/components.mdx
index ee12879528a..26e8c3979d4 100644
--- a/docs/src/content/docs/guides/components.mdx
+++ b/docs/src/content/docs/guides/components.mdx
@@ -76,6 +76,46 @@ The code above generates the following tabs on the page:
 	<TabItem label="Moons">Io, Europa, Ganymede</TabItem>
 </Tabs>
 
+#### Synced tabs
+
+Multiple sets of tabs on the same page can be synced so that switching tabs in one switches the others to a tab with the same label.
+
+To synchronize tabs, add an identical `syncKey` property to each related `<Tabs>` component.
+
+```mdx
+import { Tabs, TabItem } from '@astrojs/starlight/components';
+
+_Some stars:_
+
+<Tabs syncKey="constellations">
+	<TabItem label="Orion">Bellatrix, Rigel, Betelgeuse</TabItem>
+	<TabItem label="Gemini">Pollux, Castor A, Castor B</TabItem>
+</Tabs>
+
+_Some exoplanets:_
+
+<Tabs syncKey="constellations">
+	<TabItem label="Orion">HD 34445 b, Gliese 179 b, Wasp-82 b</TabItem>
+	<TabItem label="Gemini">Pollux b, HAT-P-24b, HD 50554 b</TabItem>
+</Tabs>
+```
+
+The code above generates the following on the page:
+
+_Some stars:_
+
+<Tabs syncKey="constellations">
+	<TabItem label="Orion">Bellatrix, Rigel, Betelgeuse</TabItem>
+	<TabItem label="Gemini">Pollux, Castor A, Castor B</TabItem>
+</Tabs>
+
+_Some exoplanets:_
+
+<Tabs syncKey="constellations">
+	<TabItem label="Orion">HD 34445 b, Gliese 179 b, Wasp-82 b</TabItem>
+	<TabItem label="Gemini">Pollux b, HAT-P-24b, HD 50554 b</TabItem>
+</Tabs>
+
 ### Cards
 
 import { Card, CardGrid } from '@astrojs/starlight/components';

From 79b6e98275424ca19327db366019104149edfa6a Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 10:56:31 +0200
Subject: [PATCH 04/24] docs: use synced tabs in existing docs

---
 docs/src/content/docs/getting-started.mdx         | 4 ++--
 docs/src/content/docs/guides/css-and-tailwind.mdx | 6 +++---
 docs/src/content/docs/guides/customization.mdx    | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/docs/src/content/docs/getting-started.mdx b/docs/src/content/docs/getting-started.mdx
index 827fc086216..405b6646fac 100644
--- a/docs/src/content/docs/getting-started.mdx
+++ b/docs/src/content/docs/getting-started.mdx
@@ -11,7 +11,7 @@ Starlight is a full-featured documentation theme built on top of the [Astro](htt
 
 You can create a new Astro + Starlight project using the following command:
 
-<Tabs>
+<Tabs syncKey="pkg">
 <TabItem label="npm">
 
 ```sh
@@ -89,7 +89,7 @@ Because Starlight is beta software, there will be frequent updates and improveme
 
 Starlight is an Astro integration, and is updated like any `@astrojs/*` integration:
 
-<Tabs>
+<Tabs syncKey="pkg">
 <TabItem label="npm">
 
 ```sh
diff --git a/docs/src/content/docs/guides/css-and-tailwind.mdx b/docs/src/content/docs/guides/css-and-tailwind.mdx
index f159e936d75..4913e2bb8d9 100644
--- a/docs/src/content/docs/guides/css-and-tailwind.mdx
+++ b/docs/src/content/docs/guides/css-and-tailwind.mdx
@@ -59,7 +59,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components';
 
 Start a new Starlight project with Tailwind CSS pre-configured using `create astro`:
 
-<Tabs>
+<Tabs syncKey="pkg">
 <TabItem label="npm">
 
 ```sh
@@ -89,7 +89,7 @@ If you already have a Starlight site and want to add Tailwind CSS, follow these
 
 1.  Add Astro’s Tailwind integration:
 
-    <Tabs>
+    <Tabs syncKey="pkg">
 
     <TabItem label="npm">
 
@@ -119,7 +119,7 @@ If you already have a Starlight site and want to add Tailwind CSS, follow these
 
 2.  Install the Starlight Tailwind plugin:
 
-    <Tabs>
+    <Tabs syncKey="pkg">
 
     <TabItem label="npm">
 
diff --git a/docs/src/content/docs/guides/customization.mdx b/docs/src/content/docs/guides/customization.mdx
index b0df53e9b39..03d85dbf8c6 100644
--- a/docs/src/content/docs/guides/customization.mdx
+++ b/docs/src/content/docs/guides/customization.mdx
@@ -110,7 +110,7 @@ You can customize — or even disable — the table of contents globally in the
 
 By default, `<h2>` and `<h3>` headings are included in the table of contents. Change which headings levels to include site-wide using the `minHeadingLevel` and `maxHeadingLevel` options in your [global `tableOfContents`](/reference/configuration/#tableofcontents). Override these defaults on an individual page by adding the corresponding [frontmatter `tableOfContents`](/reference/frontmatter/#tableofcontents) properties:
 
-<Tabs>
+<Tabs syncKey="config-type">
   <TabItem label="Frontmatter">
 
 ```md
@@ -144,7 +144,7 @@ defineConfig({
 
 Disable the table of contents entirely by setting the `tableOfContents` option to `false`:
 
-<Tabs>
+<Tabs syncKey="config-type">
   <TabItem label="Frontmatter">
 
 ```md

From 9bb696d2f7123ced9d83db88746ac5b691e82017 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 10:57:32 +0200
Subject: [PATCH 05/24] docs: add e2e tests section to contributing guide

---
 CONTRIBUTING.md | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index fac88553819..0c5783b7abc 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -164,6 +164,36 @@ pnpm test:coverage
 
 This will print a table to your terminal and also generate an HTML report you can load in a web browser by opening [`packages/starlight/__coverage__/index.html`](./packages/starlight/__coverage__/index.html).
 
+### E2E tests
+
+Starlight also includes E2E tests in [`packages/starlight/__e2e__/`](./packages/starlight/__e2e__/), which are run using [Playwright][playwright].
+
+To run these tests, move into the Starlight package and then run `pnpm test:e2e`:
+
+```sh
+cd packages/starlight
+pnpm test:e2e
+```
+
+#### Test fixtures
+
+Each subdirectory of `packages/starlight/__e2e__/fixtures` should contain the basic files needed to run Starlight (`package.json`, `astro.config.mjs`, a content collection configuration in `src/content/config.ts` and some content to render in `src/content/docs/`).
+
+The `testFactory()` helper can be used in a test file to define the fixture which will be loaded in a dev server during a set of tests.
+
+```ts
+// packages/starlight/__e2e__/feature.test.ts
+import { testFactory } from './test-utils';
+
+const test = await testFactory('./fixtures/basics/');
+```
+
+This allows you to run tests against different combinations of Astro and Starlight configuration options for various content.
+
+#### When to add E2E tests?
+
+E2E are most useful for testing what happens on a page after it has been loaded by a browser. They run slower than unit tests so they should be used sparingly when unit tests aren’t sufficient.
+
 ## Translations
 
 Translations help make Starlight accessible to more people.
@@ -215,3 +245,4 @@ Visit **<https://i18n.starlight.astro.build>** to track translation progress for
 [gfi]: https://github.com/withastro/starlight/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22+
 [api-docs]: https://docs.astro.build/en/reference/integrations-reference/
 [vitest]: https://vitest.dev/
+[playwright]: https://playwright.dev/

From 23b85c5ec2f1b6e12f82ebf0d2a18625f3b2c80c Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 11:02:04 +0200
Subject: [PATCH 06/24] chore: add changeset

---
 .changeset/config.json       | 2 +-
 .changeset/eight-pens-end.md | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/eight-pens-end.md

diff --git a/.changeset/config.json b/.changeset/config.json
index 363ee484fcd..49f12cd786b 100644
--- a/.changeset/config.json
+++ b/.changeset/config.json
@@ -9,7 +9,7 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["starlight-docs", "@example/*", "docs-i18n-tracker"],
+  "ignore": ["starlight-docs", "@example/*", "docs-i18n-tracker", "@e2e/*"],
   "___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
     "onlyUpdatePeerDependentsWhenOutOfRange": true
   }
diff --git a/.changeset/eight-pens-end.md b/.changeset/eight-pens-end.md
new file mode 100644
index 00000000000..7981e9e90f6
--- /dev/null
+++ b/.changeset/eight-pens-end.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/starlight': minor
+---
+
+Add support for synced tabs

From a5d6f13cdb29eb838256fa7a06e46f0b8023cf64 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 4 Sep 2023 11:20:03 +0200
Subject: [PATCH 07/24] test: update unit test coverage excludes

---
 packages/starlight/vitest.config.ts | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/starlight/vitest.config.ts b/packages/starlight/vitest.config.ts
index b80690ddb63..bf9fab89f9b 100644
--- a/packages/starlight/vitest.config.ts
+++ b/packages/starlight/vitest.config.ts
@@ -11,7 +11,8 @@ const defaultCoverageExcludes = [
 	'test?(-*).?(c|m)[jt]s?(x)',
 	'**/*{.,-}{test,spec}.?(c|m)[jt]s?(x)',
 	'**/__tests__/**',
-	'**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*',
+	'**/__e2e__/**',
+	'**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,playwright}.config.*',
 	'**/.{eslint,mocha,prettier}rc.{?(c|m)js,yml}',
 ];
 
@@ -22,10 +23,10 @@ export default defineConfig({
 			reportsDirectory: './__coverage__',
 			exclude: [...defaultCoverageExcludes, '**/vitest.*', 'components.ts', 'types.ts'],
 			thresholdAutoUpdate: true,
-			lines: 66.57,
-			functions: 88.46,
-			branches: 90.14,
-			statements: 66.57,
+			lines: 66.95,
+			functions: 88.75,
+			branches: 90.28,
+			statements: 66.95,
 		},
 	},
 });

From d99b29cf2772b2949440b2494e3f33fe78de649f Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Wed, 13 Dec 2023 19:38:39 +0100
Subject: [PATCH 08/24] chore: update pr

---
 docs/src/content/docs/getting-started.mdx     |  2 +-
 docs/src/content/docs/guides/components.mdx   |  4 +-
 .../__e2e__/fixtures/basics/package.json      |  2 +-
 packages/starlight/__e2e__/tabs.test.ts       |  4 +-
 packages/starlight/package.json               |  2 +-
 pnpm-lock.yaml                                | 39 ++++++++++++++++++-
 6 files changed, 45 insertions(+), 8 deletions(-)

diff --git a/docs/src/content/docs/getting-started.mdx b/docs/src/content/docs/getting-started.mdx
index d2b68c592d4..dda11123727 100644
--- a/docs/src/content/docs/getting-started.mdx
+++ b/docs/src/content/docs/getting-started.mdx
@@ -52,7 +52,7 @@ When working locally, [Astro’s development server](https://docs.astro.build/en
 
 Inside your project directory, run the following command to start the development server:
 
-<Tabs>
+<Tabs syncKey="pkg">
 <TabItem label="npm">
 
 ```sh
diff --git a/docs/src/content/docs/guides/components.mdx b/docs/src/content/docs/guides/components.mdx
index 54aa96f9d8d..f6103287c6f 100644
--- a/docs/src/content/docs/guides/components.mdx
+++ b/docs/src/content/docs/guides/components.mdx
@@ -84,7 +84,9 @@ Multiple sets of tabs on the same page can be synced so that switching tabs in o
 
 To synchronize tabs, add an identical `syncKey` property to each related `<Tabs>` component.
 
-```mdx
+```mdx 'syncKey="constellations"'
+# src/content/docs/example.mdx
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 
 _Some stars:_
diff --git a/packages/starlight/__e2e__/fixtures/basics/package.json b/packages/starlight/__e2e__/fixtures/basics/package.json
index 1d38f940370..ae6b6476190 100644
--- a/packages/starlight/__e2e__/fixtures/basics/package.json
+++ b/packages/starlight/__e2e__/fixtures/basics/package.json
@@ -4,6 +4,6 @@
   "private": true,
   "dependencies": {
     "@astrojs/starlight": "workspace:*",
-    "astro": "^3.0.6"
+    "astro": "^4.0.1"
   }
 }
diff --git a/packages/starlight/__e2e__/tabs.test.ts b/packages/starlight/__e2e__/tabs.test.ts
index 71f9c7a6359..7ede68fd9a1 100644
--- a/packages/starlight/__e2e__/tabs.test.ts
+++ b/packages/starlight/__e2e__/tabs.test.ts
@@ -92,6 +92,6 @@ test('persists the focus when syncing tabs', async ({ page, starlight }) => {
 });
 
 async function expectSelectedTab(tabs: Locator, label: string, panel: string) {
-	expect(await tabs.getByRole('tab', { selected: true }).textContent()).toBe(label);
-	expect(await tabs.getByRole('tabpanel').textContent()).toBe(panel);
+	expect((await tabs.getByRole('tab', { selected: true }).textContent())?.trim()).toBe(label);
+	expect((await tabs.getByRole('tabpanel').textContent())?.trim()).toBe(panel);
 }
diff --git a/packages/starlight/package.json b/packages/starlight/package.json
index b8a8d52b345..7d50663dca4 100644
--- a/packages/starlight/package.json
+++ b/packages/starlight/package.json
@@ -168,8 +168,8 @@
   },
   "devDependencies": {
     "@astrojs/markdown-remark": "^4.0.0",
-    "@types/node": "^18.16.19",
     "@playwright/test": "^1.37.1",
+    "@types/node": "^18.16.19",
     "@vitest/coverage-v8": "^0.33.0",
     "astro": "^4.0.1",
     "vitest": "^0.33.0"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 91c77958583..a7c1d81adef 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -208,6 +208,9 @@ importers:
       '@astrojs/markdown-remark':
         specifier: ^4.0.0
         version: 4.0.0(astro@4.0.1)
+      '@playwright/test':
+        specifier: ^1.37.1
+        version: 1.40.1
       '@types/node':
         specifier: ^18.16.19
         version: 18.16.19
@@ -227,8 +230,8 @@ importers:
         specifier: workspace:*
         version: link:../../..
       astro:
-        specifier: ^3.0.6
-        version: 3.0.6(@types/node@18.16.19)
+        specifier: ^4.0.1
+        version: 4.0.1(@types/node@18.16.19)
 
   packages/tailwind:
     dependencies:
@@ -1560,6 +1563,14 @@ packages:
     dev: false
     optional: true
 
+  /@playwright/test@1.40.1:
+    resolution: {integrity: sha512-EaaawMTOeEItCRvfmkI9v6rBkF1svM8wjl/YPRrg2N2Wmp+4qJYkWtJsbew1szfKKDm6fPLy4YAanBhIlf9dWw==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dependencies:
+      playwright: 1.40.1
+    dev: true
+
   /@rollup/rollup-android-arm-eabi@4.6.1:
     resolution: {integrity: sha512-0WQ0ouLejaUCRsL93GD4uft3rOmB8qoQMU05Kb8CmMtMBe7XUDLAltxVZI1q6byNqEtU7N1ZX1Vw5lIpgulLQA==}
     cpu: [arm]
@@ -3513,6 +3524,14 @@ packages:
   /fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
+  /fsevents@2.3.2:
+    resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -5659,6 +5678,22 @@ packages:
       pathe: 1.1.1
     dev: true
 
+  /playwright-core@1.40.1:
+    resolution: {integrity: sha512-+hkOycxPiV534c4HhpfX6yrlawqVUzITRKwHAmYfmsVreltEl6fAZJ3DPfLMOODw0H3s1Itd6MDCWmP1fl/QvQ==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dev: true
+
+  /playwright@1.40.1:
+    resolution: {integrity: sha512-2eHI7IioIpQ0bS1Ovg/HszsN/XKNwEG1kbzSDDmADpclKc7CyqkHw7Mg2JCz/bbCxg25QUPcjksoMW7JcIFQmw==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dependencies:
+      playwright-core: 1.40.1
+    optionalDependencies:
+      fsevents: 2.3.2
+    dev: true
+
   /postcss-import@15.1.0(postcss@8.4.32):
     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
     engines: {node: '>=14.0.0'}

From d1d44edf6f45d3ebeaa889e6995d92493246761f Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 25 Mar 2024 10:04:59 +0100
Subject: [PATCH 09/24] chore: update pr

---
 .changeset/config.json                        |   4 +-
 .../__e2e__/fixtures/basics/package.json      |   2 +-
 packages/starlight/package.json               |   6 +-
 pnpm-lock.yaml                                | 279 +++---------------
 4 files changed, 54 insertions(+), 237 deletions(-)

diff --git a/.changeset/config.json b/.changeset/config.json
index 72f48ed9dac..f50e3128e03 100644
--- a/.changeset/config.json
+++ b/.changeset/config.json
@@ -9,8 +9,8 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["starlight-docs", "@example/*", "starlight-file-icons-generator"],
+  "ignore": ["starlight-docs", "@example/*", "starlight-file-icons-generator", "@e2e/*"],
   "___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
     "onlyUpdatePeerDependentsWhenOutOfRange": true
   }
-}
\ No newline at end of file
+}
diff --git a/packages/starlight/__e2e__/fixtures/basics/package.json b/packages/starlight/__e2e__/fixtures/basics/package.json
index ae6b6476190..bbdb1613026 100644
--- a/packages/starlight/__e2e__/fixtures/basics/package.json
+++ b/packages/starlight/__e2e__/fixtures/basics/package.json
@@ -4,6 +4,6 @@
   "private": true,
   "dependencies": {
     "@astrojs/starlight": "workspace:*",
-    "astro": "^4.0.1"
+    "astro": "^4.3.5"
   }
 }
diff --git a/packages/starlight/package.json b/packages/starlight/package.json
index 7359bfb1c54..67f47d72d8b 100644
--- a/packages/starlight/package.json
+++ b/packages/starlight/package.json
@@ -4,7 +4,8 @@
   "description": "Build beautiful, high-performance documentation websites with Astro",
   "scripts": {
     "test": "vitest",
-    "test:coverage": "vitest run --coverage"
+    "test:coverage": "vitest run --coverage",
+    "test:e2e": "playwright install --with-deps chromium && playwright test"
   },
   "keywords": [
     "docs",
@@ -175,6 +176,7 @@
   },
   "devDependencies": {
     "@astrojs/markdown-remark": "^4.2.1",
+    "@playwright/test": "^1.42.1",
     "@types/node": "^18.16.19",
     "@vitest/coverage-v8": "^1.3.1",
     "astro": "^4.3.5",
@@ -202,4 +204,4 @@
     "unist-util-visit": "^5.0.0",
     "vfile": "^6.0.1"
   }
-}
\ No newline at end of file
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 85174455377..77171c07eac 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -188,6 +188,9 @@ importers:
       '@astrojs/markdown-remark':
         specifier: ^4.2.1
         version: 4.2.1
+      '@playwright/test':
+        specifier: ^1.42.1
+        version: 1.42.1
       '@types/node':
         specifier: ^18.16.19
         version: 18.16.19
@@ -201,6 +204,15 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1(@types/node@18.16.19)
 
+  packages/starlight/__e2e__/fixtures/basics:
+    dependencies:
+      '@astrojs/starlight':
+        specifier: workspace:*
+        version: link:../../..
+      astro:
+        specifier: ^4.3.5
+        version: 4.3.5(@types/node@18.16.19)
+
   packages/tailwind:
     dependencies:
       '@astrojs/starlight':
@@ -948,7 +960,6 @@ packages:
     cpu: [ppc64]
     os: [aix]
     requiresBuild: true
-    dev: false
     optional: true
 
   /@esbuild/android-arm64@0.19.12:
@@ -957,15 +968,6 @@ packages:
     cpu: [arm64]
     os: [android]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/android-arm64@0.19.8:
-    resolution: {integrity: sha512-B8JbS61bEunhfx8kasogFENgQfr/dIp+ggYXwTqdbMAgGDhRa3AaPpQMuQU0rNxDLECj6FhDzk1cF9WHMVwrtA==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [android]
-    requiresBuild: true
     optional: true
 
   /@esbuild/android-arm@0.19.12:
@@ -974,15 +976,6 @@ packages:
     cpu: [arm]
     os: [android]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/android-arm@0.19.8:
-    resolution: {integrity: sha512-31E2lxlGM1KEfivQl8Yf5aYU/mflz9g06H6S15ITUFQueMFtFjESRMoDSkvMo8thYvLBax+VKTPlpnx+sPicOA==}
-    engines: {node: '>=12'}
-    cpu: [arm]
-    os: [android]
-    requiresBuild: true
     optional: true
 
   /@esbuild/android-x64@0.19.12:
@@ -991,15 +984,6 @@ packages:
     cpu: [x64]
     os: [android]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/android-x64@0.19.8:
-    resolution: {integrity: sha512-rdqqYfRIn4jWOp+lzQttYMa2Xar3OK9Yt2fhOhzFXqg0rVWEfSclJvZq5fZslnz6ypHvVf3CT7qyf0A5pM682A==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [android]
-    requiresBuild: true
     optional: true
 
   /@esbuild/darwin-arm64@0.19.12:
@@ -1008,15 +992,6 @@ packages:
     cpu: [arm64]
     os: [darwin]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/darwin-arm64@0.19.8:
-    resolution: {integrity: sha512-RQw9DemMbIq35Bprbboyf8SmOr4UXsRVxJ97LgB55VKKeJOOdvsIPy0nFyF2l8U+h4PtBx/1kRf0BelOYCiQcw==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [darwin]
-    requiresBuild: true
     optional: true
 
   /@esbuild/darwin-x64@0.19.12:
@@ -1025,15 +1000,6 @@ packages:
     cpu: [x64]
     os: [darwin]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/darwin-x64@0.19.8:
-    resolution: {integrity: sha512-3sur80OT9YdeZwIVgERAysAbwncom7b4bCI2XKLjMfPymTud7e/oY4y+ci1XVp5TfQp/bppn7xLw1n/oSQY3/Q==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [darwin]
-    requiresBuild: true
     optional: true
 
   /@esbuild/freebsd-arm64@0.19.12:
@@ -1042,15 +1008,6 @@ packages:
     cpu: [arm64]
     os: [freebsd]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/freebsd-arm64@0.19.8:
-    resolution: {integrity: sha512-WAnPJSDattvS/XtPCTj1tPoTxERjcTpH6HsMr6ujTT+X6rylVe8ggxk8pVxzf5U1wh5sPODpawNicF5ta/9Tmw==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [freebsd]
-    requiresBuild: true
     optional: true
 
   /@esbuild/freebsd-x64@0.19.12:
@@ -1059,15 +1016,6 @@ packages:
     cpu: [x64]
     os: [freebsd]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/freebsd-x64@0.19.8:
-    resolution: {integrity: sha512-ICvZyOplIjmmhjd6mxi+zxSdpPTKFfyPPQMQTK/w+8eNK6WV01AjIztJALDtwNNfFhfZLux0tZLC+U9nSyA5Zg==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [freebsd]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-arm64@0.19.12:
@@ -1076,15 +1024,6 @@ packages:
     cpu: [arm64]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-arm64@0.19.8:
-    resolution: {integrity: sha512-z1zMZivxDLHWnyGOctT9JP70h0beY54xDDDJt4VpTX+iwA77IFsE1vCXWmprajJGa+ZYSqkSbRQ4eyLCpCmiCQ==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-arm@0.19.12:
@@ -1093,15 +1032,6 @@ packages:
     cpu: [arm]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-arm@0.19.8:
-    resolution: {integrity: sha512-H4vmI5PYqSvosPaTJuEppU9oz1dq2A7Mr2vyg5TF9Ga+3+MGgBdGzcyBP7qK9MrwFQZlvNyJrvz6GuCaj3OukQ==}
-    engines: {node: '>=12'}
-    cpu: [arm]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-ia32@0.19.12:
@@ -1110,15 +1040,6 @@ packages:
     cpu: [ia32]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-ia32@0.19.8:
-    resolution: {integrity: sha512-1a8suQiFJmZz1khm/rDglOc8lavtzEMRo0v6WhPgxkrjcU0LkHj+TwBrALwoz/OtMExvsqbbMI0ChyelKabSvQ==}
-    engines: {node: '>=12'}
-    cpu: [ia32]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-loong64@0.19.12:
@@ -1127,15 +1048,6 @@ packages:
     cpu: [loong64]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-loong64@0.19.8:
-    resolution: {integrity: sha512-fHZWS2JJxnXt1uYJsDv9+b60WCc2RlvVAy1F76qOLtXRO+H4mjt3Tr6MJ5l7Q78X8KgCFudnTuiQRBhULUyBKQ==}
-    engines: {node: '>=12'}
-    cpu: [loong64]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-mips64el@0.19.12:
@@ -1144,15 +1056,6 @@ packages:
     cpu: [mips64el]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-mips64el@0.19.8:
-    resolution: {integrity: sha512-Wy/z0EL5qZYLX66dVnEg9riiwls5IYnziwuju2oUiuxVc+/edvqXa04qNtbrs0Ukatg5HEzqT94Zs7J207dN5Q==}
-    engines: {node: '>=12'}
-    cpu: [mips64el]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-ppc64@0.19.12:
@@ -1161,15 +1064,6 @@ packages:
     cpu: [ppc64]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-ppc64@0.19.8:
-    resolution: {integrity: sha512-ETaW6245wK23YIEufhMQ3HSeHO7NgsLx8gygBVldRHKhOlD1oNeNy/P67mIh1zPn2Hr2HLieQrt6tWrVwuqrxg==}
-    engines: {node: '>=12'}
-    cpu: [ppc64]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-riscv64@0.19.12:
@@ -1178,15 +1072,6 @@ packages:
     cpu: [riscv64]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-riscv64@0.19.8:
-    resolution: {integrity: sha512-T2DRQk55SgoleTP+DtPlMrxi/5r9AeFgkhkZ/B0ap99zmxtxdOixOMI570VjdRCs9pE4Wdkz7JYrsPvsl7eESg==}
-    engines: {node: '>=12'}
-    cpu: [riscv64]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-s390x@0.19.12:
@@ -1195,15 +1080,6 @@ packages:
     cpu: [s390x]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-s390x@0.19.8:
-    resolution: {integrity: sha512-NPxbdmmo3Bk7mbNeHmcCd7R7fptJaczPYBaELk6NcXxy7HLNyWwCyDJ/Xx+/YcNH7Im5dHdx9gZ5xIwyliQCbg==}
-    engines: {node: '>=12'}
-    cpu: [s390x]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/linux-x64@0.19.12:
@@ -1212,15 +1088,6 @@ packages:
     cpu: [x64]
     os: [linux]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/linux-x64@0.19.8:
-    resolution: {integrity: sha512-lytMAVOM3b1gPypL2TRmZ5rnXl7+6IIk8uB3eLsV1JwcizuolblXRrc5ShPrO9ls/b+RTp+E6gbsuLWHWi2zGg==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
     optional: true
 
   /@esbuild/netbsd-x64@0.19.12:
@@ -1229,15 +1096,6 @@ packages:
     cpu: [x64]
     os: [netbsd]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/netbsd-x64@0.19.8:
-    resolution: {integrity: sha512-hvWVo2VsXz/8NVt1UhLzxwAfo5sioj92uo0bCfLibB0xlOmimU/DeAEsQILlBQvkhrGjamP0/el5HU76HAitGw==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [netbsd]
-    requiresBuild: true
     optional: true
 
   /@esbuild/openbsd-x64@0.19.12:
@@ -1246,15 +1104,6 @@ packages:
     cpu: [x64]
     os: [openbsd]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/openbsd-x64@0.19.8:
-    resolution: {integrity: sha512-/7Y7u77rdvmGTxR83PgaSvSBJCC2L3Kb1M/+dmSIvRvQPXXCuC97QAwMugBNG0yGcbEGfFBH7ojPzAOxfGNkwQ==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [openbsd]
-    requiresBuild: true
     optional: true
 
   /@esbuild/sunos-x64@0.19.12:
@@ -1263,15 +1112,6 @@ packages:
     cpu: [x64]
     os: [sunos]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/sunos-x64@0.19.8:
-    resolution: {integrity: sha512-9Lc4s7Oi98GqFA4HzA/W2JHIYfnXbUYgekUP/Sm4BG9sfLjyv6GKKHKKVs83SMicBF2JwAX6A1PuOLMqpD001w==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [sunos]
-    requiresBuild: true
     optional: true
 
   /@esbuild/win32-arm64@0.19.12:
@@ -1280,15 +1120,6 @@ packages:
     cpu: [arm64]
     os: [win32]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/win32-arm64@0.19.8:
-    resolution: {integrity: sha512-rq6WzBGjSzihI9deW3fC2Gqiak68+b7qo5/3kmB6Gvbh/NYPA0sJhrnp7wgV4bNwjqM+R2AApXGxMO7ZoGhIJg==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [win32]
-    requiresBuild: true
     optional: true
 
   /@esbuild/win32-ia32@0.19.12:
@@ -1297,15 +1128,6 @@ packages:
     cpu: [ia32]
     os: [win32]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/win32-ia32@0.19.8:
-    resolution: {integrity: sha512-AIAbverbg5jMvJznYiGhrd3sumfwWs8572mIJL5NQjJa06P8KfCPWZQ0NwZbPQnbQi9OWSZhFVSUWjjIrn4hSw==}
-    engines: {node: '>=12'}
-    cpu: [ia32]
-    os: [win32]
-    requiresBuild: true
     optional: true
 
   /@esbuild/win32-x64@0.19.12:
@@ -1314,15 +1136,6 @@ packages:
     cpu: [x64]
     os: [win32]
     requiresBuild: true
-    dev: false
-    optional: true
-
-  /@esbuild/win32-x64@0.19.8:
-    resolution: {integrity: sha512-bfZ0cQ1uZs2PqpulNL5j/3w+GDhP36k1K5c38QdQg+Swy51jFZWWeIkteNsufkQxp986wnqRRsb/bHbY1WQ7TA==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [win32]
-    requiresBuild: true
     optional: true
 
   /@expressive-code/core@0.33.4:
@@ -1593,6 +1406,14 @@ packages:
       parse5: 7.1.2
     dev: false
 
+  /@playwright/test@1.42.1:
+    resolution: {integrity: sha512-Gq9rmS54mjBL/7/MvBaNOBwbfnh7beHvS6oS4srqXFcQHpQCV1+c8JXWE8VLPyRDhgS3H8x8A7hztqI9VnwrAQ==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dependencies:
+      playwright: 1.42.1
+    dev: true
+
   /@rollup/rollup-android-arm-eabi@4.6.1:
     resolution: {integrity: sha512-0WQ0ouLejaUCRsL93GD4uft3rOmB8qoQMU05Kb8CmMtMBe7XUDLAltxVZI1q6byNqEtU7N1ZX1Vw5lIpgulLQA==}
     cpu: [arm]
@@ -2132,7 +1953,7 @@ packages:
       dlv: 1.1.3
       dset: 3.1.3
       es-module-lexer: 1.4.1
-      esbuild: 0.19.8
+      esbuild: 0.19.12
       estree-walker: 3.0.3
       execa: 8.0.1
       fast-glob: 3.3.2
@@ -3036,36 +2857,6 @@ packages:
       '@esbuild/win32-arm64': 0.19.12
       '@esbuild/win32-ia32': 0.19.12
       '@esbuild/win32-x64': 0.19.12
-    dev: false
-
-  /esbuild@0.19.8:
-    resolution: {integrity: sha512-l7iffQpT2OrZfH2rXIp7/FkmaeZM0vxbxN9KfiCwGYuZqzMg/JdvX26R31Zxn/Pxvsrg3Y9N6XTcnknqDyyv4w==}
-    engines: {node: '>=12'}
-    hasBin: true
-    requiresBuild: true
-    optionalDependencies:
-      '@esbuild/android-arm': 0.19.8
-      '@esbuild/android-arm64': 0.19.8
-      '@esbuild/android-x64': 0.19.8
-      '@esbuild/darwin-arm64': 0.19.8
-      '@esbuild/darwin-x64': 0.19.8
-      '@esbuild/freebsd-arm64': 0.19.8
-      '@esbuild/freebsd-x64': 0.19.8
-      '@esbuild/linux-arm': 0.19.8
-      '@esbuild/linux-arm64': 0.19.8
-      '@esbuild/linux-ia32': 0.19.8
-      '@esbuild/linux-loong64': 0.19.8
-      '@esbuild/linux-mips64el': 0.19.8
-      '@esbuild/linux-ppc64': 0.19.8
-      '@esbuild/linux-riscv64': 0.19.8
-      '@esbuild/linux-s390x': 0.19.8
-      '@esbuild/linux-x64': 0.19.8
-      '@esbuild/netbsd-x64': 0.19.8
-      '@esbuild/openbsd-x64': 0.19.8
-      '@esbuild/sunos-x64': 0.19.8
-      '@esbuild/win32-arm64': 0.19.8
-      '@esbuild/win32-ia32': 0.19.8
-      '@esbuild/win32-x64': 0.19.8
 
   /escalade@3.1.1:
     resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
@@ -3349,6 +3140,14 @@ packages:
   /fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
+  /fsevents@2.3.2:
+    resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -5578,6 +5377,22 @@ packages:
       pathe: 1.1.2
     dev: true
 
+  /playwright-core@1.42.1:
+    resolution: {integrity: sha512-mxz6zclokgrke9p1vtdy/COWBH+eOZgYUVVU34C73M+4j4HLlQJHtfcqiqqxpP0o8HhMkflvfbquLX5dg6wlfA==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dev: true
+
+  /playwright@1.42.1:
+    resolution: {integrity: sha512-PgwB03s2DZBcNRoW+1w9E+VkLBxweib6KTXM0M3tkiT4jVxKSi6PmVJ591J+0u10LUrgxB7dLRbiJqO5s2QPMg==}
+    engines: {node: '>=16'}
+    hasBin: true
+    dependencies:
+      playwright-core: 1.42.1
+    optionalDependencies:
+      fsevents: 2.3.2
+    dev: true
+
   /postcss-import@15.1.0(postcss@8.4.33):
     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
     engines: {node: '>=14.0.0'}
@@ -7134,7 +6949,7 @@ packages:
         optional: true
     dependencies:
       '@types/node': 18.16.19
-      esbuild: 0.19.8
+      esbuild: 0.19.12
       postcss: 8.4.33
       rollup: 4.6.1
     optionalDependencies:
@@ -7458,4 +7273,4 @@ packages:
     resolution: {integrity: sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==}
 
   /zwitch@2.0.4:
-    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
\ No newline at end of file
+    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}

From f81a85ec56e253c659a2c244eb50dc69134331c3 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 25 Mar 2024 15:46:16 +0100
Subject: [PATCH 10/24] fix: make tabs `syncKey` prop optional

---
 packages/starlight/user-components/Tabs.astro | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/starlight/user-components/Tabs.astro b/packages/starlight/user-components/Tabs.astro
index 54c721fae9b..629b996c70e 100644
--- a/packages/starlight/user-components/Tabs.astro
+++ b/packages/starlight/user-components/Tabs.astro
@@ -3,7 +3,7 @@ import Icon from './Icon.astro';
 import { processPanels } from './rehype-tabs';
 
 interface Props {
-	syncKey: string;
+	syncKey?: string;
 }
 
 const { syncKey } = Astro.props;

From f43068228519be2778b999283c8b10f06287616a Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Tue, 26 Mar 2024 10:48:56 +0100
Subject: [PATCH 11/24] feat: add tab scroll position lock

---
 .../src/content/docs/tabs-variable-height.mdx | 151 ++++++++++++++++++
 packages/starlight/__e2e__/tabs.test.ts       |  25 +++
 packages/starlight/style/props.css            |   2 +-
 packages/starlight/user-components/Tabs.astro |   7 +
 4 files changed, 184 insertions(+), 1 deletion(-)
 create mode 100644 packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs-variable-height.mdx

diff --git a/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs-variable-height.mdx b/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs-variable-height.mdx
new file mode 100644
index 00000000000..7c7a0485864
--- /dev/null
+++ b/packages/starlight/__e2e__/fixtures/basics/src/content/docs/tabs-variable-height.mdx
@@ -0,0 +1,151 @@
+---
+title: Tabs with varying content heights
+---
+
+import { Tabs, TabItem } from '@astrojs/starlight/components';
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+**A set of tabs using a sync key with content of different heights between tabs.**
+
+<Tabs syncKey="things">
+<TabItem label="A">
+
+A little bit of text.
+
+</TabItem>
+<TabItem label="B">
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+</TabItem>
+</Tabs>
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+**Another set of tabs using the same sync key with content of different heights between tabs.**
+
+<Tabs syncKey="things">
+<TabItem label="A">
+
+A little bit of text.
+
+</TabItem>
+<TabItem label="B">
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+A lot more text.
+
+</TabItem>
+</Tabs>
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
diff --git a/packages/starlight/__e2e__/tabs.test.ts b/packages/starlight/__e2e__/tabs.test.ts
index 7ede68fd9a1..e0a36ed5367 100644
--- a/packages/starlight/__e2e__/tabs.test.ts
+++ b/packages/starlight/__e2e__/tabs.test.ts
@@ -91,6 +91,31 @@ test('persists the focus when syncing tabs', async ({ page, starlight }) => {
 	).toBe(true);
 });
 
+test('preserves tabs position when alternating between tabs with different content heights', async ({
+	page,
+	starlight,
+}) => {
+	await starlight.goto('/tabs-variable-height');
+
+	const tabs = page.locator('starlight-tabs').nth(1);
+	const selectedTab = tabs.getByRole('tab', { selected: true });
+
+	// Scroll to the second set of synced tabs and focus the selected tab.
+	await tabs.scrollIntoViewIfNeeded();
+	await selectedTab.focus();
+
+	// Get the bounding box of the tabs.
+	const initialBoundingBox = await tabs.boundingBox();
+
+	// Select the second tab which has a different height.
+	await selectedTab.press('ArrowRight');
+
+	// Ensure the tabs vertical position is exactly the same after selecting the second tab.
+	// Note that a small difference could be the result of the base line-height having a fractional part which can cause a
+	// sub-pixel difference in some browsers like Chrome or Firefox.
+	expect((await tabs.boundingBox())?.y).toBe(initialBoundingBox?.y);
+});
+
 async function expectSelectedTab(tabs: Locator, label: string, panel: string) {
 	expect((await tabs.getByRole('tab', { selected: true }).textContent())?.trim()).toBe(label);
 	expect((await tabs.getByRole('tabpanel').textContent())?.trim()).toBe(panel);
diff --git a/packages/starlight/style/props.css b/packages/starlight/style/props.css
index be9bbb9d74a..d8ef97ea4dd 100644
--- a/packages/starlight/style/props.css
+++ b/packages/starlight/style/props.css
@@ -79,7 +79,7 @@
 	--sl-text-h4: var(--sl-text-xl);
 	--sl-text-h5: var(--sl-text-lg);
 
-	--sl-line-height: 1.8;
+	--sl-line-height: 1.75;
 	--sl-line-height-headings: 1.2;
 
 	--sl-font-system: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
diff --git a/packages/starlight/user-components/Tabs.astro b/packages/starlight/user-components/Tabs.astro
index 629b996c70e..eaddc5e9283 100644
--- a/packages/starlight/user-components/Tabs.astro
+++ b/packages/starlight/user-components/Tabs.astro
@@ -136,6 +136,10 @@ const { html, panels } = processPanels(panelHtml);
 		switchTab(newTab: HTMLAnchorElement | null | undefined, index: number, shouldSync = true) {
 			if (!newTab) return;
 
+			// We store the current position so we can restore it after switching tabs to prevent the page from jumping when
+			// the new tab content is of a different height than the previous tab.
+			const previousTabsOffset = this.getBoundingClientRect().top;
+
 			// Mark all tabs as unselected and hide all tab panels.
 			this.tabs.forEach((tab) => {
 				tab.removeAttribute('aria-selected');
@@ -154,6 +158,9 @@ const { html, panels } = processPanels(panelHtml);
 			if (shouldSync) {
 				newTab.focus();
 				StarlightTabs.#syncTabs(this, newTab.textContent);
+				window.scrollTo({
+					top: window.scrollY + (this.getBoundingClientRect().top - previousTabsOffset),
+				});
 			}
 		}
 

From ea0ffcc125d68f319f2e0f38d4f64df82617b1af Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Tue, 26 Mar 2024 10:59:31 +0100
Subject: [PATCH 12/24] chore: update changeset

---
 .changeset/eight-pens-end.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/eight-pens-end.md b/.changeset/eight-pens-end.md
index 7981e9e90f6..4aaee094c93 100644
--- a/.changeset/eight-pens-end.md
+++ b/.changeset/eight-pens-end.md
@@ -2,4 +2,4 @@
 '@astrojs/starlight': minor
 ---
 
-Add support for synced tabs
+Adds support for syncing multiple sets of tabs on the same page.

From a878d7605e6a7739ceca10937213e656470cde3c Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Tue, 26 Mar 2024 11:01:37 +0100
Subject: [PATCH 13/24] ci: update e2e tests workflow

---
 .github/workflows/ci.yml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 61a20efb33b..beb12cf4dd5 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -34,9 +34,9 @@ jobs:
     name: Run E2E tests
     runs-on: ubuntu-20.04
     steps:
-      - uses: actions/checkout@v3
-      - uses: pnpm/action-setup@v2
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v3
+      - uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
           cache: 'pnpm'

From eff441f6f16cde1aecd7911b93ea333a1e2def1c Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:04:33 +0200
Subject: [PATCH 14/24] refactor: calculate `previousTabsOffset` only for
 synced tabs

---
 packages/starlight/user-components/Tabs.astro | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/starlight/user-components/Tabs.astro b/packages/starlight/user-components/Tabs.astro
index 81880fc2e9d..376fb19c935 100644
--- a/packages/starlight/user-components/Tabs.astro
+++ b/packages/starlight/user-components/Tabs.astro
@@ -136,9 +136,10 @@ const { html, panels } = processPanels(panelHtml);
 		switchTab(newTab: HTMLAnchorElement | null | undefined, index: number, shouldSync = true) {
 			if (!newTab) return;
 
-			// We store the current position so we can restore it after switching tabs to prevent the page from jumping when
-			// the new tab content is of a different height than the previous tab.
-			const previousTabsOffset = this.getBoundingClientRect().top;
+			// If tabs should be synced, we store the current position so we can restore it after
+			// switching tabs to prevent the page from jumping when the new tab content is of a different
+			// height than the previous tab.
+			const previousTabsOffset = shouldSync ? this.getBoundingClientRect().top : 0;
 
 			// Mark all tabs as unselected and hide all tab panels.
 			this.tabs.forEach((tab) => {

From 0c222321cbb9f0afcee3e448d13ef41b9e28592f Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:07:54 +0200
Subject: [PATCH 15/24] docs: spell out E2E tests acronym

Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com>
---
 CONTRIBUTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 6b734221089..248a55b22b8 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -187,7 +187,7 @@ pnpm test:coverage
 
 This will print a table to your terminal and also generate an HTML report you can load in a web browser by opening [`packages/starlight/__coverage__/index.html`](./packages/starlight/__coverage__/index.html).
 
-### E2E tests
+### End-to-end (E2E) tests
 
 Starlight also includes E2E tests in [`packages/starlight/__e2e__/`](./packages/starlight/__e2e__/), which are run using [Playwright][playwright].
 

From 7649aca8395d15d6827a1334ddf1dbe8cb3e4d5b Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:10:36 +0200
Subject: [PATCH 16/24] docs: update sync tabs documentation

Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com>
---
 docs/src/content/docs/guides/components.mdx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/docs/src/content/docs/guides/components.mdx b/docs/src/content/docs/guides/components.mdx
index a728dbb34ca..56aa3b8bf2e 100644
--- a/docs/src/content/docs/guides/components.mdx
+++ b/docs/src/content/docs/guides/components.mdx
@@ -89,7 +89,8 @@ The code above generates the following tabs on the page:
 
 #### Synced tabs
 
-Multiple sets of tabs on the same page can be synced so that switching tabs in one switches the others to a tab with the same label.
+Keep multiple sets of tabs on the same page in sync with the `syncKey` attribute.
+Switching to a synced tab will also switch to the tab with the same label in other `<Tabs>` that share the same `syncKey`.
 
 To synchronize tabs, add an identical `syncKey` property to each related `<Tabs>` component.
 

From 543e992042b22d7f4e52c6d4beb0bea254d8eacf Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:16:47 +0200
Subject: [PATCH 17/24] chore: add line height changeset

---
 .changeset/slimy-swans-teach.md | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 .changeset/slimy-swans-teach.md

diff --git a/.changeset/slimy-swans-teach.md b/.changeset/slimy-swans-teach.md
new file mode 100644
index 00000000000..ae11506755d
--- /dev/null
+++ b/.changeset/slimy-swans-teach.md
@@ -0,0 +1,13 @@
+---
+'@astrojs/starlight': minor
+---
+
+Updates the default `line-height` from `1.8` to `1.75`. This change avoids having a line height with a fractional part which can cause scripts accessing dimensions involving the line height to get an inconsistent rounded value in various browsers.
+
+If you want to preserve the previous `line-height`, you can add the following custom CSS to your site:
+
+```css
+:root {
+  --sl-line-height: 1.8;
+}
+```

From d98003f504661c1e28d3c45ce25995924ddbca0c Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:35:24 +0200
Subject: [PATCH 18/24] test: add traces

---
 packages/starlight/playwright.config.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/starlight/playwright.config.ts b/packages/starlight/playwright.config.ts
index 01098ea8b0d..fea602b4730 100644
--- a/packages/starlight/playwright.config.ts
+++ b/packages/starlight/playwright.config.ts
@@ -12,4 +12,7 @@ export default defineConfig({
 		},
 	],
 	testMatch: '__e2e__/*.test.ts',
+	use: {
+		trace: 'retain-on-failure',
+	},
 });

From bad60e451afb33b52f5b96615ab7414252c062a7 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 13:49:26 +0200
Subject: [PATCH 19/24] test: save e2e reports

---
 .github/workflows/ci.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index beb12cf4dd5..e24a93a3165 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -43,6 +43,12 @@ jobs:
       - run: pnpm i
       - name: Test packages
         run: pnpm -r test:e2e
+      - uses: actions/upload-artifact@v4
+        if: ${{ !cancelled() }}
+        with:
+          name: playwright-report
+          path: packages/starlight/test-results
+          retention-days: 10
 
   pa11y:
     name: Check for accessibility issues

From a8989df296f2684c9330cf7a4755dcd55e0298dc Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 14:11:54 +0200
Subject: [PATCH 20/24] test: disable dev toolbar

---
 packages/starlight/__e2e__/test-utils.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/starlight/__e2e__/test-utils.ts b/packages/starlight/__e2e__/test-utils.ts
index 376ac910697..5d8b5c54281 100644
--- a/packages/starlight/__e2e__/test-utils.ts
+++ b/packages/starlight/__e2e__/test-utils.ts
@@ -23,6 +23,7 @@ export async function testFactory(fixturePath: string) {
 		devServer = await dev({
 			logLevel: 'error',
 			root: fileURLToPath(new URL(fixturePath, import.meta.url)),
+			devToolbar: { enabled: false },
 		});
 	});
 

From 6a1a5e1519246b7cfd7b714a32fd162e56a265e3 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 14:34:48 +0200
Subject: [PATCH 21/24] test: use prod build for e2e tests

---
 .github/workflows/ci.yml                 |  6 -----
 packages/starlight/__e2e__/.gitignore    |  1 +
 packages/starlight/__e2e__/test-utils.ts | 30 +++++++++++-------------
 packages/starlight/package.json          |  2 +-
 packages/starlight/playwright.config.ts  |  3 ---
 pnpm-lock.yaml                           | 20 ++++++++--------
 6 files changed, 26 insertions(+), 36 deletions(-)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index e24a93a3165..beb12cf4dd5 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -43,12 +43,6 @@ jobs:
       - run: pnpm i
       - name: Test packages
         run: pnpm -r test:e2e
-      - uses: actions/upload-artifact@v4
-        if: ${{ !cancelled() }}
-        with:
-          name: playwright-report
-          path: packages/starlight/test-results
-          retention-days: 10
 
   pa11y:
     name: Check for accessibility issues
diff --git a/packages/starlight/__e2e__/.gitignore b/packages/starlight/__e2e__/.gitignore
index f5bd2c4897e..bde2931f74f 100644
--- a/packages/starlight/__e2e__/.gitignore
+++ b/packages/starlight/__e2e__/.gitignore
@@ -1,2 +1,3 @@
 # generated types
 .astro/
+dist/
diff --git a/packages/starlight/__e2e__/test-utils.ts b/packages/starlight/__e2e__/test-utils.ts
index 5d8b5c54281..e604732357d 100644
--- a/packages/starlight/__e2e__/test-utils.ts
+++ b/packages/starlight/__e2e__/test-utils.ts
@@ -1,34 +1,32 @@
 import { fileURLToPath } from 'node:url';
 import { test as baseTest, type Page } from '@playwright/test';
-import { dev } from 'astro';
+import { build, preview } from 'astro';
 
 export { expect, type Locator } from '@playwright/test';
 
-// Setup a test environment that will start a dev server for a given fixture path and provide a
-// Starlight Playwright fixture accessible from within all tests.
+// Setup a test environment that will build and start a preview server for a given fixture path and
+// provide a Starlight Playwright fixture accessible from within all tests.
 export async function testFactory(fixturePath: string) {
-	let devServer: DevServer | undefined;
+	let previewServer: PreviewServer | undefined;
 
 	const test = baseTest.extend<{ starlight: StarlightPage }>({
 		starlight: async ({ page }, use) => {
-			if (!devServer) {
-				throw new Error('Could not find a dev server to run tests against.');
+			if (!previewServer) {
+				throw new Error('Could not find a preview server to run tests against.');
 			}
 
-			await use(new StarlightPage(devServer, page));
+			await use(new StarlightPage(previewServer, page));
 		},
 	});
 
 	test.beforeAll(async () => {
-		devServer = await dev({
-			logLevel: 'error',
-			root: fileURLToPath(new URL(fixturePath, import.meta.url)),
-			devToolbar: { enabled: false },
-		});
+		const root = fileURLToPath(new URL(fixturePath, import.meta.url));
+		await build({ logLevel: 'error', root });
+		previewServer = await preview({ logLevel: 'error', root });
 	});
 
 	test.afterAll(async () => {
-		await devServer?.stop();
+		await previewServer?.stop();
 	});
 
 	return test;
@@ -37,7 +35,7 @@ export async function testFactory(fixturePath: string) {
 // A Playwright test fixture accessible from within all tests.
 class StarlightPage {
 	constructor(
-		private readonly devServer: DevServer,
+		private readonly previewServer: PreviewServer,
 		private readonly page: Page
 	) {}
 
@@ -48,8 +46,8 @@ class StarlightPage {
 
 	// Resolve a URL relative to the server used during a test run.
 	resolveUrl(url: string) {
-		return `http://localhost:${this.devServer.address.port}${url.replace(/^\/?/, '/')}`;
+		return `http://localhost:${this.previewServer.port}${url.replace(/^\/?/, '/')}`;
 	}
 }
 
-type DevServer = Awaited<ReturnType<typeof dev>>;
+type PreviewServer = Awaited<ReturnType<typeof preview>>;
diff --git a/packages/starlight/package.json b/packages/starlight/package.json
index 600bf6ea0ad..e7c71efd847 100644
--- a/packages/starlight/package.json
+++ b/packages/starlight/package.json
@@ -176,7 +176,7 @@
   },
   "devDependencies": {
     "@astrojs/markdown-remark": "^4.2.1",
-    "@playwright/test": "^1.42.1",
+    "@playwright/test": "^1.43.1",
     "@types/node": "^18.16.19",
     "@vitest/coverage-v8": "^1.3.1",
     "astro": "^4.3.5",
diff --git a/packages/starlight/playwright.config.ts b/packages/starlight/playwright.config.ts
index fea602b4730..01098ea8b0d 100644
--- a/packages/starlight/playwright.config.ts
+++ b/packages/starlight/playwright.config.ts
@@ -12,7 +12,4 @@ export default defineConfig({
 		},
 	],
 	testMatch: '__e2e__/*.test.ts',
-	use: {
-		trace: 'retain-on-failure',
-	},
 });
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f7d06d85a89..de483906347 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -186,8 +186,8 @@ importers:
         specifier: ^4.2.1
         version: 4.2.1
       '@playwright/test':
-        specifier: ^1.42.1
-        version: 1.42.1
+        specifier: ^1.43.1
+        version: 1.43.1
       '@types/node':
         specifier: ^18.16.19
         version: 18.16.19
@@ -1403,12 +1403,12 @@ packages:
       parse5: 7.1.2
     dev: false
 
-  /@playwright/test@1.42.1:
-    resolution: {integrity: sha512-Gq9rmS54mjBL/7/MvBaNOBwbfnh7beHvS6oS4srqXFcQHpQCV1+c8JXWE8VLPyRDhgS3H8x8A7hztqI9VnwrAQ==}
+  /@playwright/test@1.43.1:
+    resolution: {integrity: sha512-HgtQzFgNEEo4TE22K/X7sYTYNqEMMTZmFS8kTq6m8hXj+m1D8TgwgIbumHddJa9h4yl4GkKb8/bgAl2+g7eDgA==}
     engines: {node: '>=16'}
     hasBin: true
     dependencies:
-      playwright: 1.42.1
+      playwright: 1.43.1
     dev: true
 
   /@rollup/rollup-android-arm-eabi@4.6.1:
@@ -5374,18 +5374,18 @@ packages:
       pathe: 1.1.2
     dev: true
 
-  /playwright-core@1.42.1:
-    resolution: {integrity: sha512-mxz6zclokgrke9p1vtdy/COWBH+eOZgYUVVU34C73M+4j4HLlQJHtfcqiqqxpP0o8HhMkflvfbquLX5dg6wlfA==}
+  /playwright-core@1.43.1:
+    resolution: {integrity: sha512-EI36Mto2Vrx6VF7rm708qSnesVQKbxEWvPrfA1IPY6HgczBplDx7ENtx+K2n4kJ41sLLkuGfmb0ZLSSXlDhqPg==}
     engines: {node: '>=16'}
     hasBin: true
     dev: true
 
-  /playwright@1.42.1:
-    resolution: {integrity: sha512-PgwB03s2DZBcNRoW+1w9E+VkLBxweib6KTXM0M3tkiT4jVxKSi6PmVJ591J+0u10LUrgxB7dLRbiJqO5s2QPMg==}
+  /playwright@1.43.1:
+    resolution: {integrity: sha512-V7SoH0ai2kNt1Md9E3Gwas5B9m8KR2GVvwZnAI6Pg0m3sh7UvgiYhRrhsziCmqMJNouPckiOhk8T+9bSAK0VIA==}
     engines: {node: '>=16'}
     hasBin: true
     dependencies:
-      playwright-core: 1.42.1
+      playwright-core: 1.43.1
     optionalDependencies:
       fsevents: 2.3.2
     dev: true

From 101e5d62a7ac4ab2284bcab760df3af072073fc4 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Mon, 15 Apr 2024 15:12:31 +0200
Subject: [PATCH 22/24] docs: update `testFactory()` description in
 CONTRIBUTING.md

---
 CONTRIBUTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 248a55b22b8..973d01ef261 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -202,7 +202,7 @@ pnpm test:e2e
 
 Each subdirectory of `packages/starlight/__e2e__/fixtures` should contain the basic files needed to run Starlight (`package.json`, `astro.config.mjs`, a content collection configuration in `src/content/config.ts` and some content to render in `src/content/docs/`).
 
-The `testFactory()` helper can be used in a test file to define the fixture which will be loaded in a dev server during a set of tests.
+The `testFactory()` helper can be used in a test file to define the fixture which will be built and loaded in a preview server during a set of tests.
 
 ```ts
 // packages/starlight/__e2e__/feature.test.ts

From 41a3f3b9c2d267880bf5733b1d1ad263a6f10af4 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Tue, 30 Apr 2024 09:49:15 +0200
Subject: [PATCH 23/24] docs: update synced tabs description

Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com>
Co-authored-by: Sarah Rainsberger <5098874+sarah11918@users.noreply.github.com>
---
 docs/src/content/docs/guides/components.mdx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/docs/src/content/docs/guides/components.mdx b/docs/src/content/docs/guides/components.mdx
index 56aa3b8bf2e..b01050f0e99 100644
--- a/docs/src/content/docs/guides/components.mdx
+++ b/docs/src/content/docs/guides/components.mdx
@@ -89,10 +89,11 @@ The code above generates the following tabs on the page:
 
 #### Synced tabs
 
-Keep multiple sets of tabs on the same page in sync with the `syncKey` attribute.
-Switching to a synced tab will also switch to the tab with the same label in other `<Tabs>` that share the same `syncKey`.
+Keep multiple tab groups synchronized by adding the `syncKey` attribute.
 
-To synchronize tabs, add an identical `syncKey` property to each related `<Tabs>` component.
+All `<Tabs>` on a page with the same `syncKey` value will display the same active label. This allows your reader to choose once (e.g. their operating system or package manager), and see their choice reflected throughout the page.
+
+To synchronize related tabs, add an identical `syncKey` property to each `<Tabs>` component and ensure that they all use the same `<TabItem>` labels:
 
 ```mdx 'syncKey="constellations"'
 # src/content/docs/example.mdx

From 70cb28e56c3ee64da6bd3ed9ad225a4aea57f30e Mon Sep 17 00:00:00 2001
From: Chris Swithinbank <swithinbank@gmail.com>
Date: Tue, 30 Apr 2024 17:13:41 +0200
Subject: [PATCH 24/24] Increase JS budget by 500 bytes

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index e0609e2ae0e..8e0fd9e6ce1 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,7 @@
     {
       "name": "/_astro/*.js",
       "path": "examples/basics/dist/_astro/*.js",
-      "limit": "22.5 kB"
+      "limit": "23 kB"
     },
     {
       "name": "/_astro/*.css",