fix: restore static embed relationship popup by ckeller42 · Pull Request #2969 · likec4/likec4

ckeller42 · 2026-05-21T11:43:18Z

Summary

Enable relationship details and the relationship browser for static embedded views generated by likec4 build.
Keep export/image rendering unchanged; ExportPage still explicitly disables relationship details and relationship browser.
Add focused Playwright coverage that builds the static site, serves the generated output, and verifies the embed relationship popover on hover.

Root Cause

Relationship popover support was introduced in #2145 / 48ad2c741 (feat: Relationship popover). Normal view pages enabled enableRelationshipDetails, but static embed pages still rendered through StaticLikeC4Diagram, whose default remained enableRelationshipDetails = false.

So this was not an export regression from a previously working popup. The new relationship popover feature was added without being wired into the static embed route.

Screenshots

Before	After

Verification

Red: the new static-build embed test failed before the fix because DIRECT RELATIONSHIPS was not visible.
npx -y pnpm@10.33.3 --filter @likec4/spa typecheck
npx -y pnpm@10.33.3 --dir e2e exec playwright test -c playwright.static-build.config.ts
Targeted compile of the new e2e files passed.
Cursor review: ready, no blockers.
CodeRabbit review: findings: 0.

Note: broad e2e tsc --noEmit still fails on existing unrelated generated model/view type assertions for multiple-* IDs.

changeset-bot · 2026-05-21T11:43:27Z

🦋 Changeset detected

Latest commit: 81d3bdd

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 22 packages

Name	Type
@likec4/spa	Patch
likec4	Patch
@likec4/docs-astro	Patch
likec4-vscode	Patch
@likec4/playground	Patch
@likec4/style-preset	Patch
@likec4/styles	Patch
@likec4/config	Patch
@likec4/core	Patch
@likec4/diagram	Patch
@likec4/generators	Patch
@likec4/language-server	Patch
@likec4/language-services	Patch
@likec4/layouts	Patch
@likec4/leanix-bridge	Patch
@likec4/log	Patch
@likec4/lsp	Patch
@likec4/mcp	Patch
@likec4/react	Patch
@likec4/tsconfig	Patch
@likec4/vite-plugin	Patch
@likec4/vscode-preview	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

ckeller42 · 2026-05-21T12:07:11Z

@coderabbitai review

coderabbitai · 2026-05-21T12:07:19Z

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

ckeller42 · 2026-05-21T12:08:00Z

@coderabbitai full review

coderabbitai · 2026-05-21T12:08:06Z

✅ Actions performed

Full review triggered.

coderabbitai · 2026-05-21T12:12:30Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: fb61658e-a287-4a6f-9117-b1d47fcec04b

📥 Commits

Reviewing files that changed from the base of the PR and between 7844fb1 and 81d3bdd.

📒 Files selected for processing (1)

e2e/serve-static-build.mjs

📝 Walkthrough

Walkthrough

This PR enables relationship popovers in static-built embedded views by adding enableRelationshipDetails and enableRelationshipBrowser to StaticLikeC4Diagram, adds a Node.js static file server for serving builds, and provides Playwright e2e config and a test that verifies the popover appears on relationship hover.

Changes

Static Embed Relationship UI and Test Coverage

Layer / File(s)	Summary
Enable relationship UI in static embeds `packages/likec4-spa/src/pages/EmbedPage.tsx`, `.changeset/fix-static-embed-relationship-popover.md`	EmbedPage passes `enableRelationshipDetails` and `enableRelationshipBrowser` props to `StaticLikeC4Diagram`. SPDX/copyright headers added and a changeset documents patch bumps for `@likec4/spa` and `likec4`.
Static file serving and SPA routing `e2e/serve-static-build.mjs`	Node.js HTTP server serves static-built files with explicit MIME types, sanitizes request paths to prevent traversal, supports `GET`/`HEAD`, streams files, and falls back to `index.html` for SPA routing.
E2E test infrastructure and relationship popover verification `e2e/playwright.static-build.config.ts`, `e2e/.gitignore`, `e2e/tests/static-build-relationship-popover.spec.ts`	Playwright config builds and serves the static site on port 5175, test file is unignored, and the Playwright spec navigates to the embed, hovers a relationship edge, and asserts the "DIRECT RELATIONSHIPS" popover and "Browse relationships" button are visible.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Suggested reviewers

