From 424aeab8a10cf2a7d561d9472d62d6431e129841 Mon Sep 17 00:00:00 2001
From: avi <avi@aiolabs.com>
Date: Mon, 17 Aug 2026 20:17:52 -0500
Subject: [PATCH] Fix Full Book view layout so the entire manuscript is
 scrollable

The Full Book pane had no CSS rule, so it fell back to block layout:
the CodeMirror editor grew to the full manuscript height and was
clipped by the overflow-hidden workspace, leaving the content below
the first screen unreachable and making a multi-chapter book appear
as a single chapter. Give .full-book-view the same flex-column layout
as .chapter-view so the editor is bounded and scrolls internally.

Add an e2e assertion (fbLayoutOk) that checks the computed layout is a
flex column with the editor bounded to the viewport, so this class of
rendering regression is caught in future runs.
---
 src/renderer/index.css     |  8 ++++++++
 tests/selftest-scenario.js | 17 +++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/src/renderer/index.css b/src/renderer/index.css
index 3b0aa06..af6fbae 100644
--- a/src/renderer/index.css
+++ b/src/renderer/index.css
@@ -437,6 +437,14 @@ html, body {
   overflow: hidden;
 }
 
+.full-book-view {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+  overflow: hidden;
+}
+
 .chapter-header {
   display: flex;
   align-items: baseline;
diff --git a/tests/selftest-scenario.js b/tests/selftest-scenario.js
index 1a87ae5..7b73607 100644
--- a/tests/selftest-scenario.js
+++ b/tests/selftest-scenario.js
@@ -310,6 +310,22 @@ const BOOK2_DIR = __BOOKDIR2_VALUE__;
     await new Promise((r) => setTimeout(r, 300));
     out.fbNoStale = fb.state.doc.toString() === assembledGAB;
 
+    // the Full Book pane must be a bounded flex column whose editor can be
+    // scrolled, so every chapter is actually reachable on screen (a block
+    // layout here clips the manuscript to the first screenful)
+    const fbViewEl = document.getElementById("fullBookView");
+    const fbHost = document.getElementById("fullBookHost");
+    const fbEditor = fbHost.querySelector(".cm-editor");
+    const vs = getComputedStyle(fbViewEl);
+    out.fbViewDisplay = vs.display;
+    out.fbViewDir = vs.flexDirection;
+    out.fbEditorHeight = Math.round(fbEditor.getBoundingClientRect().height);
+    out.fbViewportHeight = window.innerHeight;
+    out.fbLayoutOk =
+      vs.display === "flex" &&
+      vs.flexDirection === "column" &&
+      fbEditor.getBoundingClientRect().height <= window.innerHeight;
+
     // closing and reopening the book preserves the chapter order
     await window.folio.openBookPath(BOOK2_DIR);
     await new Promise((r) => setTimeout(r, 400));
@@ -384,6 +400,7 @@ const BOOK2_DIR = __BOOKDIR2_VALUE__;
       "fbAfterReorderOk",
       "fbHasAllContent",
       "fbNoStale",
+      "fbLayoutOk",
       "reopenPersists",
       "deleteOk",
       "fbAfterDeleteOk",