Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-06-06 16:45:39 +00:00
Code Issues Projects Releases Packages Wiki Activity

Anonymous boxes that wrap inlines should not inherit overflow (#30579)

Browse source 
In legacy layout, anonymous text wrappers were inheriting the `overflow`
and `text-overflow` properties. This results in the creation of extra
clipping for these anonymous wrappers which could clip away floats. We
will likely implement `text-overflow` differently in non-legacy layout.

This change marks all legacy layout pseudo elements as "legacy" and also
adds a new pseudo element for non-legacy layout that does not inherit
`overflow`.

Fixes #30562.

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Martin Robinson 2023-10-19 15:43:55 +02:00 • committed by GitHub
parent 634a5d9cf5
commit fd31da9102
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 120 additions and 88 deletions
Download patch file Download diff file Expand all files Collapse all files

28
components/layout/construct.rs
View file

@ -805,7 +805,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoText,
&PseudoElement::ServoLegacyText,
&style,
);
if node_is_input_or_text_area {
@ -813,7 +813,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoInputText,
&PseudoElement::ServoLegacyInputText,
&style,
)
}
@ -1116,7 +1116,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoText,
&PseudoElement::ServoLegacyText,
&style,
),
node.restyle_damage(),
@ -1133,7 +1133,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoText,
&PseudoElement::ServoLegacyText,
&style,
);
self.create_fragments_for_node_text_content(&mut fragments, node, &text_style)
@ -1176,7 +1176,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoInlineBlockWrapper,
&PseudoElement::ServoLegacyInlineBlockWrapper,
&style,
);
let fragment_info =
@ -1227,7 +1227,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&style_context.guards,
&PseudoElement::ServoInlineAbsolute,
&PseudoElement::ServoLegacyInlineAbsolute,
&style,
);
let fragment = Fragment::from_opaque_node_and_style(
@ -1372,7 +1372,7 @@ where
.stylist
.style_for_anonymous::<ConcreteThreadSafeLayoutNode::ConcreteElement>(
&context.guards,
&PseudoElement::ServoTableWrapper,
&PseudoElement::ServoLegacyTableWrapper,
&table_style,
);
}
@ -2189,7 +2189,7 @@ where
)));
let text_style = context.stylist.style_for_anonymous::<E>(
&context.guards,
&PseudoElement::ServoText,
&PseudoElement::ServoLegacyText,
&node.style,
);
@ -2317,7 +2317,7 @@ impl Legalizer {
let mut block_wrapper = Legalizer::create_anonymous_flow::<E, _>(
context,
parent,
&[PseudoElement::ServoAnonymousBlock],
&[PseudoElement::ServoLegacyAnonymousBlock],
SpecificFragmentInfo::Generic,
BlockFlow::from_fragment,
);
@ -2378,21 +2378,21 @@ impl Legalizer {
FlowClass::TableRow => self.push_new_anonymous_flow::<E, _>(
context,
parent,
&[PseudoElement::ServoAnonymousTableCell],
&[PseudoElement::ServoLegacyAnonymousTableCell],
SpecificFragmentInfo::TableCell,
TableCellFlow::from_fragment,
),
FlowClass::Table | FlowClass::TableRowGroup => self.push_new_anonymous_flow::<E, _>(
context,
parent,
&[PseudoElement::ServoAnonymousTableRow],
&[PseudoElement::ServoLegacyAnonymousTableRow],
SpecificFragmentInfo::TableRow,
TableRowFlow::from_fragment,
),
FlowClass::TableWrapper => self.push_new_anonymous_flow::<E, _>(
context,
parent,
&[PseudoElement::ServoAnonymousTable],
&[PseudoElement::ServoLegacyAnonymousTable],
SpecificFragmentInfo::Table,
TableFlow::from_fragment,
),
@ -2400,8 +2400,8 @@ impl Legalizer {
context,
parent,
&[
PseudoElement::ServoTableWrapper,
PseudoElement::ServoAnonymousTableWrapper,
PseudoElement::ServoLegacyTableWrapper,
PseudoElement::ServoLegacyAnonymousTableWrapper,
],
SpecificFragmentInfo::TableWrapper,
TableWrapperFlow::from_fragment,

2
components/layout_2020/dom_traversal.rs
View file

@ -228,7 +228,7 @@ fn traverse_pseudo_element_contents<'dom, Node>(
.stylist
.style_for_anonymous::<Node::ConcreteElement>(
&context.shared_context().guards,
&PseudoElement::ServoText,
&PseudoElement::ServoAnonymousBox,
&info.style,
)
});

2
components/layout_2020/flexbox/construct.rs
View file

@ -132,7 +132,7 @@ where
.stylist
.style_for_anonymous::<Node::ConcreteElement>(
&self.context.shared_context().guards,
&style::selector_parser::PseudoElement::ServoText,
&style::selector_parser::PseudoElement::ServoAnonymousBox,
&self.info.style,
),
)

4
components/layout_2020/flow/construct.rs
View file

@ -448,7 +448,7 @@ where
.stylist
.style_for_anonymous::<Node::ConcreteElement>(
&self.context.shared_context().guards,
&PseudoElement::ServoText, // FIMXE: use `PseudoElement::Marker` when we add it
&PseudoElement::ServoLegacyText, // FIMXE: use `PseudoElement::Marker` when we add it
&info.style,
);
self.handle_inline_level_element(
@ -684,7 +684,7 @@ where
.stylist
.style_for_anonymous::<Node::ConcreteElement>(
&context.shared_context().guards,
&PseudoElement::ServoText,
&PseudoElement::ServoAnonymousBox,
block_container_style,
)
});

111
components/style/servo/selector_parser.rs
View file

@ -52,20 +52,21 @@ pub enum PseudoElement {
// Non-eager pseudos.
DetailsSummary,
DetailsContent,
ServoText,
ServoInputText,
ServoTableWrapper,
ServoAnonymousTableWrapper,
ServoAnonymousTable,
ServoAnonymousTableRow,
ServoAnonymousTableCell,
ServoAnonymousBlock,
ServoInlineBlockWrapper,
ServoInlineAbsolute,
ServoAnonymousBox,
ServoLegacyText,
ServoLegacyInputText,
ServoLegacyTableWrapper,
ServoLegacyAnonymousTableWrapper,
ServoLegacyAnonymousTable,
ServoLegacyAnonymousTableRow,
ServoLegacyAnonymousTableCell,
ServoLegacyAnonymousBlock,
ServoLegacyInlineBlockWrapper,
ServoLegacyInlineAbsolute,
}
/// The count of all pseudo-elements.
pub const PSEUDO_COUNT: usize = PseudoElement::ServoInlineAbsolute as usize + 1;
pub const PSEUDO_COUNT: usize = PseudoElement::ServoLegacyInlineAbsolute as usize + 1;
impl ToCss for PseudoElement {
fn to_css<W>(&self, dest: &mut W) -> fmt::Result
@ -79,16 +80,17 @@ impl ToCss for PseudoElement {
Selection => "::selection",
DetailsSummary => "::-servo-details-summary",
DetailsContent => "::-servo-details-content",
ServoText => "::-servo-text",
ServoInputText => "::-servo-input-text",
ServoTableWrapper => "::-servo-table-wrapper",
ServoAnonymousTableWrapper => "::-servo-anonymous-table-wrapper",
ServoAnonymousTable => "::-servo-anonymous-table",
ServoAnonymousTableRow => "::-servo-anonymous-table-row",
ServoAnonymousTableCell => "::-servo-anonymous-table-cell",
ServoAnonymousBlock => "::-servo-anonymous-block",
ServoInlineBlockWrapper => "::-servo-inline-block-wrapper",
ServoInlineAbsolute => "::-servo-inline-absolute",
ServoAnonymousBox => "::-servo-anonymous-box",
ServoLegacyText => "::-servo-legacy-text",
ServoLegacyInputText => "::-servo-legacy-input-text",
ServoLegacyTableWrapper => "::-servo-legacy-table-wrapper",
ServoLegacyAnonymousTableWrapper => "::-servo-legacy-anonymous-table-wrapper",
ServoLegacyAnonymousTable => "::-servo-legacy-anonymous-table",
ServoLegacyAnonymousTableRow => "::-servo-legacy-anonymous-table-row",
ServoLegacyAnonymousTableCell => "::-servo-legacy-anonymous-table-cell",
ServoLegacyAnonymousBlock => "::-servo-legacy-anonymous-block",
ServoLegacyInlineBlockWrapper => "::-servo-legacy-inline-block-wrapper",
ServoLegacyInlineAbsolute => "::-servo-legacy-inline-absolute",
})
}
}
@ -225,16 +227,17 @@ impl PseudoElement {
},
PseudoElement::DetailsSummary => PseudoElementCascadeType::Lazy,
PseudoElement::DetailsContent |
PseudoElement::ServoText |
PseudoElement::ServoInputText |
PseudoElement::ServoTableWrapper |
PseudoElement::ServoAnonymousTableWrapper |
PseudoElement::ServoAnonymousTable |
PseudoElement::ServoAnonymousTableRow |
PseudoElement::ServoAnonymousTableCell |
PseudoElement::ServoAnonymousBlock |
PseudoElement::ServoInlineBlockWrapper |
PseudoElement::ServoInlineAbsolute => PseudoElementCascadeType::Precomputed,
PseudoElement::ServoAnonymousBox |
PseudoElement::ServoLegacyText |
PseudoElement::ServoLegacyInputText |
PseudoElement::ServoLegacyTableWrapper |
PseudoElement::ServoLegacyAnonymousTableWrapper |
PseudoElement::ServoLegacyAnonymousTable |
PseudoElement::ServoLegacyAnonymousTableRow |
PseudoElement::ServoLegacyAnonymousTableCell |
PseudoElement::ServoLegacyAnonymousBlock |
PseudoElement::ServoLegacyInlineBlockWrapper |
PseudoElement::ServoLegacyInlineAbsolute => PseudoElementCascadeType::Precomputed,
}
}
@ -498,65 +501,71 @@ impl<'a, 'i> ::selectors::Parser<'i> for SelectorParser<'a> {
}
DetailsContent
},
"-servo-text" => {
"-servo-anonymous-box" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoText
ServoAnonymousBox
},
"-servo-input-text" => {
"-servo-legacy-text" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoInputText
ServoLegacyText
},
"-servo-table-wrapper" => {
"-servo-legacy-input-text" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoTableWrapper
ServoLegacyInputText
},
"-servo-anonymous-table-wrapper" => {
"-servo-legacy-table-wrapper" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoAnonymousTableWrapper
ServoLegacyTableWrapper
},
"-servo-anonymous-table" => {
"-servo-legacy-anonymous-table-wrapper" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoAnonymousTable
ServoLegacyAnonymousTableWrapper
},
"-servo-anonymous-table-row" => {
"-servo-legacy-anonymous-table" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoAnonymousTableRow
ServoLegacyAnonymousTable
},
"-servo-anonymous-table-cell" => {
"-servo-legacy-anonymous-table-row" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoAnonymousTableCell
ServoLegacyAnonymousTableRow
},
"-servo-anonymous-block" => {
"-servo-legacy-anonymous-table-cell" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoAnonymousBlock
ServoLegacyAnonymousTableCell
},
"-servo-inline-block-wrapper" => {
"-servo-legacy-anonymous-block" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoInlineBlockWrapper
ServoLegacyAnonymousBlock
},
"-servo-inline-absolute" => {
"-servo-legacy-inline-block-wrapper" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoInlineAbsolute
ServoLegacyInlineBlockWrapper
},
"-servo-legacy-inline-absolute" => {
if !self.in_user_agent_stylesheet() {
return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))
}
ServoLegacyInlineAbsolute
},
_ => return Err(location.new_custom_error(SelectorParseErrorKind::UnexpectedIdent(name.clone())))

30
resources/servo.css
View file

@ -190,27 +190,27 @@ svg > * {
* broken for stuff like table backgrounds and such. Gecko explicitly inherits
* what it wants, which seems a bit better off-hand.
*/
*|*::-servo-anonymous-table,
*|*::-servo-anonymous-table-wrapper,
*|*::-servo-table-wrapper,
*|*::-servo-anonymous-block,
*|*::-servo-inline-block-wrapper,
*|*::-servo-inline-absolute {
*|*::-servo-legacy-anonymous-table,
*|*::-servo-legacy-anonymous-table-wrapper,
*|*::-servo-legacy-table-wrapper,
*|*::-servo-legacy-anonymous-block,
*|*::-servo-legacy-inline-block-wrapper,
*|*::-servo-legacy-inline-absolute {
all: inherit;
}
/* style for text node. */
*|*::-servo-text {
*|*::-servo-legacy-text {
text-overflow: inherit;
overflow: inherit;
}
*|*::-servo-table-wrapper {
*|*::-servo-legacy-table-wrapper {
display: table;
border: none;
}
*|*::-servo-anonymous-table-wrapper {
*|*::-servo-legacy-anonymous-table-wrapper {
position: static;
margin: 0;
counter-increment: none;
@ -221,7 +221,7 @@ svg > * {
overflow: visible;
}
*|*::-servo-anonymous-table {
*|*::-servo-legacy-anonymous-table {
display: table;
position: static;
border: none;
@ -230,7 +230,7 @@ svg > * {
overflow: visible;
}
*|*::-servo-anonymous-table-row {
*|*::-servo-legacy-anonymous-table-row {
display: table-row;
position: static;
border: none;
@ -238,7 +238,7 @@ svg > * {
overflow: visible;
}
*|*::-servo-anonymous-table-cell {
*|*::-servo-legacy-anonymous-table-cell {
display: table-cell;
position: static;
border: none;
@ -246,7 +246,7 @@ svg > * {
overflow: visible;
}
*|*::-servo-anonymous-block {
*|*::-servo-legacy-anonymous-block {
display: block;
position: static;
border: none;
@ -257,7 +257,7 @@ svg > * {
}
/* The outer fragment wrapper of an inline-block. */
*|*::-servo-inline-block-wrapper {
*|*::-servo-legacy-inline-block-wrapper {
position: static;
border: none;
padding: 0;
@ -265,7 +265,7 @@ svg > * {
}
/* The outer fragment wrapper of an inline absolute hypothetical fragment. */
*|*::-servo-inline-absolute {
*|*::-servo-legacy-inline-absolute {
clip: auto;
border: none;
padding: 0;

13
tests/wpt/meta/MANIFEST.json
View file

@ -61432,6 +61432,19 @@
{}
]
],
"float-in-inline-anonymous-block-with-overflow-hidden.html": [
"948394e7f9b348c72a13cc64f4852a988b2fa59c",
[
null,
[
[
"/css/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"float-in-nested-multicol-001.html": [
"8e1a257e389d0fdc6a4a69f63b81f32378a7b944",
[

2
tests/wpt/meta/css/css-flexbox/text-overflow-on-flexbox-001.html.ini
View file

@ -1,2 +0,0 @@
[text-overflow-on-flexbox-001.html]
expected: FAIL

2
tests/wpt/meta/css/css-position/sticky/position-sticky-hyperlink.html.ini Normal file
View file

@ -0,0 +1,2 @@
[position-sticky-hyperlink.html]
expected: FAIL

2
tests/wpt/meta/css/filter-effects/filtered-inline-is-container.html.ini
View file

@ -1,2 +0,0 @@
[filtered-inline-is-container.html]
expected: FAIL

12
tests/wpt/tests/css/CSS2/floats/float-in-inline-anonymous-block-with-overflow-hidden.html Normal file
View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<title>CSS Test: A float wrapped in an anonymous block should be visible within a container with overflow: hidden.</title>
<link rel="author" href="mailto:obrufrau@igalia.com" title="Oriol Brufrau">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="help" href="https://www.w3.org/TR/CSS22/visuren.html#anonymous-block-level" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="overflow: hidden; width: 100px; height: 100px; background: red">
<div style="height: 50px; background: green"></div>
<span>
<div style="float: left; width: 100px; height: 50px; background: green"></div>
</span>
</div>