RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-14 09:34:59 +00:00
Code Issues Activity Actions

LibWeb: Add support for the input size attribute

Browse source
This commit is contained in:
Bastiaan van der Plaat 2023-11-24 17:37:53 +01:00 • committed by Andreas Kling
parent d9fb116bcc
commit fb7b03d162
5 changed files with 30 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

12
Tests/LibWeb/Layout/expected/input-text-node-invalidation-on-value-change.txt
View file

@ -1,10 +1,10 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x21.46875 children: inline
line 0 width: 120, height: 21.46875, bottom: 21.46875, baseline: 13.53125
frag 0 from BlockContainer start: 0, length: 0, rect: [9,9 118x19.46875]
BlockContainer <input#foo> at (9,9) content-size 118x19.46875 inline-block [BFC] children: not-inline
Box <div> at (11,10) content-size 114x17.46875 flex-container(row) [FFC] children: not-inline
line 0 width: 191.875, height: 21.46875, bottom: 21.46875, baseline: 13.53125
frag 0 from BlockContainer start: 0, length: 0, rect: [9,9 189.875x19.46875]
BlockContainer <input#foo> at (9,9) content-size 189.875x19.46875 inline-block [BFC] children: not-inline
Box <div> at (11,10) content-size 185.875x17.46875 flex-container(row) [FFC] children: not-inline
BlockContainer <div> at (11,10) content-size 49.734375x17.46875 flex-item [BFC] children: inline
line 0 width: 49.734375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 4, rect: [11,10 49.734375x17.46875]
@ -16,7 +16,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x21.46875]
PaintableWithLines (BlockContainer<INPUT>#foo) [8,8 120x21.46875]
PaintableBox (Box<DIV>) [9,9 118x19.46875]
PaintableWithLines (BlockContainer<INPUT>#foo) [8,8 191.875x21.46875]
PaintableBox (Box<DIV>) [9,9 189.875x19.46875]
PaintableWithLines (BlockContainer<DIV>) [11,10 49.734375x17.46875]
TextPaintable (TextNode<#text>)

3
Userland/Libraries/LibWeb/CSS/Default.css
View file

@ -28,9 +28,8 @@ label {
/* FIXME: This is a temporary hack until we can render a native-looking frame for these. */
input:not([type=submit], input[type=button], input[type=reset], input[type=color], input[type=checkbox], input[type=radio]), textarea {
border: 1px solid ButtonBorder;
min-width: 80px;
min-height: 16px;
width: 120px;
width: attr(size ch, 20ch);
cursor: text;
overflow: hidden;
}

19
Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp
View file

@ -18,6 +18,7 @@
#include <LibWeb/HTML/HTMLDivElement.h>
#include <LibWeb/HTML/HTMLFormElement.h>
#include <LibWeb/HTML/HTMLInputElement.h>
#include <LibWeb/HTML/Numbers.h>
#include <LibWeb/HTML/Scripting/Environments.h>
#include <LibWeb/HTML/Window.h>
#include <LibWeb/Infra/CharacterTypes.h>
@ -1158,6 +1159,24 @@ i32 HTMLInputElement::default_tab_index_value() const
return 0;
}
// https://html.spec.whatwg.org/multipage/input.html#the-size-attribute
unsigned HTMLInputElement::size() const
{
// The size IDL attribute is limited to only positive numbers and has a default value of 20.
auto maybe_size_string = get_attribute(HTML::AttributeNames::size);
if (maybe_size_string.has_value()) {
auto maybe_size = parse_non_negative_integer(maybe_size_string.value());
if (maybe_size.has_value())
return maybe_size.value();
}
return 20;
}
WebIDL::ExceptionOr<void> HTMLInputElement::set_size(unsigned value)
{
return set_attribute(HTML::AttributeNames::size, MUST(String::number(value)));
}
// https://html.spec.whatwg.org/multipage/input.html#dom-input-valueasnumber
WebIDL::ExceptionOr<double> HTMLInputElement::value_as_number() const
{

3
Userland/Libraries/LibWeb/HTML/HTMLInputElement.h
View file

@ -97,6 +97,9 @@ public:
// https://html.spec.whatwg.org/multipage/input.html#update-the-file-selection
void update_the_file_selection(JS::NonnullGCPtr<FileAPI::FileList>);
unsigned size() const;
WebIDL::ExceptionOr<void> set_size(unsigned value);
WebIDL::ExceptionOr<double> value_as_number() const;
WebIDL::ExceptionOr<void> set_value_as_number(double value);

2
Userland/Libraries/LibWeb/HTML/HTMLInputElement.idl
View file

@ -34,7 +34,7 @@ interface HTMLInputElement : HTMLElement {
[CEReactions, Reflect] attribute DOMString placeholder;
[CEReactions, Reflect=readonly] attribute boolean readOnly;
[CEReactions, Reflect] attribute boolean required;
// FIXME: [CEReactions] attribute unsigned long size;
[CEReactions] attribute unsigned long size;
[CEReactions, Reflect] attribute DOMString src;
[CEReactions, Reflect] attribute DOMString step;
[CEReactions] attribute DOMString type;