| Summary: | Margin accumulates on every layout in Shadow DOM | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | oceansky <cris> | ||||
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | NEW --- | ||||||
| Severity: | Normal | CC: | ahmad.saleem792, bfulgham, koivisto, simon.fraser, webkit-bug-importer, zalan | ||||
| Priority: | P2 | Keywords: | InRadar | ||||
| Version: | Safari 17 | ||||||
| Hardware: | All | ||||||
| OS: | All | ||||||
| Attachments: |
|
||||||
|
Description
oceansky
2023-11-08 01:23:33 PST
Could you describe what the bug actually is? I've loaded your test case, and I see "I am the bug" but it would be better to say something like "You should see a green box below, but it's hidden" or something. Hello Simon Fraser, Yes, thank you, I'm sorry about that! You're right that it could indeed be described better. The bug is the accumulation of a margin when the custom element is re-rendered. The result is that the paragraph and button are pushed down on each render, by this growing 'ghost' margin. I do not know if it is actually a "margin", but its effect is similar. The only data change is an increment of a counter, displayed as text in the paragraph, which seems unlikely to account for it. Yet it occurs! Examining the DOM in Inspector does not reveal any node leak: there are not unintended nodes being added at each render. I could not find any CSS (styled or computed) that defines this increasing offset. There is no code, style, or change it seems that creates this margin in the reproduction, it simply occurs. It's entirely possible I simply may have missed something. The reproduction code is very straightforward, so that seems unlikely, tho not impossible! Hit the "Show me the Bug" button to see it in action. Confirmed this still exists in Version 17.1.2 (18616.2.9.11.12, 18616) Does this only happen when using Shadow DOM? Let me double check that. I will replace this.shadow.innerText = ... with this.innerText and not create a shadow. Hold on a bit... ! :) Simon Fraser, you are correct! Your suspicion was right, this only occurs when using Shadow DOM. I've created an absent test case here with no Shadow DOM and no Bug: https://00000o1.github.io/-/bug-examples/safari-bug-nov-8-2023-variant-2/index.html Thank you for the clarifying question! :) Confirmed that this still exists on Safari Version 17.2 (18617.1.17.11.11, 18617) Created attachment 470924 [details]
Testcase (from GitHub)
STR:
1) Load testcase
2) Click `show me the bug' button (once or multiple time)
Expected Result:
No change in layout
Actual Result:
On each click, the button gets pushed down.
____
Chrome Canary 125 and Firefox Nightly 126 are working as expected. While STP192 is also broken.
|