davydkov

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix: restore static embed relationship popup' clearly and specifically describes the main change—enabling relationship popups in static embeds—aligning with the core objective.
Description check	✅ Passed	The PR description covers key aspects: root cause analysis, solution summary, testing approach, and verification steps. However, it does not explicitly check all template checklist items.
Linked Issues check	✅ Passed	The PR directly addresses issue `#2962` by enabling relationship details and browser in static embeds, restoring the missing relationship popover functionality reported in the issue.
Out of Scope Changes check	✅ Passed	All changes are directly related to the objective: enabling relationship popups in static embeds. Changes include the core fix to EmbedPage, test infrastructure for static builds, and supporting configuration files.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch cgk/fix-2962-static-relationship-popup

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@e2e/serve-static-build.mjs`:
- Around line 31-33: In resolveRequest(pathname) wrap the
decodeURIComponent(pathname) call in a try/catch and return a 400 response on
failure; likewise wrap any use of new URL(...) (and remove reliance on
request.headers.host) by using a fixed base like "http://127.0.0.1" and catching
URL parsing errors to return 400. Update the logic around the variables relative
and candidate (resolve(root, relative)) so that candidate is only computed when
decoding/parsing succeeds. Ensure errors are caught locally in resolveRequest to
prevent server crashes.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: e8b1516b-4bdd-4403-82f4-d73661c1dd22

📥 Commits

Reviewing files that changed from the base of the PR and between 699f44c and 7844fb1.

📒 Files selected for processing (6)

.changeset/fix-static-embed-relationship-popover.md
e2e/.gitignore
e2e/playwright.static-build.config.ts
e2e/serve-static-build.mjs
e2e/tests/static-build-relationship-popover.spec.ts
packages/likec4-spa/src/pages/EmbedPage.tsx

ckeller42 · 2026-05-21T12:15:38Z

@coderabbitai review

coderabbitai · 2026-05-21T12:15:56Z

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

fix: restore static embed relationship popup

7844fb1

coderabbitai Bot reviewed May 21, 2026

View reviewed changes

Comment thread e2e/serve-static-build.mjs

test: harden static e2e server

81d3bdd

ckeller42 marked this pull request as ready for review May 21, 2026 14:52

ckeller42 requested a review from davydkov May 21, 2026 14:52

davydkov approved these changes May 21, 2026

View reviewed changes

davydkov merged commit 116f482 into main May 21, 2026
18 checks passed

davydkov deleted the cgk/fix-2962-static-relationship-popup branch May 21, 2026 19:02

likec4-ci Bot mentioned this pull request May 21, 2026

release: v1.57.0 #2937

Merged

This was referenced May 26, 2026

No relationship popup on some Views when using the vscode extension visualizer (and the static website version also) #2987

Open

fix(diagram): expose diagram text to screen readers #2990

Open

coderabbitai Bot mentioned this pull request Jun 9, 2026

Bug Report: peerDependencies range ^19.x resolves React 19.1.x, causing runtime crash in @mantine/hooks #3059

Open

Uh oh!

Conversation

ckeller42 commented May 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Root Cause

Screenshots

Verification

Uh oh!

changeset-bot Bot commented May 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

ckeller42 commented May 21, 2026

Uh oh!

coderabbitai Bot commented May 21, 2026

Uh oh!

ckeller42 commented May 21, 2026

Uh oh!

coderabbitai Bot commented May 21, 2026

Uh oh!

coderabbitai Bot commented May 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Suggested reviewers

❌ Failed checks (1 warning)

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

ckeller42 commented May 21, 2026

Uh oh!

coderabbitai Bot commented May 21, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

ckeller42 commented May 21, 2026 •

edited

Loading

changeset-bot Bot commented May 21, 2026 •

edited

Loading

coderabbitai Bot commented May 21, 2026 •

edited

Loading