LibWeb: Make empty images (no bitmap, no alt text) take no layout space
This matches the behavior of other browsers.
This commit is contained in:
parent
43e55668eb
commit
dd3e002ecf
Notes:
sideshowbarker
2024-07-17 01:13:25 +09:00
Author: https://github.com/awesomekling Commit: https://github.com/SerenityOS/serenity/commit/dd3e002ecf Pull-request: https://github.com/SerenityOS/serenity/pull/23757
6 changed files with 48 additions and 32 deletions
|
@ -0,0 +1,10 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x17 children: inline
|
||||
frag 0 from ImageBox start: 0, length: 0, rect: [8,21 0x0] baseline: 0
|
||||
ImageBox <img> at (8,21) content-size 0x0 children: not-inline
|
||||
|
||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17]
|
||||
ImagePaintable (ImageBox<IMG>) [8,21 0x0]
|
|
@ -1,13 +1,13 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x80 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x64 children: not-inline
|
||||
Box <div#box1> at (8,8) content-size 784x64 flex-container(row) [FFC] children: not-inline
|
||||
BlockContainer <div> at (8,8) content-size 16x64 flex-item [BFC] children: not-inline
|
||||
ImageBox <img#box2> at (24,24) content-size 16x32 floating flex-container(row) children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x16 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x0 children: not-inline
|
||||
Box <div#box1> at (8,8) content-size 784x0 flex-container(row) [FFC] children: not-inline
|
||||
BlockContainer <div> at (8,8) content-size 0x0 flex-item [BFC] children: not-inline
|
||||
ImageBox <img#box2> at (8,8) content-size 0x0 floating flex-container(row) children: not-inline
|
||||
|
||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x80]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x64]
|
||||
PaintableBox (Box<DIV>#box1) [8,8 784x64]
|
||||
PaintableWithLines (BlockContainer<DIV>) [8,8 16x64] overflow: [8,8 48x64]
|
||||
ImagePaintable (ImageBox<IMG>#box2) [8,8 48x64]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x16]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x0]
|
||||
PaintableBox (Box<DIV>#box1) [8,8 784x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [8,8 0x0]
|
||||
ImagePaintable (ImageBox<IMG>#box2) [8,8 0x0]
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x48 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 1x32 children: not-inline
|
||||
BlockContainer <div> at (8,8) content-size 1x32 [BFC] children: inline
|
||||
frag 0 from ImageBox start: 0, length: 0, rect: [8,8 16x32] baseline: 32
|
||||
ImageBox <img> at (8,8) content-size 16x32 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 1x17 children: not-inline
|
||||
BlockContainer <div> at (8,8) content-size 1x17 [BFC] children: inline
|
||||
frag 0 from ImageBox start: 0, length: 0, rect: [8,21 0x0] baseline: 0
|
||||
ImageBox <img> at (8,21) content-size 0x0 children: not-inline
|
||||
|
||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x48]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 1x32]
|
||||
PaintableWithLines (BlockContainer<DIV>) [8,8 1x32] overflow: [8,8 16x32]
|
||||
ImagePaintable (ImageBox<IMG>) [8,8 16x32]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 1x17]
|
||||
PaintableWithLines (BlockContainer<DIV>) [8,8 1x17]
|
||||
ImagePaintable (ImageBox<IMG>) [8,21 0x0]
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x48 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x32 children: not-inline
|
||||
ImageBox <img> at (8,8) content-size 16x32 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x16 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x0 children: not-inline
|
||||
ImageBox <img> at (8,8) content-size 0x0 children: not-inline
|
||||
|
||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x48]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x32]
|
||||
ImagePaintable (ImageBox<IMG>) [8,8 16x32]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x16]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x0]
|
||||
ImagePaintable (ImageBox<IMG>) [8,8 0x0]
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
<!doctype html><img>
|
|
@ -36,16 +36,21 @@ void ImageBox::prepare_for_replaced_layout()
|
|||
|
||||
if (renders_as_alt_text()) {
|
||||
auto const& element = verify_cast<HTML::HTMLElement>(dom_node());
|
||||
auto& font = Platform::FontPlugin::the().default_font();
|
||||
auto alt = element.get_attribute_value(HTML::AttributeNames::alt);
|
||||
|
||||
CSSPixels alt_text_width = 0;
|
||||
if (!m_cached_alt_text_width.has_value())
|
||||
m_cached_alt_text_width = CSSPixels::nearest_value_for(font.width(alt));
|
||||
alt_text_width = m_cached_alt_text_width.value();
|
||||
if (alt.is_empty()) {
|
||||
set_natural_width(0);
|
||||
set_natural_height(0);
|
||||
} else {
|
||||
auto const& font = Platform::FontPlugin::the().default_font();
|
||||
CSSPixels alt_text_width = 0;
|
||||
if (!m_cached_alt_text_width.has_value())
|
||||
m_cached_alt_text_width = CSSPixels::nearest_value_for(font.width(alt));
|
||||
alt_text_width = m_cached_alt_text_width.value();
|
||||
|
||||
set_natural_width(alt_text_width + 16);
|
||||
set_natural_height(CSSPixels::nearest_value_for(font.pixel_size()) + 16);
|
||||
set_natural_width(alt_text_width + 16);
|
||||
set_natural_height(CSSPixels::nearest_value_for(font.pixel_size()) + 16);
|
||||
}
|
||||
}
|
||||
|
||||
if (!has_natural_width() && !has_natural_height()) {
|
||||
|
|
Loading…
Add table
Reference in a new issue