mirror of
https://github.com/servo/servo.git
synced 2025-06-06 16:45:39 +00:00
layout: Add very basic support for showing text in input boxes (#32365)
This only paints text in input fields. Selection and cursor are still not painted. In addition to adding this feature, the change also updates the user-agent.css with the latest from the HTML specification. Extra padding and extraneous settings (such as a bogus line-height and min-height) are also removed from servo.css. This leads to some new passes. There are some new passes, this introduces failures as inserting text reveals issues that were hidden before. Notably: - failures in `/html/editing/editing-0/spelling-and-grammar-checking/`: We do not support spell-checking. - Most of the rest of the new failures are missing features of input boxes that are also missing in legacy layout.
This commit is contained in:
Martin Robinson
GitHub
parent
3d6accbbe3
commit
44064b1439
65 changed files with 225 additions and 204 deletions
|
|
@ -7,6 +7,7 @@ use std::borrow::Cow;
|
|||
use html5ever::{local_name, LocalName};
|
||||
use log::warn;
|
||||
use script_layout_interface::wrapper_traits::{ThreadSafeLayoutElement, ThreadSafeLayoutNode};
|
||||
use script_layout_interface::{LayoutElementType, LayoutNodeType};
|
||||
use servo_arc::Arc as ServoArc;
|
||||
use style::properties::ComputedValues;
|
||||
use style::selector_parser::PseudoElement;
|
||||
|
|
@ -33,7 +34,7 @@ pub(crate) struct NodeAndStyleInfo<Node> {
|
|||
pub style: ServoArc<ComputedValues>,
|
||||
}
|
||||
|
||||
impl<Node> NodeAndStyleInfo<Node> {
|
||||
impl<'dom, Node: NodeExt<'dom>> NodeAndStyleInfo<Node> {
|
||||
fn new_with_pseudo(
|
||||
node: Node,
|
||||
pseudo_element_type: WhichPseudoElement,
|
||||
|
|
@ -53,6 +54,12 @@ impl<Node> NodeAndStyleInfo<Node> {
|
|||
style,
|
||||
}
|
||||
}
|
||||
|
||||
pub(crate) fn is_single_line_text_input(&self) -> bool {
|
||||
self.node.map_or(false, |node| {
|
||||
node.type_id() == LayoutNodeType::Element(LayoutElementType::HTMLInputElement)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
impl<Node: Clone> NodeAndStyleInfo<Node> {
|
||||
|
|
@ -172,6 +179,23 @@ fn traverse_children_of<'dom, Node>(
|
|||
}
|
||||
}
|
||||
|
||||
if matches!(
|
||||
parent_element.type_id(),
|
||||
LayoutNodeType::Element(LayoutElementType::HTMLInputElement)
|
||||
) {
|
||||
let info = NodeAndStyleInfo::new(parent_element, parent_element.style(context));
|
||||
|
||||
// The addition of zero-width space here forces the text input to have an inline formatting
|
||||
// context that might otherwise be trimmed if there's no text. This is important to ensure
|
||||
// that the input element is at least as tall as the line gap of the caret:
|
||||
// <https://drafts.csswg.org/css-ui/#element-with-default-preferred-size>.
|
||||
//
|
||||
// TODO: Is there a less hacky way to do this?
|
||||
handler.handle_text(&info, "\u{200B}".into());
|
||||
|
||||
handler.handle_text(&info, parent_element.to_threadsafe().node_text_content());
|
||||
}
|
||||
|
||||
traverse_pseudo_element(WhichPseudoElement::After, parent_element, context, handler);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -159,7 +159,8 @@ where
|
|||
let Some(inline_formatting_context) = inline_formatting_context_builder.finish(
|
||||
self.context,
|
||||
self.text_decoration_line,
|
||||
true, /* has_first_formatted_line */
|
||||
true, /* has_first_formatted_line */
|
||||
false, /* is_single_line_text_box */
|
||||
) else {
|
||||
return None;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -191,6 +191,7 @@ where
|
|||
) -> Self {
|
||||
let text_decoration_line =
|
||||
propagated_text_decoration_line | info.style.clone_text_decoration_line();
|
||||
|
||||
BlockContainerBuilder {
|
||||
context,
|
||||
info,
|
||||
|
|
@ -214,6 +215,7 @@ where
|
|||
self.context,
|
||||
self.text_decoration_line,
|
||||
!self.have_already_seen_first_line_for_text_indent,
|
||||
self.info.is_single_line_text_input(),
|
||||
) {
|
||||
// There are two options here. This block was composed of both one or more inline formatting contexts
|
||||
// and child blocks OR this block was a single inline formatting context. In the latter case, we
|
||||
|
|
@ -598,6 +600,7 @@ where
|
|||
self.context,
|
||||
self.text_decoration_line,
|
||||
!self.have_already_seen_first_line_for_text_indent,
|
||||
self.info.is_single_line_text_input(),
|
||||
) {
|
||||
self.push_block_level_job_for_inline_formatting_context(inline_formatting_context);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -283,6 +283,7 @@ impl InlineFormattingContextBuilder {
|
|||
layout_context,
|
||||
text_decoration_line,
|
||||
has_first_formatted_line,
|
||||
/* is_single_line_text_input = */ false,
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -292,6 +293,7 @@ impl InlineFormattingContextBuilder {
|
|||
layout_context: &LayoutContext,
|
||||
text_decoration_line: TextDecorationLine,
|
||||
has_first_formatted_line: bool,
|
||||
is_single_line_text_input: bool,
|
||||
) -> Option<InlineFormattingContext> {
|
||||
if self.is_empty() {
|
||||
return None;
|
||||
|
|
@ -305,6 +307,7 @@ impl InlineFormattingContextBuilder {
|
|||
layout_context,
|
||||
text_decoration_line,
|
||||
has_first_formatted_line,
|
||||
is_single_line_text_input,
|
||||
))
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -155,6 +155,9 @@ pub(crate) struct InlineFormattingContext {
|
|||
|
||||
/// Whether or not this [`InlineFormattingContext`] contains floats.
|
||||
pub(super) contains_floats: bool,
|
||||
|
||||
/// Whether or not this is an inline formatting context for a single line text input.
|
||||
pub(super) is_single_line_text_input: bool,
|
||||
}
|
||||
|
||||
/// A collection of data used to cache [`FontMetrics`] in the [`InlineFormattingContext`]
|
||||
|
|
@ -574,10 +577,20 @@ impl UnbreakableSegmentUnderConstruction {
|
|||
}
|
||||
}
|
||||
|
||||
bitflags! {
|
||||
pub struct InlineContainerStateFlags: u8 {
|
||||
const CREATE_STRUT = 0b0001;
|
||||
const IS_SINGLE_LINE_TEXT_INPUT = 0b0010;
|
||||
}
|
||||
}
|
||||
|
||||
struct InlineContainerState {
|
||||
/// The style of this inline container.
|
||||
style: Arc<ComputedValues>,
|
||||
|
||||
/// Flags which describe details of this [`InlineContainerState`].
|
||||
flags: InlineContainerStateFlags,
|
||||
|
||||
/// Whether or not we have processed any content (an atomic element or text) for
|
||||
/// this inline box on the current line OR any previous line.
|
||||
has_content: bool,
|
||||
|
|
@ -1583,6 +1596,7 @@ impl InlineFormattingContext {
|
|||
layout_context: &LayoutContext,
|
||||
text_decoration_line: TextDecorationLine,
|
||||
has_first_formatted_line: bool,
|
||||
is_single_line_text_input: bool,
|
||||
) -> Self {
|
||||
// This is to prevent a double borrow.
|
||||
let text_content: String = builder.text_segments.into_iter().collect();
|
||||
|
|
@ -1622,6 +1636,7 @@ impl InlineFormattingContext {
|
|||
text_decoration_line,
|
||||
has_first_formatted_line,
|
||||
contains_floats: builder.contains_floats,
|
||||
is_single_line_text_input,
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1665,6 +1680,15 @@ impl InlineFormattingContext {
|
|||
.map(|font| font.metrics.clone());
|
||||
|
||||
let style_text = containing_block.style.get_inherited_text();
|
||||
let mut inline_container_state_flags = InlineContainerStateFlags::empty();
|
||||
if inline_container_needs_strut(style, layout_context, None) {
|
||||
inline_container_state_flags.insert(InlineContainerStateFlags::CREATE_STRUT);
|
||||
}
|
||||
if self.is_single_line_text_input {
|
||||
inline_container_state_flags
|
||||
.insert(InlineContainerStateFlags::IS_SINGLE_LINE_TEXT_INPUT);
|
||||
}
|
||||
|
||||
let mut ifc = InlineFormattingContextState {
|
||||
positioning_context,
|
||||
containing_block,
|
||||
|
|
@ -1678,10 +1702,10 @@ impl InlineFormattingContext {
|
|||
}),
|
||||
root_nesting_level: InlineContainerState::new(
|
||||
style.to_arc(),
|
||||
inline_container_state_flags,
|
||||
None, /* parent_container */
|
||||
self.text_decoration_line,
|
||||
default_font_metrics.as_ref(),
|
||||
inline_container_needs_strut(style, layout_context, None),
|
||||
),
|
||||
inline_box_state_stack: Vec::new(),
|
||||
current_line_segment: UnbreakableSegmentUnderConstruction::new(),
|
||||
|
|
@ -1753,14 +1777,18 @@ impl InlineFormattingContext {
|
|||
impl InlineContainerState {
|
||||
fn new(
|
||||
style: Arc<ComputedValues>,
|
||||
flags: InlineContainerStateFlags,
|
||||
parent_container: Option<&InlineContainerState>,
|
||||
parent_text_decoration_line: TextDecorationLine,
|
||||
font_metrics: Option<&FontMetrics>,
|
||||
create_strut: bool,
|
||||
) -> Self {
|
||||
let text_decoration_line = parent_text_decoration_line | style.clone_text_decoration_line();
|
||||
let font_metrics = font_metrics.cloned().unwrap_or_else(FontMetrics::empty);
|
||||
let line_height = line_height(&style, &font_metrics);
|
||||
let line_height = line_height(
|
||||
&style,
|
||||
&font_metrics,
|
||||
flags.contains(InlineContainerStateFlags::IS_SINGLE_LINE_TEXT_INPUT),
|
||||
);
|
||||
|
||||
let mut baseline_offset = Au::zero();
|
||||
let mut strut_block_sizes = Self::get_block_sizes_with_style(
|
||||
|
|
@ -1783,12 +1811,13 @@ impl InlineContainerState {
|
|||
let mut nested_block_sizes = parent_container
|
||||
.map(|container| container.nested_strut_block_sizes.clone())
|
||||
.unwrap_or_else(LineBlockSizes::zero);
|
||||
if create_strut {
|
||||
if flags.contains(InlineContainerStateFlags::CREATE_STRUT) {
|
||||
nested_block_sizes.max_assign(&strut_block_sizes);
|
||||
}
|
||||
|
||||
Self {
|
||||
style,
|
||||
flags,
|
||||
has_content: false,
|
||||
text_decoration_line,
|
||||
nested_strut_block_sizes: nested_block_sizes,
|
||||
|
|
@ -1877,7 +1906,12 @@ impl InlineContainerState {
|
|||
&self.style,
|
||||
font_metrics,
|
||||
font_metrics_of_first_font,
|
||||
line_height(&self.style, font_metrics),
|
||||
line_height(
|
||||
&self.style,
|
||||
font_metrics,
|
||||
self.flags
|
||||
.contains(InlineContainerStateFlags::IS_SINGLE_LINE_TEXT_INPUT),
|
||||
),
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -1945,14 +1979,19 @@ impl InlineBoxContainerState {
|
|||
) -> Self {
|
||||
let style = inline_box.style.clone();
|
||||
let pbm = style.padding_border_margin(containing_block);
|
||||
let create_strut = inline_container_needs_strut(&style, layout_context, Some(&pbm));
|
||||
|
||||
let mut flags = InlineContainerStateFlags::empty();
|
||||
if inline_container_needs_strut(&style, layout_context, Some(&pbm)) {
|
||||
flags.insert(InlineContainerStateFlags::CREATE_STRUT);
|
||||
}
|
||||
|
||||
Self {
|
||||
base: InlineContainerState::new(
|
||||
style,
|
||||
flags,
|
||||
Some(parent_container),
|
||||
parent_container.text_decoration_line,
|
||||
font_metrics,
|
||||
create_strut,
|
||||
),
|
||||
base_fragment_info: inline_box.base_fragment_info,
|
||||
pbm,
|
||||
|
|
@ -2222,14 +2261,26 @@ fn place_pending_floats(ifc: &mut InlineFormattingContextState, line_items: &mut
|
|||
}
|
||||
}
|
||||
|
||||
fn line_height(parent_style: &ComputedValues, font_metrics: &FontMetrics) -> Length {
|
||||
fn line_height(
|
||||
parent_style: &ComputedValues,
|
||||
font_metrics: &FontMetrics,
|
||||
is_single_line_text_input: bool,
|
||||
) -> Length {
|
||||
let font = parent_style.get_font();
|
||||
let font_size = font.font_size.computed_size();
|
||||
match font.line_height {
|
||||
let mut line_height = match font.line_height {
|
||||
LineHeight::Normal => Length::from(font_metrics.line_gap),
|
||||
LineHeight::Number(number) => font_size * number.0,
|
||||
LineHeight::Length(length) => length.0,
|
||||
};
|
||||
|
||||
// Single line text inputs line height is clamped to the size of `normal`. See
|
||||
// <https://github.com/whatwg/html/pull/5462>.
|
||||
if is_single_line_text_input {
|
||||
line_height.max_assign(font_metrics.line_gap.into());
|
||||
}
|
||||
|
||||
line_height
|
||||
}
|
||||
|
||||
fn effective_vertical_align(
|
||||
|
|
|
|||
|
|
@ -5,29 +5,19 @@ button {
|
|||
button,
|
||||
input {
|
||||
background: white;
|
||||
min-height: 1.0em;
|
||||
padding: 0em;
|
||||
padding-left: 0.25em;
|
||||
padding-right: 0.25em;
|
||||
border: solid lightgrey 1px;
|
||||
color: black;
|
||||
font-family: sans-serif;
|
||||
font-size: 0.8333em;
|
||||
text-align: left;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
textarea {
|
||||
background: white;
|
||||
min-height: 1.0em;
|
||||
padding: 0em;
|
||||
padding-left: 0.25em;
|
||||
padding-right: 0.25em;
|
||||
border: solid lightgrey 1px;
|
||||
color: black;
|
||||
font-family: sans-serif;
|
||||
font-size: 0.8333em;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
input::selection,
|
||||
|
|
@ -45,7 +35,6 @@ input[type="reset"] {
|
|||
border-left: solid 1px #CCCCCC;
|
||||
border-right: solid 1px #999999;
|
||||
border-bottom: solid 1px #999999;
|
||||
text-align: center;
|
||||
color: black;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -104,8 +104,13 @@ link:link[rel~=help], link:visited[rel~=help] { cursor: help; }
|
|||
/*
|
||||
* FIXME: use `outline: auto;`
|
||||
*/
|
||||
a:focus, area:focus,
|
||||
input:focus, textarea:focus, button:focus { outline: thin dotted; }
|
||||
a:focus, area:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
input:focus, textarea:focus, button:focus {
|
||||
outline: thin solid black;
|
||||
}
|
||||
|
||||
mark { background: yellow; color: black; }
|
||||
|
||||
|
|
@ -251,22 +256,47 @@ table:matches(
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
input, select, option, optgroup, button, textarea {
|
||||
input, select, button, textarea {
|
||||
letter-spacing: initial;
|
||||
word-spacing: initial;
|
||||
line-height: initial;
|
||||
text-transform: initial;
|
||||
text-indent: initial;
|
||||
text-transform: none;
|
||||
text-shadow: initial;
|
||||
appearance: auto;
|
||||
}
|
||||
|
||||
textarea { white-space: pre-wrap; }
|
||||
input:not([type=image i], [type=range i], [type=checkbox i], [type=radio i]) {
|
||||
overflow: clip !important;
|
||||
overflow-clip-margin: 0 !important;
|
||||
}
|
||||
|
||||
input[type="radio"], input[type="checkbox"], input[type="reset"], input[type="button"],
|
||||
input[type="submit"], select, button {
|
||||
box-sizing: border-box;
|
||||
input, select, textarea {
|
||||
text-align: initial;
|
||||
}
|
||||
|
||||
:autofill {
|
||||
field-sizing: fixed !important;
|
||||
}
|
||||
|
||||
input:is([type=reset i], [type=button i], [type=submit i]), button {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input, textarea, select, button { display: inline-block; }
|
||||
|
||||
hr {
|
||||
input[type=hidden i], input[type=file i], input[type=image i] {
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
input[type=radio i], input[type=checkbox i], input[type=reset i], input[type=button i], input[type=submit i],
|
||||
input[type=color i], input[type=search i], select, button {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
textarea { white-space: pre-wrap; }
|
||||
|
||||
hr {
|
||||
color: gray;
|
||||
border-style: inset;
|
||||
border-width: 1px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
[text-transform-bicameral-018.xht]
|
||||
expected: FAIL
|
||||
|
|
@ -7,12 +7,3 @@
|
|||
|
||||
[.target > * 5]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 7]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 9]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 11]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
[baseline-source-last-textarea-001.tentative.html]
|
||||
[.target > * 7]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 9]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 11]
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-001.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-002.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-003.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-004.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-005.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-006.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[transform-input-007.html]
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-008.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[transform-input-010.html]
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[transform-input-012.html]
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-013.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-014.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-015.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-016.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
[transform-input-018.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected:
|
||||
if os == "mac": FAIL
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
[transform-input-019.html]
|
||||
type: reftest
|
||||
bug: https://github.com/servo/servo/issues/21092
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[appearance-textfield-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[webkit-appearance-textfield-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[text-transform.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[textarea-padding-bend-overlaps-content-001.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[textarea-padding-bstart-moves-content-001.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[input-checkbox-switch-indeterminate.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[range-tick-marks-02.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[selectlist-button-type-appearance.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,34 +1,6 @@
|
|||
[flex-item-compressible-001.html]
|
||||
[.flexbox 14]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 15]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 12]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 13]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 10]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 11]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 4]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 5]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 3]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 8]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 9]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,15 +1,9 @@
|
|||
[baseline-source-first-textarea-001.tentative.html]
|
||||
[.target > * 9]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 1]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 5]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 7]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 9]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 11]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
[baseline-source-last-textarea-001.tentative.html]
|
||||
[.target > * 7]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 9]
|
||||
expected: FAIL
|
||||
|
||||
[.target > * 11]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[input-scrollable-region-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[scrollable-overflow-input-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[scrollable-overflow-input-002.html]
|
||||
expected: FAIL
|
||||
|
|
@ -19,3 +19,15 @@
|
|||
|
||||
[Replaced elements outside a table cannot be table-row-group and are considered inline -- input=file elements]
|
||||
expected: FAIL
|
||||
|
||||
[Replaced elements outside a table cannot be table-row and are considered inline -- input=text elements]
|
||||
expected: FAIL
|
||||
|
||||
[Replaced elements outside a table cannot be table-row and are considered inline -- input=button elements]
|
||||
expected: FAIL
|
||||
|
||||
[Replaced elements outside a table cannot be table-row-group and are considered inline -- input=text elements]
|
||||
expected: FAIL
|
||||
|
||||
[Replaced elements outside a table cannot be table-row-group and are considered inline -- input=button elements]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,2 +0,0 @@
|
|||
[transform-input-002.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[appearance-textfield-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[input-security-none-sensitive-text-input.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[webkit-appearance-textfield-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[spelling-markers-009.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[spelling-markers-010.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[text-transform.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[textarea-padding-bend-overlaps-content-001.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[textarea-padding-bstart-moves-content-001.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -316,3 +316,21 @@
|
|||
|
||||
[<input type="button" value="x" style="overflow: scroll; appearance: none;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="range" style="overflow: visible; appearance: auto;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="range" style="overflow: visible; appearance: none;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="color" value="#000000" style="overflow: visible; appearance: auto;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="color" value="#000000" style="overflow: visible; appearance: none;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="image" src="data:(png)" alt="x" style="overflow: visible; appearance: auto;">]
|
||||
expected: FAIL
|
||||
|
||||
[<input type="image" src="data:(png)" alt="x" style="overflow: visible; appearance: none;">]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -7,6 +7,3 @@
|
|||
|
||||
[align-items:stretch should work]
|
||||
expected: FAIL
|
||||
|
||||
[align-items:flex-start should work]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,2 +0,0 @@
|
|||
[input-type-button-newline-2.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[input-type-button-newline.html]
|
||||
expected: FAIL
|
||||
|
|
@ -8,9 +8,6 @@
|
|||
[number: Explicit height and auto width]
|
||||
expected: FAIL
|
||||
|
||||
[number: Text caret is taller than the placeholder]
|
||||
expected: FAIL
|
||||
|
||||
[number: Text caret is shorter than the placeholder]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
[input-checkbox-switch-rtl.tentative.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[selection.html]
|
||||
[test scrollLeft preservation for input]
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[input-type-button.html]
|
||||
[label value]
|
||||
expected: FAIL
|
||||
|
|
@ -3473,7 +3473,7 @@
|
|||
]
|
||||
],
|
||||
"input_line_height.html": [
|
||||
"1de07c88ae2092e2e9885d30e2001e9fe09ca8b3",
|
||||
"f1c1d742000a6c4c11d40806e07aeba502141368",
|
||||
[
|
||||
null,
|
||||
[
|
||||
|
|
@ -6547,7 +6547,7 @@
|
|||
]
|
||||
],
|
||||
"textarea_space_calculation.html": [
|
||||
"20945e971b543cbc11741863314ccf3595654e80",
|
||||
"ee5ea7b1c01f5a11188bc50eca3a60ea2c15edf2",
|
||||
[
|
||||
null,
|
||||
[
|
||||
|
|
@ -9115,7 +9115,7 @@
|
|||
[]
|
||||
],
|
||||
"input_line_height_ref.html": [
|
||||
"16d4fd99712bd1d21cc8320f2e273a867f3fb807",
|
||||
"f29e061cc35625fa039473e702f78dbc5a7d9c14",
|
||||
[]
|
||||
],
|
||||
"input_placeholder_ref.html": [
|
||||
|
|
@ -10073,7 +10073,7 @@
|
|||
[]
|
||||
],
|
||||
"textarea_space_calculation-ref.html": [
|
||||
"b777beb062b67a51c1efdfe4afa55568fd3724e6",
|
||||
"56abdf23c8f88a9f236d54ef798734becc372027",
|
||||
[]
|
||||
],
|
||||
"transform_3d_from_outside_viewport_ref.html": [
|
||||
|
|
|
|||
|
|
@ -1,2 +0,0 @@
|
|||
[button_css_width.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[submit_focus_a.html]
|
||||
expected: FAIL
|
||||
|
|
@ -7,6 +7,7 @@
|
|||
<body>
|
||||
<div style="line-height: 100px">
|
||||
<input type="text"></input>
|
||||
<input type="text"></input>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,10 @@
|
|||
</head>
|
||||
<body>
|
||||
<div style="line-height: 100px">
|
||||
<input type="text" style="line-height: 1.8"></input>
|
||||
<!-- https://html.spec.whatwg.org/multipage/#form-controls defines `line-height` for form
|
||||
controls to be `initial` ie `normal`. -->
|
||||
<input type="text" style="line-height: initial;"></input>
|
||||
<input type="text" style="line-height: normal;"></input>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,18 @@
|
|||
<!doctype html>
|
||||
<title>REFERENCE: textarea does not take up more space than it takes up</title>
|
||||
<style>
|
||||
textarea{height:2em;width:2em}
|
||||
div{width:2em;font-size:12px;line-height:3px}
|
||||
textarea {
|
||||
height:2em;
|
||||
width:2em;
|
||||
/* `em` units are based on font size, so this size
|
||||
has to be the same as the font size in the div. */
|
||||
font-size:12px;
|
||||
}
|
||||
div {
|
||||
width: 2em;
|
||||
font-size: 12px;
|
||||
line-height: 3px
|
||||
}
|
||||
</style>
|
||||
<h1>To pass, no red should be visible</h1>
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -3,8 +3,19 @@
|
|||
<title>textarea does not take up more space than it takes up</title>
|
||||
<link rel="match" href="textarea_space_calculation-ref.html">
|
||||
<style>
|
||||
textarea{height:2em;width:2em}
|
||||
div{background:red;width:2em;font-size:12px;line-height:3px}
|
||||
textarea {
|
||||
height:2em;
|
||||
width:2em;
|
||||
/* `em` units are based on font size, so this size
|
||||
has to be the same as the font size in the div. */
|
||||
font-size:12px;
|
||||
}
|
||||
div {
|
||||
background: red;
|
||||
width: 2em;
|
||||
font-size: 12px;
|
||||
line-height: 3px
|
||||
}
|
||||
</style>
|
||||
<h1>To pass, no red should be visible</h1>
|
||||
<div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue