From 12ed08e69077e27d3de11f139a017496a0e0cef0 Mon Sep 17 00:00:00 2001
From: Mathias Picker <48158184+MathiasWP@users.noreply.github.com>
Date: Mon, 24 Aug 2026 18:17:08 +0200
Subject: [PATCH] Open where you left off
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Collections, requests and responses were already durable. Everything about
looking at them was not: the selected endpoint, both panes' tabs, the sidebar
tab, which loader folders were expanded, and whatever had been typed into the
scratch request. Every launch started on an empty scratch request with the
sidebar back on Collections — a small thing after a deliberate quit, and a rude
one after an auto-update restart nobody asked for.

All of it now lives in `session.svelte.ts`, one blob in local storage, restored
before the first frame rather than a moment after it, so the window opens as it
was rather than visibly rearranging itself. A stored endpoint that no longer
exists falls back to the scratch request rather than leaving the pane blank.

An update restart also flushes the debounced section writes now. It never did:
Rust holds an exit long enough for the frontend to save, but only for an exit it
did not ask for itself, and `relaunch` carries a restart code that sails past
that handler. The last few hundred milliseconds of edits went with the old
process. The same flush runs on `pagehide`, covering a webview torn down without
going through either quit path.

Window geometry needed nothing — tauri-plugin-window-state already writes it on
exit, and the restart path does run through exit.
---
 .changeset/open-where-you-left-off.md |  13 ++
 src/lib/components/Sidebar.svelte     |  40 ++--
 src/lib/session.svelte.ts             | 263 ++++++++++++++++++++++++++
 src/lib/update.svelte.ts              |  10 +
 src/routes/+page.svelte               |  70 ++++---
 tests/e2e/session.spec.ts             | 153 +++++++++++++++
 6 files changed, 504 insertions(+), 45 deletions(-)
 create mode 100644 .changeset/open-where-you-left-off.md
 create mode 100644 src/lib/session.svelte.ts
 create mode 100644 tests/e2e/session.spec.ts

diff --git a/.changeset/open-where-you-left-off.md b/.changeset/open-where-you-left-off.md
new file mode 100644
index 0000000..55bb0ca
--- /dev/null
+++ b/.changeset/open-where-you-left-off.md
@@ -0,0 +1,13 @@
+---
+'fiber': patch
+---
+
+Open where you left off.
+
+Collections, requests and responses were already durable. Everything about *looking* at them was not: which endpoint was open, which tab of it, which sidebar tab, which loader folders were expanded, and whatever had been typed into the scratch request. Every launch started on an empty scratch request with the sidebar back on Collections — which is a small thing after a deliberate quit, and a rude one after an auto-update restart nobody asked for.
+
+All of it is now stored, and restored before the first frame rather than a moment after it, so the window opens as it was rather than visibly rearranging itself. A stored endpoint that no longer exists — deleted elsewhere, or dropped by a loader — falls back to the scratch request instead of leaving the pane blank.
+
+An update restart also flushes the debounced section writes now. It never did: Rust holds an exit long enough for the frontend to save, but only for an exit it did not ask for itself, and a restart carries a code that sails straight past that. The last few hundred milliseconds of edits went with the old process. The same flush runs on `pagehide`, which covers a webview torn down and brought back without going through either quit path.
+
+Window size and position needed nothing — `tauri-plugin-window-state` already writes those on exit, and the restart path does run through exit.
diff --git a/src/lib/components/Sidebar.svelte b/src/lib/components/Sidebar.svelte
index a5c67c2..d6980ff 100644
--- a/src/lib/components/Sidebar.svelte
+++ b/src/lib/components/Sidebar.svelte
@@ -18,6 +18,7 @@
 		type DragHint
 	} from '$lib/dnd.svelte';
 	import { history, type HistoryEntry } from '$lib/history.svelte';
+	import { session } from '$lib/session.svelte';
 	import { theme } from '$lib/theme.svelte';
 	import DotLoader from '$lib/components/DotLoader.svelte';
 	import McpTab from '$lib/components/McpTab.svelte';
