Skip to content

Add integration_test case: image intrinsic height drives container - #151

Open
beaucollins wants to merge 1 commit into
simon/260814-valdi-webfrom
beaucollins/web-image-intrinsic-height
Open

Add integration_test case: image intrinsic height drives container#151
beaucollins wants to merge 1 commit into
simon/260814-valdi-webfrom
beaucollins/web-image-intrinsic-height

Conversation

@beaucollins

Copy link
Copy Markdown
Collaborator

Adds an apps/integration_test case that documents a web-renderer regression on this branch (#148): an <image> sized width:"100%" with no explicit height does not give its auto-height container any height. The image decodes but the container collapses to ~0, so the image is invisible.

Root cause

src/valdi_modules/src/valdi/web_renderer/src/elements/ImageElement.ts (~L412/L435) sets the inner <img>/canvas to position: absolute, so it contributes no intrinsic height to the wrapper; with no explicit height the wrapper stays auto → 0. Native (and the previous web renderer, where the <img> was in flow) size the container from the image aspect ratio.

Repro

Case image-intrinsic-height-container renders an intrinsic-ratio image in an auto-height card and records decode/asset observations. Web snapshot = a thin empty bar; native renders the image at its aspect-ratio height. The web-vs-native diff fails.

Suggested fix

Give the wrapper an intrinsic height from the decoded aspect ratio when no explicit height is set (or keep the inner <img> in flow for that case).

This case passes once the wrapper takes the image's intrinsic height.

An <image width="100%"> with no explicit height must give its auto-height
container an intrinsic height from the decoded aspect ratio. Under the new web
renderer the inner image is position:absolute and contributes no height, so the
container collapses to ~0 and the image renders invisible while still decoding.

This case renders the minimal repro (image in an auto-height card) and records
decode/asset observations; the web-vs-native snapshot diff catches the collapse.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@github-actions

Copy link
Copy Markdown

📊 PR Size: size/S

Total changes: 23 lines (1 files)

Top files changed:

  • apps/integration_test/src/valdi/integration_test_app/src/IntegrationTestCases.tsx: +23 -0

Size calculated as additions + deletions. Labels: XS (<10), S (<50), M (<250), L (<1000), XL (1000+)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant