Create an utlity function for UA Shadow

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
This commit is contained in:
stevennovaryo 2025-06-06 17:46:09 +08:00
parent 3340e5e786
commit 1c2d292816
7 changed files with 45 additions and 72 deletions

View file

@ -666,10 +666,6 @@ impl Element {
.upcast::<Node>()
.set_containing_shadow_root(Some(&shadow_root));
if is_ua_widget == IsUserAgentWidget::Yes {
shadow_root.upcast::<Node>().set_in_ua_widget();
}
let bind_context = BindContext {
tree_connected: self.upcast::<Node>().is_connected(),
tree_is_in_a_document_tree: self.upcast::<Node>().is_in_a_document_tree(),
@ -684,6 +680,36 @@ impl Element {
Ok(shadow_root)
}
/// Attach a UA widget shadow root with its default parameters.
/// Additionally mark ShadowRoot to use styling configuration for a UA widget.
///
/// TODO: Ideally, all of the UA shadow root should use UA widget styling, but
/// some of the UA widget implemented prior to the implementation of Gecko's
/// UA widget matching, might need some tweaking.
pub(crate) fn attach_ua_shadow_root(
&self,
use_ua_widget_styling: bool,
can_gc: CanGc,
) -> DomRoot<ShadowRoot> {
let root = self
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
true,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed");
if use_ua_widget_styling {
root.upcast::<Node>().set_in_ua_widget();
}
root
}
pub(crate) fn detach_shadow(&self, can_gc: CanGc) {
let Some(ref shadow_root) = self.shadow_root() else {
unreachable!("Trying to detach a non-attached shadow root");

View file

@ -103,18 +103,10 @@ impl HTMLDetailsElement {
fn create_shadow_tree(&self, can_gc: CanGc) {
let document = self.owner_document();
// TODO(stevennovaryo): Reimplement details styling.
let root = self
.upcast::<Element>()
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
false,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed");
.attach_ua_shadow_root(false, can_gc);
let summary = HTMLSlotElement::new(local_name!("slot"), None, &document, None, can_gc);
root.upcast::<Node>()

View file

@ -1090,17 +1090,9 @@ impl HTMLInputElement {
/// or create one if none exists.
fn shadow_root(&self, can_gc: CanGc) -> DomRoot<ShadowRoot> {
self.upcast::<Element>().shadow_root().unwrap_or_else(|| {
// TODO(stevennovaryo): adjust type=color's styling.
self.upcast::<Element>()
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
true,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed")
.attach_ua_shadow_root(self.input_type() == InputType::Text, can_gc)
})
}
@ -1269,7 +1261,7 @@ impl HTMLInputElement {
} else {
value = DOMString::from("#000000");
}
let style = format!("background-color: {value}");
let style = format!("background-color: {value} !important; z-index: 10000");
color_shadow_tree
.color_value
.upcast::<Element>()

View file

@ -1996,17 +1996,10 @@ impl HTMLMediaElement {
// if we are already showing the controls.
return;
}
let shadow_root = element
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
false,
SlotAssignmentMode::Manual,
can_gc,
)
.unwrap();
// FIXME: Recheck styling for media element
let shadow_root = self
.upcast::<Element>()
.attach_ua_shadow_root(false, can_gc);
let document = self.owner_document();
let script = HTMLScriptElement::new(
local_name!("script"),

View file

@ -79,18 +79,8 @@ impl HTMLMeterElement {
fn create_shadow_tree(&self, can_gc: CanGc) {
let document = self.owner_document();
let root = self
.upcast::<Element>()
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
false,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed");
// FIXME: Add servo specific appearence reftest
let root = self.upcast::<Element>().attach_ua_shadow_root(true, can_gc);
let meter_value = HTMLDivElement::new(local_name!("div"), None, &document, None, can_gc);
root.upcast::<Node>()

View file

@ -77,18 +77,8 @@ impl HTMLProgressElement {
fn create_shadow_tree(&self, can_gc: CanGc) {
let document = self.owner_document();
let root = self
.upcast::<Element>()
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
false,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed");
// FIXME: Add servo specific appearence reftest
let root = self.upcast::<Element>().attach_ua_shadow_root(true, can_gc);
let progress_bar = HTMLDivElement::new(local_name!("div"), None, &document, None, can_gc);
// FIXME: This should use ::-moz-progress-bar

View file

@ -258,18 +258,8 @@ impl HTMLSelectElement {
fn create_shadow_tree(&self, can_gc: CanGc) {
let document = self.owner_document();
let root = self
.upcast::<Element>()
.attach_shadow(
IsUserAgentWidget::Yes,
ShadowRootMode::Closed,
false,
false,
false,
SlotAssignmentMode::Manual,
can_gc,
)
.expect("Attaching UA shadow root failed");
// TODO: Adjust <select> element styling considering
let root = self.upcast::<Element>().attach_ua_shadow_root(true, can_gc);
let select_box = HTMLDivElement::new(local_name!("div"), None, &document, None, can_gc);
select_box.upcast::<Element>().set_string_attribute(