@@ -32,8 +33,6 @@
 
 	let { onOpenSettings, onPickHistory }: Props = $props();
 
-	let tab = $state<'collections' | 'history' | 'mcp'>('collections');
-
 	// Read from the bundle rather than package.json, so what the footer shows is
 	// the version that is actually running — which is the number to quote when
 	// something misbehaves.
@@ -211,26 +210,27 @@
 		return order.map((tag) => ({ tag, rows: groups.get(tag)! }));
 	}
 
+	function tagKey(sectionId: string, tag: string): string {
+		return `${sectionId}\0${tag}`;
+	}
+
 	/**
 	 * Folders the user has opened. Closed is the default: a loader can report
 	 * hundreds of endpoints across a dozen tags, and opening a collection to a
 	 * wall of them is no better than not grouping at all. The folder names are
 	 * the map; you open the one you want.
+	 *
+	 * Which ones are open is kept in the session rather than here, so the
+	 * folders you had open are still open the next time the app starts.
 	 */
-	let openTags = $state<Record<string, boolean>>({});
-
-	function tagKey(sectionId: string, tag: string): string {
-		return `${sectionId}\0${tag}`;
-	}
-
 	function tagOpen(sectionId: string, tag: string): boolean {
 		if (searching || !tag) return true;
-		return openTags[tagKey(sectionId, tag)] ?? false;
+		return session.openTags[tagKey(sectionId, tag)] ?? false;
 	}
 
 	function toggleTag(sectionId: string, tag: string): void {
 		const key = tagKey(sectionId, tag);
-		openTags[key] = !openTags[key];
+		session.openTags[key] = !session.openTags[key];
 	}
 
 	function loadMoreEndpoints(sectionId: string): void {
@@ -303,7 +303,7 @@
 	 * kept showing that entry rather than the request's own current response.
 	 */
 	function showCollections() {
-		tab = 'collections';
+		session.sidebarTab = 'collections';
 		history.stopViewing();
 	}
 
@@ -312,7 +312,7 @@
 	 * were looking at stops overriding the response pane.
 	 */
 	function showMcp() {
-		tab = 'mcp';
+		session.sidebarTab = 'mcp';
 		history.stopViewing();
 	}
 
@@ -807,7 +807,7 @@
 <aside class="flex flex-col border-r border-border bg-panel min-h-0 h-full">
 	<header class="flex items-center gap-1 px-2 h-11 border-b border-border shrink-0">
 		<button
-			class="px-2 py-1 rounded text-xs transition-colors {tab === 'collections'
+			class="px-2 py-1 rounded text-xs transition-colors {session.sidebarTab === 'collections'
 				? 'bg-raised text-text'
 				: 'text-muted hover:text-text'}"
 			onclick={() => showCollections()}
@@ -815,10 +815,10 @@
 			Collections
 		</button>
 		<button
-			class="px-2 py-1 rounded text-xs transition-colors {tab === 'history'
+			class="px-2 py-1 rounded text-xs transition-colors {session.sidebarTab === 'history'
 				? 'bg-raised text-text'
 				: 'text-muted hover:text-text'}"
-			onclick={() => (tab = 'history')}
+			onclick={() => (session.sidebarTab = 'history')}
 		>
 			History
 		</button>
@@ -828,14 +828,14 @@
 			rows.
 		-->
 		<button
-			class="px-2 py-1 rounded text-xs transition-colors {tab === 'mcp'
+			class="px-2 py-1 rounded text-xs transition-colors {session.sidebarTab === 'mcp'
 				? 'bg-raised text-text'
 				: 'text-muted hover:text-text'}"
 			onclick={() => showMcp()}
 		>
 			MCP
 		</button>
