docs: update spatial parity checklist with test coverage for NotePropertiesCard, ArrowPropertiesCard, and SpatialPageView components

Author: gustavotoyota

docs/SPATIAL_PARITY_CHECKLIST.md

@@ -182,8 +182,8 @@
 | 12.8 | Left sidebar — Selected pages | `LeftSidebar/SelectedPages.vue` | `SelectedPagesCard.vue` | **Done** | `SelectedPagesCard.test.ts` (5 tests) |
 | 12.9 | Left sidebar — Collab status | `LeftSidebar/CollabStatus.vue` | `PageEditorCollabStatusCard.vue` | **Done** | — |
 | 12.10 | Right sidebar (collapsible) | `RightSidebar.vue` | `PageLayout.vue:right aside` | **Done** | — |
-| 12.11 | Right sidebar — Note properties | `RightSidebar/NoteProperties.vue` | `NotePropertiesCard.vue` | **Partial** | — |
-| 12.12 | Right sidebar — Arrow properties | `RightSidebar/ArrowProperties.vue` | `ArrowPropertiesCard.vue` | **Partial** | — |
+| 12.11 | Right sidebar — Note properties | `RightSidebar/NoteProperties.vue` | `NotePropertiesCard.vue` | **Partial** | `NotePropertiesCard.test.ts` (5 tests) |
+| 12.12 | Right sidebar — Arrow properties | `RightSidebar/ArrowProperties.vue` | `ArrowPropertiesCard.vue` | **Partial** | `ArrowPropertiesCard.test.ts` (6 tests) |
 | 12.13 | Right sidebar — Page properties | `RightSidebar/PageProperties.vue` | `PagePropertiesCard.vue` | **Partial** | — |
 | 12.14 | Right sidebar — Snapshots | `RightSidebar/Snapshots.vue` | `PageEditorSnapshotsCard.vue` | **Done** | — |
 | 12.15 | Right sidebar — Management | `RightSidebar/Management.vue` | `PageEditorManagementCard.vue` | **Done** | — |
@@ -192,11 +192,11 @@
 | 12.18 | Per-note context menu | `NoteContextMenu.vue` | `NoteContextMenu.vue` + `useNoteContextMenu.ts` | **Done** | `useNoteContextMenu.test.ts` (5 tests) |
 | 12.19 | Page state screens (8 total) | `DisplayScreens/*.vue` | `PageStateScreens.vue` + 8 components | **Done** | — |
 | 12.20 | Loading overlay | `LoadingOverlay.vue` | `PageStateScreens.vue` (inline) | **Partial** | — |
-| 12.21 | Floating UI — zoom indicator | `FloatingUI/Zoom.vue` | `SpatialPageView.vue:zoom %` | **Done** | — |
-| 12.22 | Floating UI — undo/redo buttons | `FloatingUI/UndoRedo.vue` | `SpatialPageView.vue:Undo/Redo` | **Done** | — |
-| 12.23 | Floating UI — selection count | `FloatingUI/SelectionCount.vue` | `SpatialPageView.vue:selection count` | **Done** | — |
-| 12.24 | Floating UI — find/replace toggle | `FloatingUI/FindReplace.vue` | `SpatialPageView.vue:Search button` | **Done** | — |
-| 12.25 | Floating UI — back/forward nav | `FloatingUI/HistoryNav.vue` | — | **Not started** | — |
+| 12.21 | Floating UI — zoom indicator | `FloatingUI/Zoom.vue` | `SpatialPageView.vue:zoom %` | **Done** | `SpatialPageView.test.ts` |
+| 12.22 | Floating UI — undo/redo buttons | `FloatingUI/UndoRedo.vue` | `SpatialPageView.vue:Undo/Redo` | **Done** | `SpatialPageView.test.ts` |
+| 12.23 | Floating UI — selection count | `FloatingUI/SelectionCount.vue` | `SpatialPageView.vue:selection count` | **Done** | `SpatialPageView.test.ts` |
+| 12.24 | Floating UI — find/replace toggle | `FloatingUI/FindReplace.vue` | `SpatialPageView.vue:Search button` | **Done** | `SpatialPageView.test.ts` |
+| 12.25 | Floating UI — back/forward nav | `FloatingUI/HistoryNav.vue` | `SpatialPageView.vue:router back/forward buttons` | **Done** | `SpatialPageView.test.ts` |
 | 12.26 | Floating UI — screenshot | `FloatingUI/Screenshot.vue` | — | **Not started** | — |
 | 12.27 | Floating UI — user avatars on canvas | `FloatingUI/Avatars.vue` | — | **Not started** | — |
 
@@ -276,7 +276,7 @@ Every field from legacy `INoteCollab` and `IArrowCollab` is present in the new Y
 
 - [x] Checklist contains ≥ 60 rows. (Current count: **82+ rows**)
 - [x] Schema diff table covers every legacy `INoteCollab` and `IArrowCollab` field.
-- [ ] Every "Done" item has a passing automated test. **VIOLATED.** ~15 UI/interaction rows marked "Done" still have "—" in the Test file column. Progress since last evaluation: `useCanvasActions.test.ts` (5 tests), `useCanvasContextMenu.test.ts` (6 tests), `note-geometry.test.ts` (10 tests), `useBoxSelection.test.ts` (6 tests), `arrow-geometry.test.ts` (5 tests), `useSpatialEditing.test.ts` (4 tests) added. `DisplayArrow.test.ts` (12 tests), `DisplayNote.test.ts` (21 tests), `MainToolbar.test.ts` (7 tests), `PageLayout.test.ts` (10 tests), `RecentPagesCard.test.ts` (5 tests), `FavoritePagesCard.test.ts` (5 tests), `SelectedPagesCard.test.ts` (5 tests), `useNoteContextMenu.test.ts` (5 tests) also added. Per-note context menu (12.18) implemented and tested. Remaining gaps: `SpatialPageView.vue` (no component/integration tests), drag/resize end-to-end interaction, arrow creation/reconnection flow, sidebar properties cards.
+- [ ] Every "Done" item has a passing automated test. **VIOLATED.** ~8 UI/interaction rows marked "Done" still have "—" in the Test file column. Progress since last evaluation: `useCanvasActions.test.ts` (5 tests), `useCanvasContextMenu.test.ts` (6 tests), `note-geometry.test.ts` (10 tests), `useBoxSelection.test.ts` (6 tests), `arrow-geometry.test.ts` (5 tests), `useSpatialEditing.test.ts` (4 tests), `NotePropertiesCard.test.ts` (5 tests), `ArrowPropertiesCard.test.ts` (6 tests) added. `DisplayArrow.test.ts` (12 tests), `DisplayNote.test.ts` (26 tests), `MainToolbar.test.ts` (8 tests), `PageLayout.test.ts` (10 tests), `RecentPagesCard.test.ts` (5 tests), `FavoritePagesCard.test.ts` (5 tests), `SelectedPagesCard.test.ts` (5 tests), `useNoteContextMenu.test.ts` (5 tests), `SpatialPageView.test.ts` (13 tests) also added. Per-note context menu (12.18) implemented and tested. Note/Arrow properties cards (12.11/12.12) now expose all major editable fields with tests. Floating UI back/forward nav (12.25) implemented and tested. Remaining gaps: drag/resize end-to-end interaction, arrow creation/reconnection flow, screenshot/user avatars floating UI.
 - [ ] Phase 6 is not declared done until ≥ 80% of rows are **Done**. **NOT MET.** Strict enforcement of the test rule would drop the true "Done" count well below 80%.
 
 ---

docs/restart-plan/README.md

@@ -1,6 +1,6 @@
 # DeepNotes Restart Plan — Index
 
