Bug 303467

Summary: Manipulating the CustomStateSet states can result in an inconsistent state set
Product: WebKit Reporter: jeripeier
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: koivisto, ntim, rniwa, webkit-bug-importer, webkit, woodlxf00
Priority: P2 Keywords: InRadar
Version: Safari 26   
Hardware: Mac (Apple Silicon)   
OS: macOS 26   
Bug Depends on:    
Bug Blocks: 148695    
Attachments:
Description Flags
Screenshot of reproduced bug state none

jeripeier
Reported 2025-12-03 02:51:13 PST
Created attachment 477595 [details] Screenshot of reproduced bug state When manipulating the custom state set (https://developer.mozilla.org/en-US/docs/Web/API/CustomStateSet) of the element internals, we sometimes face inconsistent states: Although a state was removed from internals.states set, e.g. `internals.states.has('state-xy')` or this.matches(':state(state-xy))') still matches. Reproduction: 1. Go to https://stackblitz.com/edit/custom-element-state-set-reproduction?file=index.html in Safari (this bug is not present in Firefox or Chrome). 2. Wait for 5 seconds and see the report whether the bug occurred or not. If not, reload the page until the bug is reproduced. 3. If the bug occurred, the count of attempts to land in the inconsistent state are displayed. Thank you for having a look at this issue.
Attachments
Screenshot of reproduced bug state (845.31 KB, image/png)
2025-12-03 02:51 PST, jeripeier 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
jeripeier
Comment 1 2025-12-04 00:18:29 PST
I detected another, potentially related issue: even without manipulating the states set, but by only calling `element.internals.states.has()` fails regularly. I created a reproduction here: https://stackblitz.com/edit/custom-element-state-set-reproduction-bd7dpar5?file=index.html
Radar WebKit Bug Importer
Comment 2 2025-12-10 02:52:11 PST
<rdar://problem/166213656>
Woody Lee
Comment 3 2025-12-25 18:35:07 PST
Meet a related bug: Adding several states in connectedCallback, the states may be lost. But it works well when adding breakpoints, or adding output console in the source code (no matter whether DevTool opens or not). Tested with some console ways: * console.log(states) ✅ * console.log(states.size) ❌ * console.log(...states) ❌ * console.log(Array.from(states)) ✅ * console.log(Array.from(states).length) ❌
Note You need to log in before you can comment on or make changes to this bug.