jcs.org
Serenity Operating System
1/*
2 * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
3 *
4 * SPDX-License-Identifier: BSD-2-Clause
5 */
6
7#include <AK/StringBuilder.h>
8#include <LibJS/Interpreter.h>
9#include <LibWeb/ARIA/Roles.h>
10#include <LibWeb/Bindings/ExceptionOrUtils.h>
11#include <LibWeb/DOM/Document.h>
12#include <LibWeb/DOM/IDLEventListener.h>
13#include <LibWeb/DOM/ShadowRoot.h>
14#include <LibWeb/HTML/BrowsingContext.h>
15#include <LibWeb/HTML/BrowsingContextContainer.h>
16#include <LibWeb/HTML/DOMStringMap.h>
17#include <LibWeb/HTML/EventHandler.h>
18#include <LibWeb/HTML/Focus.h>
19#include <LibWeb/HTML/HTMLAnchorElement.h>
20#include <LibWeb/HTML/HTMLAreaElement.h>
21#include <LibWeb/HTML/HTMLBodyElement.h>
22#include <LibWeb/HTML/HTMLElement.h>
23#include <LibWeb/HTML/VisibilityState.h>
24#include <LibWeb/HTML/Window.h>
25#include <LibWeb/Layout/Box.h>
26#include <LibWeb/Layout/BreakNode.h>
27#include <LibWeb/Layout/TextNode.h>
28#include <LibWeb/Painting/PaintableBox.h>
29#include <LibWeb/UIEvents/EventNames.h>
30#include <LibWeb/UIEvents/FocusEvent.h>
31#include <LibWeb/UIEvents/MouseEvent.h>
32#include <LibWeb/WebIDL/DOMException.h>
33#include <LibWeb/WebIDL/ExceptionOr.h>
34
35namespace Web::HTML {
36
37HTMLElement::HTMLElement(DOM::Document& document, DOM::QualifiedName qualified_name)
38 : Element(document, move(qualified_name))
39{
40}
41
42HTMLElement::~HTMLElement() = default;
43
44JS::ThrowCompletionOr<void> HTMLElement::initialize(JS::Realm& realm)
45{
46 MUST_OR_THROW_OOM(Base::initialize(realm));
47 set_prototype(&Bindings::ensure_web_prototype<Bindings::HTMLElementPrototype>(realm, "HTMLElement"));
48
49 m_dataset = TRY(Bindings::throw_dom_exception_if_needed(realm.vm(), [&]() {
50 return DOMStringMap::create(*this);
51 }));
52
53 return {};
54}
55
56void HTMLElement::visit_edges(Cell::Visitor& visitor)
57{
58 Base::visit_edges(visitor);
59 visitor.visit(m_dataset.ptr());
60}
61
62// https://html.spec.whatwg.org/multipage/dom.html#dom-dir
63DeprecatedString HTMLElement::dir() const
64{
65 auto dir = attribute(HTML::AttributeNames::dir);
66#define __ENUMERATE_HTML_ELEMENT_DIR_ATTRIBUTE(keyword) \
67 if (dir.equals_ignoring_ascii_case(#keyword##sv)) \
68 return #keyword##sv;
69 ENUMERATE_HTML_ELEMENT_DIR_ATTRIBUTES
70#undef __ENUMERATE_HTML_ELEMENT_DIR_ATTRIBUTE
71
72 return {};
73}
74
75void HTMLElement::set_dir(DeprecatedString const& dir)
76{
77 MUST(set_attribute(HTML::AttributeNames::dir, dir));
78}
79
80HTMLElement::ContentEditableState HTMLElement::content_editable_state() const
81{
82 auto contenteditable = attribute(HTML::AttributeNames::contenteditable);
83 // "true", an empty string or a missing value map to the "true" state.
84 if ((!contenteditable.is_null() && contenteditable.is_empty()) || contenteditable.equals_ignoring_ascii_case("true"sv))
85 return ContentEditableState::True;
86 // "false" maps to the "false" state.
87 if (contenteditable.equals_ignoring_ascii_case("false"sv))
88 return ContentEditableState::False;
89 // Having no such attribute or an invalid value maps to the "inherit" state.
90 return ContentEditableState::Inherit;
91}
92
93bool HTMLElement::is_editable() const
94{
95 switch (content_editable_state()) {
96 case ContentEditableState::True:
97 return true;
98 case ContentEditableState::False:
99 return false;
100 case ContentEditableState::Inherit:
101 return parent() && parent()->is_editable();
102 default:
103 VERIFY_NOT_REACHED();
104 }
105}
106
107DeprecatedString HTMLElement::content_editable() const
108{
109 switch (content_editable_state()) {
110 case ContentEditableState::True:
111 return "true";
112 case ContentEditableState::False:
113 return "false";
114 case ContentEditableState::Inherit:
115 return "inherit";
116 default:
117 VERIFY_NOT_REACHED();
118 }
119}
120
121// https://html.spec.whatwg.org/multipage/interaction.html#contenteditable
122WebIDL::ExceptionOr<void> HTMLElement::set_content_editable(DeprecatedString const& content_editable)
123{
124 if (content_editable.equals_ignoring_ascii_case("inherit"sv)) {
125 remove_attribute(HTML::AttributeNames::contenteditable);
126 return {};
127 }
128 if (content_editable.equals_ignoring_ascii_case("true"sv)) {
129 MUST(set_attribute(HTML::AttributeNames::contenteditable, "true"));
130 return {};
131 }
132 if (content_editable.equals_ignoring_ascii_case("false"sv)) {
133 MUST(set_attribute(HTML::AttributeNames::contenteditable, "false"));
134 return {};
135 }
136 return WebIDL::SyntaxError::create(realm(), "Invalid contentEditable value, must be 'true', 'false', or 'inherit'");
137}
138
139void HTMLElement::set_inner_text(StringView text)
140{
141 remove_all_children();
142 MUST(append_child(document().create_text_node(text)));
143
144 set_needs_style_update(true);
145}
146
147DeprecatedString HTMLElement::inner_text()
148{
149 StringBuilder builder;
150
151 // innerText for element being rendered takes visibility into account, so force a layout and then walk the layout tree.
152 document().update_layout();
153 if (!layout_node())
154 return text_content();
155
156 Function<void(Layout::Node const&)> recurse = [&](auto& node) {
157 for (auto* child = node.first_child(); child; child = child->next_sibling()) {
158 if (is<Layout::TextNode>(child))
159 builder.append(verify_cast<Layout::TextNode>(*child).text_for_rendering());
160 if (is<Layout::BreakNode>(child))
161 builder.append('\n');
162 recurse(*child);
163 }
164 };
165 recurse(*layout_node());
166
167 return builder.to_deprecated_string();
168}
169
170// // https://drafts.csswg.org/cssom-view/#dom-htmlelement-offsettop
171int HTMLElement::offset_top() const
172{
173 // NOTE: Ensure that layout is up-to-date before looking at metrics.
174 const_cast<DOM::Document&>(document()).update_layout();
175
176 if (is<HTML::HTMLBodyElement>(this) || !layout_node() || !parent_element() || !parent_element()->layout_node())
177 return 0;
178 auto position = layout_node()->box_type_agnostic_position();
179 auto parent_position = parent_element()->layout_node()->box_type_agnostic_position();
180 return position.y().value() - parent_position.y().value();
181}
182
183// https://drafts.csswg.org/cssom-view/#dom-htmlelement-offsetleft
184int HTMLElement::offset_left() const
185{
186 // NOTE: Ensure that layout is up-to-date before looking at metrics.
187 const_cast<DOM::Document&>(document()).update_layout();
188
189 if (is<HTML::HTMLBodyElement>(this) || !layout_node() || !parent_element() || !parent_element()->layout_node())
190 return 0;
191 auto position = layout_node()->box_type_agnostic_position();
192 auto parent_position = parent_element()->layout_node()->box_type_agnostic_position();
193 return position.x().value() - parent_position.x().value();
194}
195
196// https://drafts.csswg.org/cssom-view/#dom-htmlelement-offsetwidth
197int HTMLElement::offset_width() const
198{
199 // NOTE: Ensure that layout is up-to-date before looking at metrics.
200 const_cast<DOM::Document&>(document()).update_layout();
201
202 // 1. If the element does not have any associated CSS layout box return zero and terminate this algorithm.
203 if (!paint_box())
204 return 0;
205
206 // 2. Return the width of the axis-aligned bounding box of the border boxes of all fragments generated by the element’s principal box,
207 // ignoring any transforms that apply to the element and its ancestors.
208 // FIXME: Account for inline boxes.
209 return paint_box()->border_box_width().value();
210}
211
212// https://drafts.csswg.org/cssom-view/#dom-htmlelement-offsetheight
213int HTMLElement::offset_height() const
214{
215 // NOTE: Ensure that layout is up-to-date before looking at metrics.
216 const_cast<DOM::Document&>(document()).update_layout();
217
218 // 1. If the element does not have any associated CSS layout box return zero and terminate this algorithm.
219 if (!paint_box())
220 return 0;
221
222 // 2. Return the height of the axis-aligned bounding box of the border boxes of all fragments generated by the element’s principal box,
223 // ignoring any transforms that apply to the element and its ancestors.
224 // FIXME: Account for inline boxes.
225 return paint_box()->border_box_height().value();
226}
227
228// https://html.spec.whatwg.org/multipage/links.html#cannot-navigate
229bool HTMLElement::cannot_navigate() const
230{
231 // An element element cannot navigate if one of the following is true:
232
233 // - element's node document is not fully active
234 if (!document().is_fully_active())
235 return true;
236
237 // - element is not an a element and is not connected.
238 return !is<HTML::HTMLAnchorElement>(this) && !is_connected();
239}
240
241void HTMLElement::parse_attribute(DeprecatedFlyString const& name, DeprecatedString const& value)
242{
243 Element::parse_attribute(name, value);
244
245 // 1. If namespace is not null, or localName is not the name of an event handler content attribute on element, then return.
246 // FIXME: Add the namespace part once we support attribute namespaces.
247#undef __ENUMERATE
248#define __ENUMERATE(attribute_name, event_name) \
249 if (name == HTML::AttributeNames::attribute_name) { \
250 element_event_handler_attribute_changed(event_name, value); \
251 }
252 ENUMERATE_GLOBAL_EVENT_HANDLERS(__ENUMERATE)
253#undef __ENUMERATE
254}
255
256// https://html.spec.whatwg.org/multipage/interaction.html#dom-focus
257void HTMLElement::focus()
258{
259 // 1. If the element is marked as locked for focus, then return.
260 if (m_locked_for_focus)
261 return;
262
263 // 2. Mark the element as locked for focus.
264 m_locked_for_focus = true;
265
266 // 3. Run the focusing steps for the element.
267 run_focusing_steps(this);
268
269 // FIXME: 4. If the value of the preventScroll dictionary member of options is false,
270 // then scroll the element into view with scroll behavior "auto",
271 // block flow direction position set to an implementation-defined value,
272 // and inline base direction position set to an implementation-defined value.
273
274 // 5. Unmark the element as locked for focus.
275 m_locked_for_focus = false;
276}
277
278// https://html.spec.whatwg.org/multipage/webappapis.html#fire-a-synthetic-pointer-event
279bool HTMLElement::fire_a_synthetic_pointer_event(DeprecatedFlyString const& type, DOM::Element& target, bool not_trusted)
280{
281 // 1. Let event be the result of creating an event using PointerEvent.
282 // 2. Initialize event's type attribute to e.
283 // FIXME: Actually create a PointerEvent!
284 auto event = UIEvents::MouseEvent::create(realm(), type).release_value_but_fixme_should_propagate_errors();
285
286 // 3. Initialize event's bubbles and cancelable attributes to true.
287 event->set_bubbles(true);
288 event->set_cancelable(true);
289
290 // 4. Set event's composed flag.
291 event->set_composed(true);
292
293 // 5. If the not trusted flag is set, initialize event's isTrusted attribute to false.
294 if (not_trusted) {
295 event->set_is_trusted(false);
296 }
297
298 // FIXME: 6. Initialize event's ctrlKey, shiftKey, altKey, and metaKey attributes according to the current state
299 // of the key input device, if any (false for any keys that are not available).
300
301 // FIXME: 7. Initialize event's view attribute to target's node document's Window object, if any, and null otherwise.
302
303 // FIXME: 8. event's getModifierState() method is to return values appropriately describing the current state of the key input device.
304
305 // 9. Return the result of dispatching event at target.
306 return target.dispatch_event(event);
307}
308
309// https://html.spec.whatwg.org/multipage/interaction.html#dom-click
310void HTMLElement::click()
311{
312 // FIXME: 1. If this element is a form control that is disabled, then return.
313
314 // 2. If this element's click in progress flag is set, then return.
315 if (m_click_in_progress)
316 return;
317
318 // 3. Set this element's click in progress flag.
319 m_click_in_progress = true;
320
321 // FIXME: 4. Fire a synthetic pointer event named click at this element, with the not trusted flag set.
322 fire_a_synthetic_pointer_event(HTML::EventNames::click, *this, true);
323
324 // 5. Unset this element's click in progress flag.
325 m_click_in_progress = false;
326}
327
328// https://html.spec.whatwg.org/multipage/interaction.html#dom-blur
329void HTMLElement::blur()
330{
331 // The blur() method, when invoked, should run the unfocusing steps for the element on which the method was called.
332 run_unfocusing_steps(this);
333
334 // User agents may selectively or uniformly ignore calls to this method for usability reasons.
335}
336
337Optional<ARIA::Role> HTMLElement::default_role() const
338{
339 // https://www.w3.org/TR/html-aria/#el-article
340 if (local_name() == TagNames::article)
341 return ARIA::Role::article;
342 // https://www.w3.org/TR/html-aria/#el-aside
343 if (local_name() == TagNames::aside)
344 return ARIA::Role::complementary;
345 // https://www.w3.org/TR/html-aria/#el-b
346 if (local_name() == TagNames::b)
347 return ARIA::Role::generic;
348 // https://www.w3.org/TR/html-aria/#el-bdi
349 if (local_name() == TagNames::bdi)
350 return ARIA::Role::generic;
351 // https://www.w3.org/TR/html-aria/#el-bdo
352 if (local_name() == TagNames::bdo)
353 return ARIA::Role::generic;
354 // https://www.w3.org/TR/html-aria/#el-code
355 if (local_name() == TagNames::code)
356 return ARIA::Role::code;
357 // https://www.w3.org/TR/html-aria/#el-dfn
358 if (local_name() == TagNames::dfn)
359 return ARIA::Role::term;
360 // https://www.w3.org/TR/html-aria/#el-em
361 if (local_name() == TagNames::em)
362 return ARIA::Role::emphasis;
363 // https://www.w3.org/TR/html-aria/#el-figure
364 if (local_name() == TagNames::figure)
365 return ARIA::Role::figure;
366 // https://www.w3.org/TR/html-aria/#el-footer
367 if (local_name() == TagNames::footer) {
368 // TODO: If not a descendant of an article, aside, main, nav or section element, or an element with role=article, complementary, main, navigation or region then role=contentinfo
369 // Otherwise, role=generic
370 return ARIA::Role::generic;
371 }
372 // https://www.w3.org/TR/html-aria/#el-header
373 if (local_name() == TagNames::header) {
374 // TODO: If not a descendant of an article, aside, main, nav or section element, or an element with role=article, complementary, main, navigation or region then role=banner
375 // Otherwise, role=generic
376 return ARIA::Role::generic;
377 }
378 // https://www.w3.org/TR/html-aria/#el-hgroup
379 if (local_name() == TagNames::hgroup)
380 return ARIA::Role::generic;
381 // https://www.w3.org/TR/html-aria/#el-i
382 if (local_name() == TagNames::i)
383 return ARIA::Role::generic;
384 // https://www.w3.org/TR/html-aria/#el-main
385 if (local_name() == TagNames::main)
386 return ARIA::Role::main;
387 // https://www.w3.org/TR/html-aria/#el-nav
388 if (local_name() == TagNames::nav)
389 return ARIA::Role::navigation;
390 // https://www.w3.org/TR/html-aria/#el-samp
391 if (local_name() == TagNames::samp)
392 return ARIA::Role::generic;
393 // https://www.w3.org/TR/html-aria/#el-section
394 if (local_name() == TagNames::section) {
395 // TODO: role=region if the section element has an accessible name
396 // Otherwise, no corresponding role
397 return ARIA::Role::region;
398 }
399 // https://www.w3.org/TR/html-aria/#el-small
400 if (local_name() == TagNames::small)
401 return ARIA::Role::generic;
402 // https://www.w3.org/TR/html-aria/#el-strong
403 if (local_name() == TagNames::strong)
404 return ARIA::Role::strong;
405 // https://www.w3.org/TR/html-aria/#el-sub
406 if (local_name() == TagNames::sub)
407 return ARIA::Role::subscript;
408 // https://www.w3.org/TR/html-aria/#el-summary
409 if (local_name() == TagNames::summary)
410 return ARIA::Role::button;
411 // https://www.w3.org/TR/html-aria/#el-sup
412 if (local_name() == TagNames::sup)
413 return ARIA::Role::superscript;
414 // https://www.w3.org/TR/html-aria/#el-u
415 if (local_name() == TagNames::u)
416 return ARIA::Role::generic;
417
418 return {};
419}
420
421}