From a824b2781f93306d2e985177df7097f5f8ff2bca Mon Sep 17 00:00:00 2001
From: stevennovaryo <steven.novaryo@gmail.com>
Date: Thu, 15 May 2025 15:04:59 +0800
Subject: [PATCH] Use id instead of name for matching

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
---
 components/layout/stylesheets/details.css   |  8 +++---
 components/script/dom/htmldetailselement.rs | 31 +++++++++++----------
 components/shared/script_layout/lib.rs      |  8 ++++++
 3 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/components/layout/stylesheets/details.css b/components/layout/stylesheets/details.css
index 81331ae22c2..db3ccf3de47 100644
--- a/components/layout/stylesheets/details.css
+++ b/components/layout/stylesheets/details.css
@@ -1,18 +1,18 @@
 /* We should use `content-visibility` but it is yet to be implemented.
  * These rule would not comply with ::details-content and should be removed
  * with it's implementation */
-slot:not([name]) {
+slot[id="internal-contents-slot"] {
   display: none;
 }
-:host([open]) slot:not([name]) {
+:host([open]) slot[id="internal-contents-slot"] {
   display: block;
 }
 
-summary[name=internal-fallback-summary] {
+summary[id="internal-fallback-summary"] {
   display: list-item;
   counter-increment: list-item 0;
   list-style: disclosure-closed inside;
 }
-:host([open]) summary[name=internal-fallback-summary] {
+:host([open]) summary[id="internal-fallback-summary"] {
   list-style-type: disclosure-open;
 }
diff --git a/components/script/dom/htmldetailselement.rs b/components/script/dom/htmldetailselement.rs
index 1db5d035c94..9e1b18c3b5f 100644
--- a/components/script/dom/htmldetailselement.rs
+++ b/components/script/dom/htmldetailselement.rs
@@ -47,8 +47,6 @@ const DEFAULT_SUMMARY: &str = "Details";
 struct ShadowTree {
     summary: Dom<HTMLSlotElement>,
     descendants: Dom<HTMLSlotElement>,
-    /// The summary that is displayed if no other summary exists
-    implicit_summary: Dom<HTMLElement>,
 }
 
 #[dom_struct]
@@ -145,40 +143,45 @@ impl HTMLDetailsElement {
         );
         link_element.set_stylesheet(details_stylesheet.unwrap());
 
-        let summary = HTMLSlotElement::new(local_name!("slot"), None, &document, None, can_gc);
-        summary.upcast::<Element>().set_attribute(
-            &local_name!("name"),
-            AttrValue::from_atomic("internal-main-summary".to_owned()),
+        let summary_slot = HTMLSlotElement::new(local_name!("slot"), None, &document, None, can_gc);
+        summary_slot.upcast::<Element>().set_attribute(
+            &local_name!("id"),
+            AttrValue::from_atomic("internal-summary-slot".to_owned()),
             can_gc,
         );
         root.upcast::<Node>()
-            .AppendChild(summary.upcast::<Node>(), can_gc)
+            .AppendChild(summary_slot.upcast::<Node>(), can_gc)
             .unwrap();
 
         let fallback_summary =
             HTMLElement::new(local_name!("summary"), None, &document, None, can_gc);
         fallback_summary.upcast::<Element>().set_attribute(
-            &local_name!("name"),
+            &local_name!("id"),
             AttrValue::from_atomic("internal-fallback-summary".to_owned()),
             can_gc,
         );
         fallback_summary
             .upcast::<Node>()
             .SetTextContent(Some(DEFAULT_SUMMARY.into()), can_gc);
-        summary
+        summary_slot
             .upcast::<Node>()
             .AppendChild(fallback_summary.upcast::<Node>(), can_gc)
             .unwrap();
 
-        let descendants = HTMLSlotElement::new(local_name!("slot"), None, &document, None, can_gc);
+        let descendants_slot =
+            HTMLSlotElement::new(local_name!("slot"), None, &document, None, can_gc);
+        descendants_slot.upcast::<Element>().set_attribute(
+            &local_name!("id"),
+            AttrValue::from_atomic("internal-contents-slot".to_owned()),
+            can_gc,
+        );
         root.upcast::<Node>()
-            .AppendChild(descendants.upcast::<Node>(), can_gc)
+            .AppendChild(descendants_slot.upcast::<Node>(), can_gc)
             .unwrap();
 
         let _ = self.shadow_tree.borrow_mut().insert(ShadowTree {
-            summary: summary.as_traced(),
-            descendants: descendants.as_traced(),
-            implicit_summary: fallback_summary.as_traced(),
+            summary: summary_slot.as_traced(),
+            descendants: descendants_slot.as_traced(),
         });
         self.upcast::<Node>()
             .dirty(crate::dom::node::NodeDamage::OtherNodeDamage);
diff --git a/components/shared/script_layout/lib.rs b/components/shared/script_layout/lib.rs
index 37d05c31286..94bcd910915 100644
--- a/components/shared/script_layout/lib.rs
+++ b/components/shared/script_layout/lib.rs
@@ -673,8 +673,16 @@ pub fn parse_ua_stylesheet(
         .map(DocumentStyleSheet)
 }
 
+/// Parse stylesheet for <details> element to insert its UA shadow DOM.
+///
+/// TODO(stevennovaryo): The more approriate way to handle this is to use UA stylesheet.
+///                      But this element's styles needs to be in shadow-scoped stylesheet.
+///                      This could be done if an UA shadow-scoped UA sheet is introduced.
 pub fn parse_details_stylesheet(
     shared_lock: &SharedRwLock,
 ) -> Result<ServoArc<Stylesheet>, &'static str> {
+    // FIXME: We are parsing it as a Author stylesheet, but according to, it's nature
+    //        it should be an user agent stylesheet. This is because we are only allowing
+    //        the actual UA stylesheet to have that origin.
     parse_stylesheet_as_origin(shared_lock, "details.css", DETAILS_CSS, Origin::Author)
 }