Skip to content

fix: contain inline Mermaid "fit to frame" to the frame height (no vertical scroll)#24

Merged
jphan32 merged 1 commit into
devfrom
fix/fit-vertical-overflow
Jun 24, 2026
Merged

fix: contain inline Mermaid "fit to frame" to the frame height (no vertical scroll)#24
jphan32 merged 1 commit into
devfrom
fix/fit-vertical-overflow

Conversation

@jphan32

@jphan32 jphan32 commented Jun 24, 2026

Copy link
Copy Markdown
Member

What

Inline fit to frame scaled the diagram to the frame width only while the frame height stayed at the diagram's 100% height — so frame and content heights didn't match:

  • a tall diagram (e.g. a long sequenceDiagram) overflowed the 70vh frame and showed a vertical scroll
  • a wide diagram had dead space above/below

Fix

  • Fit now contains the diagram within both the frame width and the 70vh height cap, and sizes the frame to that fitted height → frame and content match exactly. The default inline view stays at 100%; fit/full-screen are how a tall diagram is seen whole.
  • Compensate for Obsidian's app-wide box-sizing: border-box: the viewport's 1px border had eaten into the content box, leaving a faint 1–2px vertical scroll that only reproduced under border-box (not in a content-box harness).

Tests

  • New diagram-fit.test.mjs E2E (under a border-box harness so it exercises the real Obsidian box model) — verifies fit has no vertical scroll for wide+tall and tall+narrow shapes, and that the default view stays 100%.
  • Full gate green: lint / build / node --check / validate, 14 E2E checks.

Bumps to 1.1.7 (manifest / versions / CHANGELOG) — release cuts automatically on merge to main.

🤖 Generated with Claude Code

…rtical scroll)

Inline "fit to frame" scaled the diagram to the frame width only while the
frame height stayed at the diagram's 100% height, so the frame and content
heights did not match: a tall diagram (e.g. a long sequenceDiagram) overflowed
the 70vh frame and showed a vertical scroll, and a wide one had dead space.
Fit now contains the diagram within both the frame width and the 70vh height
cap and sizes the frame to that fitted height, so frame and content match.

Also compensate for Obsidian's app-wide `box-sizing: border-box`, whose 1px
viewport border had eaten into the content box and left a faint 1-2px vertical
scroll that only reproduced under border-box (not in a content-box harness).

Adds a diagram-fit E2E regression test under a border-box harness and bumps to
1.1.7 (manifest/versions/CHANGELOG).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@jphan32 jphan32 merged commit be97c7f into dev Jun 24, 2026
1 check passed
@jphan32 jphan32 deleted the fix/fit-vertical-overflow branch June 24, 2026 07:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant