Fix relationship type/flip live update + orthogonal Welcome graph; add interaction audit#57
Merged
Merged
Conversation
…d interaction audit Basic graph interactions were silently broken. Test-first, each failure shown before its fix: - Relationship TYPE change didn't update the edge label, and flipping an edge's DIRECTION left a stale duplicate. Root cause: the reinitialization gatekeeper effect keyed only on node props + edge COUNT, so an edge whose type changed (same count) or whose direction flipped (delete+create => same count, new id) never triggered a rebuild. Fix: track an edge signature (id + type + direction) and force a reinit when it changes; add the signature to the effect's dependency array so the change is observed. - The Welcome onboarding graph violated the layout rules new users are meant to learn: nodes at the unpinned origin, diagonal edges, and spacing tighter than the edge label. Re-authored the template onto an orthogonal grid (every edge horizontal or vertical, spaced for the label + small margin, every node placed/pinned, no edge routed through a non-endpoint node). Verification: - New tests/diagnostics/interaction-audit.spec.ts drives the real UI: type change -> label "Blocks" immediately (no reload); flip -> exactly one edge, direction swapped. Shown failing first, green after the fix. - New onboarding-template.test.ts asserts the Welcome template is orthogonal, spaced, connected, fully placed, and routes no edge through a node. - THE GATE 5/5, web unit 122/122, server onboarding 5/5. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
🧪 Comprehensive Test Suite
Full-stack smoke gate runs in the CI workflow. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Two basic, user-facing graph interactions were silently broken. Fixed test-first (each failure demonstrated before its fix), plus a reusable interaction-audit harness.
Bugs fixed
1. Relationship type change didn't update the label; flip duplicated the edge.
The reinitialization gatekeeper effect in
InteractiveGraphVisualization.tsxkeyed only on node props + edge count. An edge whose type changed kept the same count, and a flip (delete + recreate → same count, new id) also kept the count — so neither re-ran the effect and the DOM stayed stale (old label / lingering duplicate). Fix: track an edge signature (id + type + direction), force a reinit when it changes, and add the signature to the effect's dependency array so the change is actually observed.2. The Welcome graph broke the layout rules it's meant to teach.
Seed nodes sat at the unpinned origin, edges were diagonal, and spacing was tighter than the edge label. Re-authored
onboarding.tsonto an orthogonal grid: every edge horizontal or vertical, spaced for label + small margin, every node placed/pinned, no edge routed through a non-endpoint node. (The original two-hub structure can't be fully orthogonal, so the tutorial flow was simplified — content we own.)Tests (test-first: shown failing, then green)
tests/diagnostics/interaction-audit.spec.ts— drives the real UI: type change → label "Blocks" immediately (no reload); flip → exactly one edge, direction swapped.onboarding-template.test.ts— asserts the Welcome template is orthogonal, spaced, connected, fully placed, and routes no edge through a node.Verification
🤖 Generated with Claude Code