Skip to content

Support type=text and type=color Input Pseudo Element Selector #198

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

stevennovaryo
Copy link
Contributor

@stevennovaryo stevennovaryo commented Jun 10, 2025

Add ::-servo-text-control-inner-editor, ::-servo-text-control-inner-container, ::-servo-text-control-placeholder, and ::-servo-input-color-swatch pseudo element selector supporting the implementation of of type=text and type=color input element.

These selectors would have a lazy cascade type. Additionally, implement PseudoElement::is_color_swatch for ::-servo-input-color-swatch which would prevent the tampering of its background color .

Stylo companion of servo/servo#37427.

@stevennovaryo stevennovaryo marked this pull request as ready for review June 13, 2025 13:26
@stevennovaryo stevennovaryo force-pushed the input-text-internal-pseudo-selector branch from 80ec17c to 591932e Compare June 16, 2025 02:25
Comment on lines -107 to -112
// Gecko definitely has pseudo-elements with style attributes, like
// ::-moz-color-swatch.
debug_assert!(
cfg!(feature = "gecko") || style_attribute.is_none() || pseudo_element.is_none(),
"Style attributes do not apply to pseudo-elements"
);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We are also allowing style attributes for pseudo element. Notice that, in Servo, this will applies only for the pseudo element with a concrete element behind it (i.e. implemented pseudo element).

@stevennovaryo
Copy link
Contributor Author

Could you help with the review of the companion PR as well? Thank you! @xiaochengh

@@ -190,7 +202,7 @@ impl PseudoElement {
/// Whether this pseudo-element is the ::-moz-color-swatch pseudo.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
/// Whether this pseudo-element is the ::-moz-color-swatch pseudo.
/// Whether this pseudo-element is the ::-servo-input-color-swatch pseudo.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done thanks!

Copy link
Contributor

@xiaochengh xiaochengh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM with a nit

Signed-off-by: stevennovaryo <[email protected]>
@stevennovaryo
Copy link
Contributor Author

I suppose both of the changes for pseudo element in Stylo and Servo is ready to be merged, could someone with a permission help with the merge?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants