Commit graph

6 commits

Author SHA1 Message Date
Jo Steven Novaryo
3cb16eb864
Reland Input type=text Shadow DOM With Performance Improvement (#37483)
Depends on #37427.

In addition to the changes introduced by
https://github.com/servo/servo/pull/37065, there are several performance
improvements and nits as follows:
- Use the internal pseudo element for style matching, this will reduce
the performance regression by ~66%.
- Manual construction of the `Text` node inside a text container. This
is followed by the modification of the inner `Text` node instead of
using `SetTextContent` which is more expensive.
- Use `implemented_pseudo_element` instead of
`text_control_inner_editor` `NodeFlag` to handle the special cases that
these elements should follow, specifically the:
  - focus delegation workaround;
  - selections; and
  - line height resolving.
- More documentation.

Servo's side of: https://github.com/servo/stylo/pull/217

Testing: No new unexpected WPT failure, except for the one introduced by
https://github.com/servo/servo/pull/37065/.
Fixes: #36307 #37205

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
2025-07-23 09:08:24 +00:00
Steven Novaryo
378c4648e4
script: Use an implemented pseudo-element to fortype=color ::color-swatch (#37427)
Implement internal pseudo element, which would be resolved as a
"Implemented Pseudo Element" within style computation. This is an
concrete element that would has a primary style after the style
computation, but could match and style resolved like an pseudo element.
Therefore, it would have a different behavior compared to how does
`pseudo`s that `ServoLayoutNode` had. Where they would not have a
concrete element behind it. Note that, due to the nature of these pseudo
elements residing inside a UA widget, these pseudo elements would
therefore not be accessible in JavaScript by default.

This kind of element is required in order to implement the [form control
pseudo element](https://drafts.csswg.org/css-forms-1/#pseudo-elements)
like `::placeholder`, `::color-swatch`, `::field-text`, etc.
 
See [this docs](https://hackmd.io/@ChaKweTiau/BJ3zRdLQlg) for more
details of the implementation.

Then, the implemented pseudo element is utilized to implement style
matching for input `type=text`.

Servo's side of: https://github.com/servo/stylo/pull/212

Testing: No WPT regression.

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
2025-07-09 15:36:58 +00:00
Oriol Brufau
00472dec8e
layout: Implement list-style-position quirk (#37837)
In quirks mode, the ::marker of a bare `<li>` should be
`list-style-position: inside`,

Testing: Some WPT improvement

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-07-03 09:16:54 +00:00
Fuguo
1f315e6c9c
Add a user agent style for the <slot> element (#37174)
In Chromium, the slot user agent stylesheet is located in
[html.css](https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/html/resources/html.css;l=1654).

Testing: This change fixes
`tests/wpt/meta/shadow-dom/directionality-001.tentative.html.ini`.

Signed-off-by: kongbai1996 <1782765876@qq.com>
2025-05-29 08:20:01 +00:00
Simon Wülker
b100a98e1d
Fully support <input type=color> (#36992)
This change adds a shadow-tree widget for `<input type=color>` elements.
It also involves some changes to the way layout interacts with the DOM,
because currently all `input` and `textarea` elements are rendered as
plain text and their descendants are ignored. This obviously doesn't
work for `<input type={color, date, range, etc}>`.


![image](https://github.com/user-attachments/assets/4f16c3b0-1f79-4095-b19d-1153f5853dd5)

<details><summary>HTML used for the screenshot above</summary>

```html
<input type=color>
```

</details>



Testing: I doubt that this affects WPT tests, because the appearance and
behaviour of the widget is almost entirely unspecified.

---------

Signed-off-by: Simon Wülker <simon.wuelker@arcor.de>
2025-05-15 17:30:38 +00:00
webbeef
3db0194e5a
Embed user agent stylesheets and media control resouces in libservo (#36803)
Embed user agent stylesheets and media control resouces in libservo as
decided in
https://github.com/servo/servo/pull/36788#issuecomment-2845332210

Signed-off-by: webbeef <me@webbeef.org>
2025-05-04 18:48:09 +00:00