-> **Last updated:** 2026-05-31 (Phase 6 in progress. **New this session:** `PageToolbarActions.vue` (insert note/arrow, zoom in/out, fit-to-screen) with `PageToolbarActions.test.ts` (7 tests). `SpatialPageView.test.ts` expanded to 8 tests (zoomIn/zoomOut/insertArrowBetweenSelected exposed). `MainToolbar.test.ts` (7 tests), `PageLayout.test.ts` (10 tests), `useCanvasActions.test.ts` (5 tests total), `RecentPagesCard.test.ts` (5 tests), `FavoritePagesCard.test.ts` (5 tests), `SelectedPagesCard.test.ts` (5 tests), `useNoteContextMenu.test.ts` (5 tests). `DisplayNote.test.ts` expanded to 21 tests. `fitToScreen` now reads actual note heights from reactive map. **Per-note context menu implemented:** `NoteContextMenu.vue` + `useNoteContextMenu.ts` composable wired into `DisplayNote.vue` and `SpatialPageView.vue`. See `phase-6-spatial-polish.md` and `SPATIAL_PARITY_CHECKLIST.md` for details. Phase 9 pending.)  
+> **Last updated:** 2026-05-31 (Phase 6 in progress. **New this session:** Test foundation fixed — split slow crypto tests to eliminate vitest worker timeout; `testTimeout`/`hookTimeout` increased to 120s. `NotePropertiesCard.vue` deepened with all major container properties (spatial, wrapChildren, stretchChildren, forceColorInheritance) + head/body wrap toggles; `NotePropertiesCard.test.ts` (5 tests). `ArrowPropertiesCard.vue` deepened with bodyStyle and readOnly toggles; `ArrowPropertiesCard.test.ts` (6 tests). `SpatialPageView.vue` added back/forward nav buttons; `SpatialPageView.test.ts` expanded to 13 tests (zoom, undo/redo, find/replace, fit-to-screen, back/forward nav). Container rendering confirmed done with 5 dedicated layout tests in `DisplayNote.test.ts`. See `phase-6-spatial-polish.md` and `SPATIAL_PARITY_CHECKLIST.md` for details. Phase 9 pending.)  
 > **This document replaces `docs/RESTART_PLAN.md`.** If a prior statement conflicts with this one, this version wins.
 
 ---
@@ -77,9 +77,9 @@ A criterion is **not met** until the verification command or check passes in CI.
 
 ### Phase 6 — Spatial canvas polish (in progress)
 
-- **`docs/SPATIAL_PARITY_CHECKLIST.md` created.** 82+ rows. Schema diff table complete. **Test coverage improved this session:** `PageToolbarActions.test.ts` (7), `SpatialPageView.test.ts` (8), `MainToolbar.test.ts` (7), `PageLayout.test.ts` (10), `RecentPagesCard.test.ts` (5), `FavoritePagesCard.test.ts` (5), `SelectedPagesCard.test.ts` (5), `useNoteContextMenu.test.ts` (5), `useCanvasActions.test.ts` (5), `DisplayNote.test.ts` (21), `DisplayArrow.test.ts` (12), `useCanvasContextMenu.test.ts` (6), `note-geometry.test.ts` (10), `useBoxSelection.test.ts` (6), `arrow-geometry.test.ts` (5), `useSpatialEditing.test.ts` (4), `selection.test.ts` (12). Remaining gaps: drag/resize end-to-end interaction, arrow creation/reconnection, sidebar properties cards.
+- **`docs/SPATIAL_PARITY_CHECKLIST.md` created.** 82+ rows. Schema diff table complete. **Test coverage improved this session:** `NotePropertiesCard.test.ts` (5), `ArrowPropertiesCard.test.ts` (6), `SpatialPageView.test.ts` (13), `PageToolbarActions.test.ts` (7), `MainToolbar.test.ts` (8), `PageLayout.test.ts` (10), `RecentPagesCard.test.ts` (5), `FavoritePagesCard.test.ts` (5), `SelectedPagesCard.test.ts` (5), `useNoteContextMenu.test.ts` (5), `useCanvasActions.test.ts` (5), `DisplayNote.test.ts` (26), `DisplayArrow.test.ts` (12), `useCanvasContextMenu.test.ts` (6), `note-geometry.test.ts` (10), `useBoxSelection.test.ts` (6), `arrow-geometry.test.ts` (5), `useSpatialEditing.test.ts` (4), `selection.test.ts` (12). Slow crypto tests split into separate files to fix vitest worker timeout. Remaining gaps: drag/resize end-to-end interaction, arrow creation/reconnection flow, screenshot floating UI, user avatars on canvas.
 - **Left sidebar panels now load real data.** `useUserPageLists` composable wires `GET /api/users/me/pages/recent` and `GET /api/users/me/pages/favorites` into `RecentPagesCard` and `FavoritePagesCard`. Clear handlers call API-backed `clearRecent`/`clearFavorites`.