-		{#if tab === 'history'}
+		{#if session.sidebarTab === 'history'}
 			<button
 				class="ml-auto p-1 rounded text-muted hover:bg-raised hover:text-text transition-colors"
 				title="Clear history"
@@ -843,7 +843,7 @@
 			>
 				<span class="i-lucide-trash-2"></span>
 			</button>
-		{:else if tab === 'collections'}
+		{:else if session.sidebarTab === 'collections'}
 			<!--
 				square-plus and folder-plus rather than file-plus and folder-plus: the
 				geometric pair reads better at 24px, and it happens to solve the
@@ -888,9 +888,9 @@
 		{/if}
 	</header>
 
-	{#if tab === 'mcp'}
+	{#if session.sidebarTab === 'mcp'}
 		<McpTab />
-	{:else if tab === 'collections'}
+	{:else if session.sidebarTab === 'collections'}
 		<div class="px-2 py-2 shrink-0">
 			<div class="relative">
 				<span
diff --git a/src/lib/session.svelte.ts b/src/lib/session.svelte.ts
new file mode 100644
index 0000000..5886645
--- /dev/null
+++ b/src/lib/session.svelte.ts
@@ -0,0 +1,263 @@
+import { SCRATCH_ID } from './history.svelte';
+import { collections } from './collections.svelte';
+import { BODY_KINDS, type SavedRequest } from './api';
+
+/**
+ * Where you were, so the next launch starts there.
+ *
+ * Collections, requests and responses are already durable — TOML on disk and
+ * SQLite respectively. What was not, until this existed, is everything *about
+ * looking at them*: which endpoint was open, which tab of it, which folders
+ * were expanded, and whatever had been typed into the scratch request. An
+ * ordinary quit loses that, and an auto-update restart — which nobody asked
+ * for and which can land mid-sentence — loses it without even being asked.
+ *
+ * Window size and position are not here: `tauri-plugin-window-state` already
+ * writes those on exit, and the restart path runs through exit like any other.
+ *
+ * One JSON blob under one key, deliberately. These fields are only meaningful
+ * together — a tab without the request it belongs to says nothing — and a
+ * single read at startup beats a key per field.
+ *
+ * Contents are as sensitive as the collection files themselves: a scratch
+ * request carries whatever headers you typed into it, and it is stored in the
+ * webview's local storage as plainly as a section is stored in TOML. Secrets
+ * proper still live in the keychain and are still referenced by path, never
+ * copied in here.
+ */
+const STORAGE_KEY = 'fiber:session';
+
+/**
+ * Long enough that a burst of typing costs one write, short enough that a
+ * crash a moment later still remembers the right endpoint.
+ */
+const SAVE_DEBOUNCE_MS = 400;
+
+/**
+ * Past this the scratch body is remembered as empty rather than not at all.
+ *
+ * Local storage is a few megabytes for the whole origin, shared with the theme
+ * and the editor sizes. A pasted payload big enough to threaten that quota is
+ * also one nobody retyped from memory, so dropping it beats a failed write
+ * that loses the selection along with it.
+ */
+const MAX_SCRATCH_BODY = 256 * 1024;
+
+export type RequestTab = 'params' | 'body' | 'headers';
+export type ResponseTab = 'pretty' | 'raw' | 'headers';
+export type SidebarTab = 'collections' | 'history' | 'mcp';
+
+const REQUEST_TABS: RequestTab[] = ['params', 'body', 'headers'];
+const RESPONSE_TABS: ResponseTab[] = ['pretty', 'raw', 'headers'];
+const SIDEBAR_TABS: SidebarTab[] = ['collections', 'history', 'mcp'];
+
+/**
+ * The unsaved request you get before picking anything from the sidebar.
+ * Its `path` is a full URL — there's no section to hang a base off.
+ */
+export function blankScratch(): SavedRequest {
+	return {
+		id: SCRATCH_ID,
+		name: 'Scratch',
+		method: 'GET',
+		path: '',
+		body: '{\n  "hello": "world"\n}',
+		bodyKind: 'json',
+		form: [],
+		file: '',
+		pathParams: [],
+		headers: []
+	};
+}
+
+interface Stored {
+	requestId: string | null;
+	sectionId: string | null;
+	requestTab: RequestTab;
+	responseTab: ResponseTab;
+	sidebarTab: SidebarTab;
+	openTags: Record<string, boolean>;
+	scratch: SavedRequest;
+}
+
+function pick<T extends string>(value: unknown, allowed: readonly T[], fallback: T): T {
+	return typeof value === 'string' && (allowed as readonly string[]).includes(value)
+		? (value as T)
+		: fallback;
+}
+
+function text(value: unknown, fallback: string): string {
+	return typeof value === 'string' ? value : fallback;
+}
+
+function list<T>(value: unknown): T[] {
+	return Array.isArray(value) ? (value as T[]) : [];
+}
+
+/**
+ * Reads every field of a reactive value, so an effect that calls it re-runs
+ * when any of them changes.
+ *
+ * Reading rather than snapshotting on purpose: `$state.snapshot` would clone
+ * the whole request — including a body that can be megabytes — on every
+ * keystroke, only to throw the clone away when the debounce coalesces it into
+ * one write. This walks the same fields for free and leaves the copying to the
+ * moment something is actually written.
+ */
+function track(value: unknown): void {
+	if (Array.isArray(value)) {
+		for (const entry of value) track(entry);
+	} else if (value && typeof value === 'object') {
+		for (const entry of Object.values(value)) track(entry);
+	}
+}
+
+class Session {
+	requestTab = $state<RequestTab>('body');
+	responseTab = $state<ResponseTab>('pretty');
+	sidebarTab = $state<SidebarTab>('collections');
+	/** Loader folders the user has opened, keyed `sectionId\0tag`. */
+	openTags = $state<Record<string, boolean>>({});
+	scratch = $state<SavedRequest>(blankScratch());
+
+	/**
+	 * Until the stored session has been read, there is nothing worth writing —
+	 * and writing anyway would replace it with this class's defaults.
+	 */
+	#restored = false;
+	#timer: ReturnType<typeof setTimeout> | null = null;
+
+	/**
+	 * Reads the stored session. Call once, before anything renders from it and
+	 * before `persist` is ever armed — a second call would put the last launch's
+	 * state back over whatever has been done since.
+	 */
+	restore(): void {
+		if (this.#restored) return;
+		this.#restored = true;
+
+		let stored: Partial<Stored> | null = null;
+		try {
+			stored = JSON.parse(localStorage.getItem(STORAGE_KEY) ?? 'null');
+		} catch {
+			// Truncated by a crash mid-write, or written by a version that shaped
+			// it differently. Either way it is a starting point, not data.
+		}
+		if (!stored || typeof stored !== 'object') return;
+
+		this.requestTab = pick(stored.requestTab, REQUEST_TABS, 'body');
+		this.responseTab = pick(stored.responseTab, RESPONSE_TABS, 'pretty');
+		this.sidebarTab = pick(stored.sidebarTab, SIDEBAR_TABS, 'collections');
+
+		if (stored.openTags && typeof stored.openTags === 'object') {
+			this.openTags = Object.fromEntries(
+				Object.entries(stored.openTags).filter(([, open]) => open === true)
+			);
+		}
+
+		// Field by field, and each one checked: a blob written by an older
+		// version is missing fields a newer one expects, and a blob that has
+		// been edited by hand can hold anything at all. A default beats a
+		// `headers` that turns out not to be an array.
+		//
+		// Mutated in place rather than replaced: the page reads `session.scratch`
+		// once and holds on to it, so the object it holds has to be the one that
+		// ends up with the restored values in it.
+		const scratch = stored.scratch;
+		if (scratch && typeof scratch === 'object') {
+			const blank = blankScratch();
+			Object.assign(this.scratch, blank, {
+				method: text(scratch.method, blank.method),
+				path: text(scratch.path, blank.path),
+				body: text(scratch.body, ''),
+				bodyKind: pick(
+					scratch.bodyKind,
+					BODY_KINDS.map((kind) => kind.value),
+					'json'
+				),
+				file: text(scratch.file, ''),
+				form: list(scratch.form),
+				pathParams: list(scratch.pathParams),
+				headers: list(scratch.headers)
+			});
+		}
+
+		// The selection is set now and resolved later: sections are still being
+		// read off disk, so `collections.selected` answers null until they land.
+		// An id that never resolves simply leaves the scratch request showing —
+		// `verify` clears it once there is something to check it against.
+		if (typeof stored.requestId === 'string') collections.selectedRequestId = stored.requestId;
+		if (typeof stored.sectionId === 'string') collections.selectedSectionId = stored.sectionId;
+	}
+
+	/**
+	 * Forgets a restored selection whose request is gone — deleted from another
+	 * window, or dropped by a loader that no longer reports it. Call once the
+	 * sections are loaded.
+	 */
+	verify(): void {
+		if (collections.selectedRequestId && !collections.selected) {
+			collections.selectedRequestId = null;
+			collections.selectedSectionId = null;
+		}
+	}
+
+	/**
+	 * Notices a change and schedules a write. Call from an effect: it reads
+	 * everything it stores, so the effect re-runs whenever any of it moves.
+	 */
+	persist(): void {
+		track(this.requestTab);
+		track(this.responseTab);
+		track(this.sidebarTab);
+		track(this.openTags);
+		track(this.scratch);
+		track(collections.selectedRequestId);
+		track(collections.selectedSectionId);
+
+		if (!this.#restored) return;
+		if (this.#timer !== null) clearTimeout(this.#timer);
+		this.#timer = setTimeout(() => {
+			this.#timer = null;
+			this.#write();
+		}, SAVE_DEBOUNCE_MS);
+	}
+
+	/**
+	 * Writes now, debounce be damned — the quit and update-restart paths, where
+	 * the timer that would have fired is about to stop existing.
+	 */
+	flush(): void {
+		if (this.#timer !== null) clearTimeout(this.#timer);
+		this.#timer = null;
+		if (this.#restored) this.#write();
+	}
+
+	#write(): void {
+		const scratch = $state.snapshot(this.scratch) as SavedRequest;
+		if (scratch.body.length > MAX_SCRATCH_BODY) scratch.body = '';
+
+		const stored: Stored = {
+			requestId: collections.selectedRequestId,
+			sectionId: collections.selectedSectionId,
+			requestTab: this.requestTab,
+			responseTab: this.responseTab,
+			sidebarTab: this.sidebarTab,
+			// Only the open ones: a closed folder is the default, and keeping the
+			// `false` entries would grow the blob by every folder ever clicked.
+			openTags: Object.fromEntries(
+				Object.entries($state.snapshot(this.openTags)).filter(([, open]) => open)
+			),
+			scratch
+		};
+
+		try {
+			localStorage.setItem(STORAGE_KEY, JSON.stringify(stored));
+		} catch {
+			// Out of quota, or storage denied outright. Where you were is a
+			// convenience; nothing here is worth interrupting anyone over.
+		}
+	}
+}
+
+export const session = new Session();
diff --git a/src/lib/update.svelte.ts b/src/lib/update.svelte.ts
index e543c26..fc3e5bf 100644
--- a/src/lib/update.svelte.ts
+++ b/src/lib/update.svelte.ts
@@ -1,5 +1,7 @@
 import { relaunch } from '@tauri-apps/plugin-process';
 import { check, type Update } from '@tauri-apps/plugin-updater';
+import { collections } from './collections.svelte';
+import { session } from './session.svelte';
 
 /** Long enough that a machine left running still notices within a day. */
 const INTERVAL_MS = 6 * 60 * 60 * 1000;
@@ -131,6 +133,14 @@ class Updates {
 		}
 
 		try {
+			// Everything the app defers has to land first. A restart nobody asked
+			// for is the one exit that can arrive mid-sentence, and it does not go
+			// through the Cmd+Q path: Rust only holds an exit it did not ask for
+			// itself, and this one carries a restart code straight past that
+			// handler. So the debounced writes are flushed here instead.
+			session.flush();
+			await collections.flushAll();
+
 			// The new version is on disk; this process is still the old one.
 			await relaunch();
 		} catch (error) {
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 39d61cb..982a9ca 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -35,29 +35,23 @@
 	import { collections, type Selection } from '$lib/collections.svelte';
 	import { editorFont } from '$lib/editor.svelte';
 	import { history, SCRATCH_ID, type HistoryEntry } from '$lib/history.svelte';
+	import { session, type RequestTab } from '$lib/session.svelte';
 	import { theme } from '$lib/theme.svelte';
 	import { urlField } from '$lib/urlfield';
 	import { untrack } from 'svelte';
 
+	// Where the last run left off, read before anything renders from it: the
+	// sidebar's tab and both panes' tabs come out of the session, and restoring
+	// from an effect would show the defaults for a frame first.
+	session.restore();
+
 	/**
-	 * The unsaved request you get before picking anything from the sidebar.
-	 * Its `path` is a full URL — there's no section to hang a base off.
+	 * The unsaved request you get before picking anything from the sidebar, and
+	 * the two panes' tabs. All three live in `session` rather than here because
+	 * they are part of where you left off, and are restored on the next launch.
 	 */
-	let scratch = $state<SavedRequest>({
-		id: SCRATCH_ID,
-		name: 'Scratch',
-		method: 'GET',
-		path: '',
-		body: '{\n  "hello": "world"\n}',
-		bodyKind: 'json',
-		form: [],
-		file: '',
-		pathParams: [],
-		headers: []
-	});
+	const scratch = session.scratch;
 
-	let requestTab = $state('body');
-	let responseTab = $state('pretty');
 	let inflightId = $state<string | null>(null);
 	let paletteOpen = $state(false);
 
@@ -140,9 +134,9 @@
 	 * back.
 	 */
 	const shownRequestTab = $derived(
-		requestTab === 'headers'
+		session.requestTab === 'headers'
 			? 'headers'
-			: requestTab === 'params' || bodilessMethod
+			: session.requestTab === 'params' || bodilessMethod
 				? 'params'
 				: 'body'
 	);
@@ -173,7 +167,11 @@
 	$effect(() => {
 		// Loaders with a TTL refresh after the cached endpoints are on screen,
 		// never before — a slow discovery endpoint mustn't delay startup.
-		collections.load().then(() => collections.refreshStale());
+		collections.load().then(() => {
+			// Only now is there anything to check the restored selection against.
+			session.verify();
+			return collections.refreshStale();
+		});
 		history.load();
 		editorFont.init();
 
@@ -181,6 +179,13 @@
 		return stopTheme;
 	});
 
+	/**
+	 * Writes the session back whenever any of it moves.
+	 *
+	 * The write itself is debounced inside `persist`; this only has to notice.
+	 */
+	$effect(() => session.persist());
+
 	// Schemas are deliberately fetched endpoint-by-endpoint rather than with the
 	// loader cache. A large OpenAPI document often repeats the same component
 	// hundreds of times; pulling it across the bridge only when its body opens
@@ -225,10 +230,15 @@
 	 */
 	$effect(() => {
 		const stopFlush = listen('flush-before-exit', async () => {
+			session.flush();
 			await collections.flushAll();
 			await flushComplete();
 		});
 		const stopClose = getCurrentWindow().onCloseRequested(async (event) => {
+			// Unconditionally, and before the early return below: the session is
+			// debounced too, and it has its own pending write to land whether or
+			// not a collection does.
+			session.flush();
 			if (!collections.pending) return;
 			event.preventDefault();
 			await collections.flushAll();
@@ -528,7 +538,7 @@
 		if (!shown?.response || shown.response.isBinary) return '';
 		// `tryFormatJson` refuses oversized input on its own; skipping the call
 		// keeps this from even branching on a string that large.
-		return responseTab === 'pretty' && !oversized ? tryFormatJson(shownBody) : shownBody;
+		return session.responseTab === 'pretty' && !oversized ? tryFormatJson(shownBody) : shownBody;
 	});
 
 	async function send() {
@@ -714,7 +724,17 @@
 	}
 </script>
 
-<svelte:window onkeydown={onKeydown} onfocus={() => collections.refreshStale()} />
+<!--
+	`pagehide` is the last moment the webview is guaranteed to still be there.
+	The quit paths above already flush, and so does the update restart; this
+	covers the ways out that route through none of them — a reload from the
+	devtools, or the webview being torn down and brought back after a crash.
+-->
+<svelte:window
+	onkeydown={onKeydown}
+	onfocus={() => collections.refreshStale()}
+	onpagehide={() => session.flush()}
+/>
 
 <CommandPalette
 	bind:open={paletteOpen}
@@ -821,7 +841,7 @@
 							<Tabs.Root
 								value={shownRequestTab}
 								onValueChange={(next) => {
-									if (next) requestTab = next;
+									if (next) session.requestTab = next as RequestTab;
 								}}
 								class="flex flex-col h-full min-h-0"
 							>
@@ -1168,7 +1188,7 @@
 								</div>
 							{:else if shown.response}
 								{@const response = shown.response}
-								<Tabs.Root bind:value={responseTab} class="flex flex-col h-full min-h-0">
+								<Tabs.Root bind:value={session.responseTab} class="flex flex-col h-full min-h-0">
 									<Tabs.List
 										class="flex items-center gap-1 px-2 h-9 border-b border-border bg-panel shrink-0"
 									>
@@ -1260,7 +1280,7 @@
 														Binary response ({formatBytes(response.sizeBytes)}). Switch to Raw for
 														base64.
 													</p>
-												{:else if responseTab === 'pretty'}
+												{:else if session.responseTab === 'pretty'}
 													<Editor value={responseText} readonly language={responseLanguage} scope="response" />
 												{/if}
 												{#if responseSchemaErrors.length}
@@ -1279,7 +1299,7 @@
 											</Tabs.Content>
 
 											<Tabs.Content value="raw" class="flex-1 min-h-0">
-												{#if responseTab === 'raw'}
+												{#if session.responseTab === 'raw'}
 													<Editor value={shownBody} readonly language="text" scope="response" />
 												{/if}
 											</Tabs.Content>
diff --git a/tests/e2e/session.spec.ts b/tests/e2e/session.spec.ts
new file mode 100644
index 0000000..ef0e8f9
--- /dev/null
+++ b/tests/e2e/session.spec.ts
@@ -0,0 +1,153 @@
+import { expect, test } from '@playwright/test';
+import { install, response, savedRequest, section } from './mock-ipc';
+
+/**
+ * Opening where you left off — `src/lib/session.svelte.ts`.
+ *
+ * A reload stands in for a relaunch: the webview starts from nothing either
+ * way, and the mock backend replies with the same fixtures both times, which
+ * is exactly what a real restart onto the same files looks like.
+ */
+
+const users = savedRequest();
+
+const loader = {
+	enabled: true,
+	url: '/openapi.json',
+	method: 'GET',
+	query: '.paths',
+	next: '',
+	ttlSeconds: 0
+};
+
+test('the endpoint that was open is open again', async ({ page }) => {
+	await install(page, { sections: [section({ requests: [users] })] });
+	await page.goto('/');
+	await page.getByText('List users').click();
+	await expect(page.getByPlaceholder('/user/get')).toHaveValue('/users');
+
+	await page.reload();
+	// No click this time: the request pane comes back on the same request.
+	await expect(page.getByPlaceholder('/user/get')).toHaveValue('/users');
+	await expect(page.getByText('https://api.acme.com', { exact: true })).toBeVisible();
+});
+
+test('the scratch request comes back with what was typed into it', async ({ page }) => {
+	await install(page);
+	await page.goto('/');
+
+	await page.getByPlaceholder('https://api.example.com/users').fill('https://example.com/ping');
+
+	await page.reload();
+	await expect(page.getByPlaceholder('https://api.example.com/users')).toHaveValue(
+		'https://example.com/ping'
+	);
+	await expect(page.getByRole('button', { name: 'Send' })).toBeEnabled();
+});
+
+test('the sidebar tab that was open is open again', async ({ page }) => {
+	await install(page, { sections: [section({ requests: [users] })] });
+	await page.goto('/');
+	await page.getByRole('button', { name: 'History', exact: true }).click();
+	await expect(page.getByPlaceholder('Search history…')).toBeVisible();
+
+	await page.reload();
+	await expect(page.getByPlaceholder('Search history…')).toBeVisible();
+});
+
+test('the response tab that was open is open again', async ({ page }) => {
+	await install(page, {
+		sendResponse: response({ body: '{"hello":"world"}' }),
+		sections: [section({ requests: [users] })]
+	});
+	await page.goto('/');
+	await page.getByText('List users').click();
+	await page.getByRole('button', { name: 'Send' }).click();
+	await page.getByRole('tab', { name: 'Raw' }).click();
+	await expect(page.getByRole('tab', { name: 'Raw' })).toHaveAttribute('data-state', 'active');
+
+	await page.reload();
+	await page.getByText('List users').click();
+	await page.getByRole('button', { name: 'Send' }).click();
+	await expect(page.getByRole('tab', { name: 'Raw' })).toHaveAttribute('data-state', 'active');
+});
+
+test('a folder that was opened is still open', async ({ page }) => {
+	await install(page, {
+		sections: [section({ loader })],
+		loaded: [
+			{
+				method: 'GET',
+				path: '/users',
+				name: 'List users',
+				description: '',
+				tag: 'Users',
+				body: ''
+			}
+		]
+	});
+	await page.goto('/');
+
+	// Folders start closed, so the endpoint inside is not on screen yet.
+	await expect(page.getByText('List users')).toBeHidden();
+	await page.getByRole('button', { name: /^Users/ }).click();
+	await expect(page.getByText('List users')).toBeVisible();
+
+	await page.reload();
+	await expect(page.getByText('List users')).toBeVisible();
+});
+
+test('a stored selection whose request is gone falls back to scratch', async ({ page }) => {
+	await install(page, { sections: [section({ requests: [users] })] });
+	// A request deleted in another window, or one a loader has stopped
+	// reporting: the id resolves to nothing, and the pane must not be left
+	// blank waiting for it.
+	await page.addInitScript(() =>
+		localStorage.setItem(
+			'fiber:session',
+			JSON.stringify({ requestId: 'long-gone', sectionId: 'sec-1' })
+		)
+	);
+	await page.goto('/');
+
+	await expect(page.getByPlaceholder('https://api.example.com/users')).toBeVisible();
+	await expect(page.getByRole('button', { name: 'Send' })).toBeDisabled();
+});
+
+test('a session blob that is nonsense is ignored rather than fatal', async ({ page }) => {
+	await install(page, { sections: [section({ requests: [users] })] });
+	await page.addInitScript(() => localStorage.setItem('fiber:session', '{not json'));
+	await page.goto('/');
+
+	await expect(page.getByText('List users')).toBeVisible();
+	await expect(page.getByPlaceholder('https://api.example.com/users')).toBeVisible();
+});
+
+test('an update restart saves the pending edit before relaunching', async ({ page }) => {
+	await install(page, {
+		update: { version: '1.2.3' },
+		sections: [section({ requests: [users] })]
+	});
+	await page.goto('/');
+	await page.getByText('List users').click();
+
+	// Inside the save debounce, which is the whole point: a restart nobody
+	// asked for lands mid-edit, and the write has to be forced before the
+	// process goes away.
+	await page.getByPlaceholder('/user/get').fill('/edited');
+	await page.getByRole('button', { name: 'Update' }).click();
+
+	await expect.poll(() => order(page)).toEqual({ saved: true, savedBeforeRestart: true });
+	const saved = await page.evaluate(() => window.__FIBER_TEST__.lastSaved);
+	expect(JSON.stringify(saved)).toContain('/edited');
+});
+
+/** Where the last save landed relative to the restart, if both happened. */
+function order(page: import('@playwright/test').Page) {
+	return page.evaluate(() => {
+		const cmds = window.__FIBER_TEST__.calls.map((call) => call.cmd);
+		const restart = cmds.indexOf('plugin:process|restart');
+		const saved = cmds.lastIndexOf('save_section');
+		return { saved: saved !== -1, savedBeforeRestart: restart !== -1 && saved < restart };
+	});
+}