dom: Textual Input UA Shadow Dom (#37527)

Depend on: 
- https://github.com/servo/servo/pull/37427
- https://github.com/servo/servo/pull/37483

Utilize input `type=text` for the display of all textual input. In
which, consist of
https://html.spec.whatwg.org/#the-input-element-as-a-text-entry-widget
and
https://html.spec.whatwg.org/#the-input-element-as-domain-specific-widgets
inputs.

For `password`, `url`, `tel`, and, `email` input, the appearance of
input container is exactly the same as the `text` input. Other types of
textual input simply extends `text` input by adding extra components
inside the container.

Testing: Servo textual input appearance WPT.

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
Signed-off-by: Jo Steven Novaryo <jo.steven.novaryo@huawei.com>

components/script/dom/node.rs

@@ -1852,6 +1852,9 @@ impl<'dom> LayoutNodeHelpers<'dom> for LayoutDom<'dom, Node> {
         }
     }
 
+    /// Whether this element should layout as a special case input element.
+    // TODO(#38251): With the implementation of Shadow DOM, we could implement the construction properly
+    //               in the DOM, instead of delegating it to layout.
     fn is_text_input(&self) -> bool {
         let type_id = self.type_id_for_layout();
         if type_id ==
@@ -1861,8 +1864,7 @@ impl<'dom> LayoutNodeHelpers<'dom> for LayoutDom<'dom, Node> {
         {
             let input = self.unsafe_get().downcast::<HTMLInputElement>().unwrap();
 
-            // FIXME: All the non-color and non-text input types currently render as text
-            !matches!(input.input_type(), InputType::Color | InputType::Text)
+            !input.is_textual_widget() && input.input_type() != InputType::Color
         } else {
             type_id ==
                 NodeTypeId::Element(ElementTypeId::HTMLElement(