mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-27 02:05:07 +02:00
9d7689ecd8
When displaying SVGs inside a navigable directly, we want to display
them in the size specified by their width and height attributes instead
of stretching them to the viewport as layout normally would.
However, when doing so, we need to actually check that the SVG we are
laying out is indeed directly inside the navigable. Otherwise we just
blindly overwrite whatever content sizes have been calculated by layout
code for e.g. SVG elements inlined somewhere in an HTML document.
Due to the way this was written originally, the bug was not very
noticable. The code overwrote the content width/height with the computed
width/height, which was often still correct in the sense that those two
had the same value. However, content size may also be the result of
{min,max}-{width,height} constraints, which can make it differ from the
computed values.
This bug was likely a regression introduced in
f5e01192cc.
58 lines
1.9 KiB
HTML
58 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<link rel="match" href="../../expected/svg/min-max-size-constraints-ref.html" />
|
|
<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-64">
|
|
<style>
|
|
div {
|
|
border: solid 2px red;
|
|
margin-bottom: 50px;
|
|
}
|
|
.width { width: 25px; }
|
|
.height { height: 25px; }
|
|
.min-width { min-width: 25px; }
|
|
.min-height { min-height: 25px; }
|
|
.max-width { max-width: 25px; }
|
|
.max-height { max-height: 25px; }
|
|
</style>
|
|
All green squares should exactly fill their corresponding red border.
|
|
<div class="width height">
|
|
<svg class="width height" viewBox="0 0 16 16" width="10" height="10">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="min-width height" viewBox="0 0 16 16" width="10" height="10">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="width min-height" viewBox="0 0 16 16" width="10" height="10">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="min-width min-height" viewBox="0 0 16 16" width="10" height="10">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="width height">
|
|
<svg class="width height" viewBox="0 0 16 16" width="100" height="100">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="max-width height" viewBox="0 0 16 16" width="100" height="100">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="width max-height" viewBox="0 0 16 16" width="100" height="100">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|
|
<div class="width height">
|
|
<svg class="max-width max-height" viewBox="0 0 16 16" width="100" height="100">
|
|
<rect x="0" y="0" width="16" height="16" fill="green" />
|
|
</svg>
|
|
</div>
|