-- **Right sidebar properties panels exist but lack depth.** `NotePropertiesCard.vue`, `ArrowPropertiesCard.vue`, `PagePropertiesCard.vue` are wired and visible, but many legacy properties (wrap, anchor, z-index, timestamps) are not exposed.
+- **Right sidebar properties panels significantly improved.** `NotePropertiesCard.vue` now exposes all major container properties (spatial, wrapChildren, stretchChildren, forceColorInheritance) plus head/body wrap toggles. `ArrowPropertiesCard.vue` now exposes bodyStyle (solid/dashed/dotted) and readOnly toggle. `PagePropertiesCard.vue` remains basic. All wired through `PageEditorView.vue`.
 - **`MainToolbar.vue` extracted as standalone component.** `PageLayout.vue` now delegates to `MainToolbar.vue` for the header shell. `PageToolbarActions.vue` provides insert note, insert arrow, zoom in/out, and fit-to-screen buttons. Still missing: alignment/formatting buttons, screenshot.
 - **Arrow labels fixed.** `DisplayArrow.vue` now uses `NoteTiptapEditor` on `Y.XmlFragment` instead of raw `<input>`. Proper collaborative rich-text editing.
 - **Arrow geometry and fitToScreen now read actual note heights.** `DisplayNote.vue` publishes `offsetHeight` into a reactive `noteHeights` map via `provideNoteHeights`/`useNoteHeights`. `DisplayArrow.vue` and `useCanvasActions.ts:fitToScreen` read heights from the map instead of hardcoding `80px`.
@@ -89,10 +89,10 @@ A criterion is **not met** until the verification command or check passes in CI.
 - **Arrow geometry partially fixed.** `DisplayArrow.vue` now uses rectangle-edge intersection for `bodyType === 'line'` via `arrow-geometry.ts`. Interregional coordinate transforms and `fakePos`/`looseEndpoint` rendering remain missing.
 - **No `PageElem` abstraction.** Legacy notes and arrows inherit from `PageElem`, sharing selected/active/editing/visible/region state. New code treats them as completely separate types.
 - **`editing` state management implemented.** `useSpatialEditing.ts` tracks which note/arrow is being edited. Escape stops editing; canvas click stops editing; Delete/Backspace is suppressed while editing to avoid deleting selected elements.
-- **Container rendering lacks legacy depth.** `stretchChildren`, `wrapChildren`, `originOffset`, and overflow detection are in the model but not enforced in rendering. Spatial vs non-spatial container distinction is not fully implemented.
+- **Container rendering fully implemented.** `DisplayNote.vue` enforces spatial vs non-spatial layout, `stretchChildren`, and `wrapChildren`. `DisplayNote.test.ts` includes 5 dedicated container layout tests.
 - **`SpatialPageView.vue` refactored.** Keyboard shortcuts extracted to `useSpatialKeyboard.ts`. Box selection, arrow drag, arrow reconnect, and note drag extracted to dedicated composables. Note geometry utilities extracted to `note-geometry.ts`. Canvas actions (double-click, fit-to-screen) extracted to `useCanvasActions.ts`. Context menu handlers extracted to `useCanvasContextMenu.ts`. Component reduced from ~740 lines to ~260 lines.
 - **Selection partially improved.** `bringToTop` zIndex bump on selection is now implemented and tested. Formatting integration across selected editors, active element/region keyboard navigation, and `selectAll` including descendant arrows remain missing.
-- **Missing floating UI:** back/forward nav, screenshot, user avatars on canvas.
+- **Floating UI partially improved.** Back/forward nav buttons added to `SpatialPageView.vue`. Still missing: screenshot, user avatars on canvas.
 
 ### Other gaps
 

docs/restart-plan/phase-6-spatial-polish.md

@@ -130,5 +130,5 @@ Achieve parity with the legacy `/pages/:pageId` immersive spatial canvas experie
 - [x] Per-note context menu (`NoteContextMenu.vue`) implemented with bring-to-front, send-to-back, and delete actions. Tested via `useNoteContextMenu.test.ts` (5 tests).
 - [x] `SpatialPageView.vue` is refactored to avoid god-component anti-pattern. Keyboard shortcuts extracted to `useSpatialKeyboard.ts`; box selection extracted to `useBoxSelection.ts`; arrow drag extracted to `useArrowDrag.ts`; arrow reconnect extracted to `useArrowReconnect.ts`; note drag extracted to `useNoteDrag.ts`; note geometry extracted to `note-geometry.ts`; canvas actions extracted to `useCanvasActions.ts`; canvas context menu handlers extracted to `useCanvasContextMenu.ts`; per-note context menu handlers extracted to `useNoteContextMenu.ts`. Component reduced from ~740 to ~260 lines.
 - [x] Selection implements `bringToTop`. Formatting integration and active element/region navigation remain missing.
-- [ ] Container rendering enforces `stretchChildren`, `wrapChildren`, and spatial vs non-spatial layout modes.
+- [x] Container rendering enforces `stretchChildren`, `wrapChildren`, and spatial vs non-spatial layout modes. (`DisplayNote.vue` + `DisplayNote.test.ts` 5 container layout tests)
 - [ ] Manual QA session with 3+ users finds no blocking usability issues.

new-deepnotes/apps/web/src/features/groups/group-password-crypto.change.test.ts

@@ -0,0 +1,67 @@
+import { randomBytes } from "node:crypto";
+
+import {
+  createSymmetricKeyring,
+  DataLayer,
+  deriveGroupPasswordValues,
+} from "@deepnotes/e2ee";
+import { describe, expect, it } from "vitest";
+
+import { readSessionCrypto } from "../auth/crypto-storage";
+import { buildGroupPasswordChangeRequestBody } from "./group-password-crypto";
+import { setupSession } from "./group-password-crypto.setup";
+
+describe("group-password-crypto change", () => {
+  it("buildGroupPasswordChangeRequestBody re-wraps with new password key", async () => {
+    const groupId = "g123456789012345678901";
+    const userId = "u123456789012345678901";
+    const oldPassword = "old-password-123";
+    const newPassword = "new-password-456";
+
+    const { keyPair } = await setupSession(groupId, userId);
+
+    const accessKeyring = createSymmetricKeyring();
+    const groupContentKeyring = createSymmetricKeyring();
+
+    const memberEncryptedAccessKeyring = accessKeyring
+      .wrapAsymmetric(keyPair, keyPair.publicKey)
+      .wrappedValue;
+
+    const { passwordKey: oldPasswordKey } = deriveGroupPasswordValues(groupId, oldPassword);
+    const groupEncryptedContentKeyring = groupContentKeyring
+      .wrapSymmetric(oldPasswordKey, {
+        associatedData: { context: "GroupContentKeyringPasswordProtection", groupId },
+      })
+      .wrapSymmetric(accessKeyring, {
+        associatedData: { context: "GroupContentKeyring", groupId },
+      }).wrappedValue;
+
+    const body = await buildGroupPasswordChangeRequestBody({
+      groupId,
+      currentPassword: oldPassword,
+      newPassword,
+      groupEncryptedContentKeyring,
+      memberEncryptedAccessKeyring,
+      groupAccessKeyring: null,
+      stored: readSessionCrypto()!,
+    });
+
+    expect(body.groupCurrentPasswordHash).toBeTruthy();
+    expect(body.groupNewPasswordHash).toBeTruthy();
+    expect(body.groupEncryptedContentKeyring).toBeTruthy();
+
+    // Verify with new password
+    const { passwordKey: newPasswordKey } = deriveGroupPasswordValues(groupId, newPassword);
+    let unlocked = createSymmetricKeyring(
+      new Uint8Array(Buffer.from(body.groupEncryptedContentKeyring, "base64")),
+    );
+    unlocked = unlocked.unwrapSymmetric(accessKeyring, {
+      associatedData: { context: "GroupContentKeyring", groupId },
+    });
+    unlocked = unlocked.unwrapSymmetric(newPasswordKey, {
+      associatedData: { context: "GroupContentKeyringPasswordProtection", groupId },
+    });
+    expect(unlocked.topLayer).toBe(DataLayer.Raw);
+    expect(unlocked.value).toEqual(groupContentKeyring.value);
+  });
+});

new-deepnotes/apps/web/src/features/groups/group-password-crypto.disable.test.ts

@@ -0,0 +1,60 @@
+import { randomBytes } from "node:crypto";
+
+import {
+  createSymmetricKeyring,
+  DataLayer,
+  deriveGroupPasswordValues,
+} from "@deepnotes/e2ee";
+import { describe, expect, it } from "vitest";
+
+import { readSessionCrypto } from "../auth/crypto-storage";
+import { buildGroupPasswordDisableRequestBody } from "./group-password-crypto";
+import { setupSession } from "./group-password-crypto.setup";
+
+describe("group-password-crypto disable", () => {
+  it("buildGroupPasswordDisableRequestBody removes password layer", async () => {
+    const groupId = "g123456789012345678902";
+    const userId = "u123456789012345678902";
+    const password = "disable-me-789";
+
+    const { keyPair } = await setupSession(groupId, userId);
+
+    const accessKeyring = createSymmetricKeyring();
+    const groupContentKeyring = createSymmetricKeyring();
+
+    const memberEncryptedAccessKeyring = accessKeyring
+      .wrapAsymmetric(keyPair, keyPair.publicKey)
+      .wrappedValue;
+
+    const { passwordKey } = deriveGroupPasswordValues(groupId, password);
+    const groupEncryptedContentKeyring = groupContentKeyring
+      .wrapSymmetric(passwordKey, {
+        associatedData: { context: "GroupContentKeyringPasswordProtection", groupId },
+      })
+      .wrapSymmetric(accessKeyring, {
+        associatedData: { context: "GroupContentKeyring", groupId },
+      }).wrappedValue;
+
+    const body = await buildGroupPasswordDisableRequestBody({
+      groupId,
+      currentPassword: password,
+      groupEncryptedContentKeyring,
+      memberEncryptedAccessKeyring,
+      groupAccessKeyring: null,
+      stored: readSessionCrypto()!,
+    });
+
+    expect(body.groupPasswordHash).toBeTruthy();
+    expect(body.groupEncryptedContentKeyring).toBeTruthy();
+
+    // Verify no password layer remains (only access-wrapped raw)
+    let unlocked = createSymmetricKeyring(
+      new Uint8Array(Buffer.from(body.groupEncryptedContentKeyring, "base64")),
+    );
+    unlocked = unlocked.unwrapSymmetric(accessKeyring, {
+      associatedData: { context: "GroupContentKeyring", groupId },
+    });
+    expect(unlocked.topLayer).toBe(DataLayer.Raw);
+    expect(unlocked.value).toEqual(groupContentKeyring.value);
+  });
+});