Bug 266455

Summary: :user-invalid and :user-valid do not trigger for Form Associated Custom Elements
Product: WebKit Reporter: Nathan Knowler <nathan>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: ntim, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 17   
Hardware: All   
OS: All   
Attachments:
Description Flags
Demonstration of :user-invalid and :user-valid with a form associated custom element (works in Firefox) none

Nathan Knowler
Reported 2023-12-14 20:47:26 PST
Created attachment 469055 [details] Demonstration of :user-invalid and :user-valid with a form associated custom element (works in Firefox) `:user-invalid` and `:user-valid` do not work for form associated custom elements in Safari (or Chrome). It does work correctly in Firefox. I am able to trigger those pseudo-classes for a form associated custom element in Firefox when I make the form value of the element dirty with `ElementInternals.setFormValue()`, then either by setting or clearing a constraint violation with `ElementInternals.setValidity()`.
Attachments
Demonstration of :user-invalid and :user-valid with a form associated custom element (works in Firefox) (2.51 KB, text/html)
2023-12-14 20:47 PST, Nathan Knowler 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Nathan Knowler
Comment 1 2023-12-14 21:09:04 PST
Chromium issue is here: https://bugs.chromium.org/p/chromium/issues/detail?id=1511887
Tim Nguyen (:ntim)
Comment 2 2023-12-14 21:20:20 PST
It's not supposed to trigger for form associated custom elements according to the spec: https://html.spec.whatwg.org/#selector-user-valid There is a spec issue to change that though: https://github.com/whatwg/html/issues/9639 Firefox's implementation pre-dates the official specification for :user-valid/invalid.
Radar WebKit Bug Importer
Comment 3 2023-12-21 20:48:14 PST
<rdar://problem/120027003>
Note You need to log in before you can comment on or make changes to this bug.