Bug 261876

Summary: Web Inspector: Option to view Pseudo-element (::placeholder)
Product: WebKit Reporter: Nilesh Prajapati <nileshprajapati>
Component: Web InspectorAssignee: Nobody <webkit-unassigned>
Status: RESOLVED DUPLICATE    
Severity: Normal CC: inspector-bugzilla-changes, karlcow, rcaliman
Priority: P2    
Version: Safari 17   
Hardware: Mac (Apple Silicon)   
OS: macOS 13   
Attachments:
Description Flags
Image of Firefox Web Inspector - Pseudo-element option none

Description Nilesh Prajapati 2023-09-21 05:56:08 PDT
Created attachment 467812 [details]
Image of Firefox Web Inspector - Pseudo-element option

Enhancement Request to Inspect Element.

Safari > Inspect Element > Pseudo-element option

The user can view the following: active, focus, focus-visible, focus-within, hover, target, visited.

Currently, within Web Inspector, the user does not have the option to view/change styling for ::placeholder.

Example:
Firefox > Inspect > Style panel > Pseudo-element.
Comment 1 Karl Dubost 2023-09-21 19:26:09 PDT
You are right. That would be a good improvement. It seems to be in the backend code of the Web Inspector according to Bug 203269

*** This bug has been marked as a duplicate of bug 203269 ***
Comment 2 Razvan Caliman 2023-09-25 10:14:54 PDT
(In reply to Nilesh Prajapati from comment #0)

> The user can view the following: active, focus, focus-visible, focus-within,
> hover, target, visited.
> 

Those are pseudo-classes. `::placeholder` is a pseudo-element, like `::before`, `::after`, `::marker` and others. 


The UI in the Styles panel is for toggling those pseudo-classes to reveal corresponding styles. The pseudo-element `::placeholder` would not be on that list.


Karl is right that not showing CSS rules that include `::placeholder` in the selector in the Styles panel is indeed a bug and duplicate of Bug 203269 which we need to fix.