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>
This commit is contained in:
Simon Wülker 2025-05-15 19:30:38 +02:00 committed by GitHub
parent f9382fcaa0
commit b100a98e1d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 469 additions and 100 deletions

View file

@ -14,7 +14,7 @@ use style::attr::AttrValue;
use stylo_dom::ElementState;
use embedder_traits::{SelectElementOptionOrOptgroup, SelectElementOption};
use euclid::{Size2D, Point2D, Rect};
use embedder_traits::EmbedderMsg;
use embedder_traits::{FormControl as EmbedderFormControl, EmbedderMsg};
use crate::dom::bindings::codegen::GenericBindings::HTMLOptGroupElementBinding::HTMLOptGroupElement_Binding::HTMLOptGroupElementMethods;
use crate::dom::activation::Activatable;
@ -406,12 +406,10 @@ impl HTMLSelectElement {
let selected_index = self.list_of_options().position(|option| option.Selected());
let document = self.owner_document();
document.send_to_embedder(EmbedderMsg::ShowSelectElementMenu(
document.send_to_embedder(EmbedderMsg::ShowFormControl(
document.webview_id(),
options,
selected_index,
DeviceIntRect::from_untyped(&rect.to_box2d()),
ipc_sender,
EmbedderFormControl::SelectElement(options, selected_index, ipc_sender),
));
let Ok(response) = ipc_receiver.recv() else {