NEW 280399
Conditionally rendered slot elements causes other slots to be hidden
https://bugs.webkit.org/show_bug.cgi?id=280399
Summary Conditionally rendered slot elements causes other slots to be hidden
Hans Krywalsky
Reported 2024-09-26 02:38:08 PDT
Hey there, this is the first bug i report here. If you need any more info or help from me, please let me know. We mentioned a strange bug on our website, after we updated to ios18/macOS15: After an element renders a conditionally `slot` element, other `slot` elements on the same page gets removed. We use lit webcomponents and i also was able to create a very simple reproduction. I started a new default lit project and added simple components. Link: https://github.com/EinfachHans/ios18-slot-bug The steps to make it run are described in there. When you press on "toggle" another slot element is added to the page. In the same moment the slot from the headline component just gets hidden.
Attachments
Mathias R.
Comment 1 2024-10-01 02:33:08 PDT
Hi, we're facing the same Bug in a Project with conditionally rendered slots. In addition to Hans' explanation, I would like to add that this only seems to occur with elements whose slots have display: contents and contain text nodes. If you set the slot to e.g. display: block or wrap the text in an element such as span, p or div, the error does not occur. In his example that would mean using <my-headline><span>Headline</span></my-headline> in my-app.ts would work.
Radar WebKit Bug Importer
Comment 2 2024-10-03 02:39:15 PDT
Note You need to log in before you can comment on or make changes to this bug.