I didn't want to add another set of boilerplatey tree-walking methods,
so here's a general-purpose one. :^)
`for_each_effective_rule()` walks the tree of effective style rules, and
runs the callback on each one, in either pre- or postorder. The
previous `for_each_effective_style/keyframes_rule()` methods of
`CSSStyleSheet` are then reimplemented in terms of
`for_each_effective_rule()`, and we can get rid of their equivalents
elsewhere.
Depending on usage, `@layer` has two forms, with two different CSSOM
types. One simply lists layer names and the other defines a layer with
its contained rules.
On Linux/Windows, the ctrl key is used in conjunction with arrow keys to
jump word-by-word in text documents. On macOS, the option key is used
(which is mapped to the alt key code).
The main motivator here was noticing that --disable-sql-database did not
work with AppKit. Rather than re-implementing this there, move ownership
of these classes to WebView::Application, so that each UI does not need
to individually worry about it.
A hard-coded value of 50px is too large for text boxes with a size that
is less than 50px. Reduce this to 24px, and further limit it by the size
of the overflown box.
This change should move us forward toward emoji support, as we are no
longer limited by our own OpenType implementation, which was failing
to parse the TrueType Collection format used to store emoji fonts
(at least on macOS).
This is a preparation for upcoming changes where Gfx::Typeface will
depend on `FontDatabase::should_force_fontconfig()`, so we will no
longer be able to construct typefaces from FontDatabase constructor
because of circular dependency.
Currently we rely on parser returning an error if encoded data cannot be
parsed into a valid WOFF or WOFF2 font, which is not going to be true
after switching to Skia that sometimes does not fail even if a data does
not represent a valid font.
When an editable node is focused and one of the arrow/home/end keys are
pressed while shift is held, we will now create or update the document's
selection. There is a bit of nuance to the behavior here, which matches
how the cursor behaves in other engines.
We will of course want to abstract this in the future to extend any non-
editable node text selections. This also does not implement holding ctrl
to jump by word, rather than grapheme.
When performing a hit test of type TextCursor, it would check if the
position is around each fragment and not just inside it. This resulted
in always selecting the first fragment checked.
This commit computes the distance of each hit test result, and picks the
closest one.
When deciding if the grid containers min size should be limited by a
max size. Check for a max height or width depending on the dimension,
instead of just always checking for a max width.
If a key is pressed when the media player is in focus, which causes the
media player to perform some action, that key event is no longer
propagated further.
When we want to inject a CSS counter for a line, we need to be sure to
handle if we had previously opened a styled span for the current source
substring. For example, if we see a new line in the middle of a comment,
we will have previously opened the following tag:
<span class="comment">
So when injecting a new line and the <span class="line"> element (for
CSS counters), we need to close the previous span and insert a newly
opened tag to continue using the style.
If the Downloads directory exists, we will use it (note that this will
respect the XDG_DOWNLOAD_DIR environment variable).
Otherwise, we will ask the UI layer to retrieve a download directory
from the user. This directory is not saved, so it will be re-prompted
every time. Once a proper settings UI is complete, we will of course
integrate with that for persistent settings.
In some cases, we have a timestamp as a double in milliseconds. We then
would convert it to nanoseconds as a BigInt, just to bring it back to a
double for TZDB lookups. Add an overload to avoid this needless round
trip.
Even though the underlying time zone is already cached by LibUnicode, JS
performs additional expensive lookups with that time zone. There's no
need to do those lookups again until the system time zone has changed.
Note that we can currently only use simdutf for Base64 decoding if the
provided stopBeforePartial option is loose, which is the default. There
is an open issue for simdutf to implement strict and stop-before-partial
options. Until then, for those options, we implement a slow decoder that
is written exactly as the spec steps dictate.
See: https://github.com/simdutf/simdutf/issues/440
Choosing options from the `<select>` will load and display that style
sheet's source text, with some checks to make sure that the text that
just loaded is the one we currently want.
The UI is a little goofy when scrolling, as it uses `position: sticky`
which we don't implement yet. But that's just more motivation to
implement it! :^)
This will be used by the inspector, for showing style sheet contents.
Identifying a specific style sheet is a bit tricky. Depending on where
it came from, a style sheet may have a URL, it might be associated with
a DOM element, both, or neither. This varied information is wrapped in
a new StyleSheetIdentifier struct.
This is to enable the inspector to show this source.
There's a fairly hefty FIXME here because duplicating the source text is
a significant waste of memory. But I don't want to get too sidetracked.
This is only used for CSS style sheets. One case wants it as a String,
and the others don't care, but will in future also want to have the
source as a String.
When trying to use pkgconfig for finding libjxl, the build fails
trying to link the cross-compiler's libc++.
Using this way libjxl also requires hwy library.
Findlibjxl.cmake was taken from SDL_image and altered to include its license.
Calls to `Document::set_needs_display()` and
`Paintable::set_needs_display()` now invalidate the display list by
default. This behavior can be changed by passing
`InvalidateDisplayList::No` to the function where invalidating the
display list is not necessary.
By checking the lengths and then looking directly at the bytes, the
generated code becomes a lot nicer.
This gives a 1.23x speedup when parsing the JS from x.com
Use offset from ScrollFrame which is an actual value a box is shifted by
while painting.
Also change `update_paint_and_hit_testing_properties_if_needed()` to
refresh scroll frames state, because `getBoundingClientRect()` now
depends on them.
Fixes wrong file tree sidebar location and excessive layout
invalidations caused by some miscalculation on JS-side when wrong
bounding client rect is provided on Github PR pages like
https://github.com/LadybirdBrowser/ladybird/pull/1232/files
Scroll offset of body does not affect position of fixed elements, so
nearest scrollable lookup should early return from ancestor scrollable
lookup loop once "position: fixed" box is encountered.
Fixes regression introduced in 866608532a
Otherwise, it looks a bit awkward where the cursor position does not
update while the selection is elsewhere.
Note that this requires passing along the raw selection positions from
`set the selection range` to the elements. Otherwise, consider what will
happen if we set the selection start and end to the same value. By going
through the API accessor, we hit the case where the start and end are
the same value, and return the document cursor position. This would mean
the cursor position would not be updated.
The test changes here more closely match what Firefox produces now. It
is not a 100% match; the `select event fired` test case isn't right. The
problem is the event fires for the input element, but we most recently
focused the textarea element. Thus, when we retrieve the selection from
the input element, we return the document's cursor position, which is
actually in the textarea element. The fix will ultimately be to fully
implement the following:
https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#concept-textarea/input-cursor
That is, each input / textarea element should separately track its own
text cursor position.
Append text chunks to either the start or end of the text fragment,
depending on the text direction. The direction is determined by what
script its code points are from.
Implements:
"If the product of the hypothetical fr size and a flexible track’s flex
factor is less than the track’s base size, restart this algorithm
treating all such tracks as inflexible."
Fixes https://github.com/LadybirdBrowser/ladybird/issues/1211
Sticky positioning is implemented by modifying the algorithm for
assigning and refreshing scroll frames. Now, elements with
"position: sticky" are assigned their own scroll frame, and their
position is refreshed independently from regular scroll boxes.
Refreshing the scroll offsets for sticky boxes does not require display
list invalidation.
A separate hash map is used for the scroll frames of sticky boxes. This
is necessary because a single paintable box can have two scroll frames
if it 1) has "position: sticky" and 2) contains scrollable overflow.
This allows the calculation of the cumulative scroll offset for a scroll
frame by adding its scroll offset to the parent’s scroll offset, rather
than traversing the containing block chain. While it doesn't greatly
simplify calculations for typical scroll frames, it serves as a
preparation for supporting "position: sticky".
This change is intended to insure that the thumb control on the dialog
will never be narrower than 50 pixels no matter how long the line it's
displaying.
This commit just adds a command line option to case-insensitively accept
a User-Agent name to use as the UA override. The UIs will individually
need to make use of this option.
Before this change, we were hard-coding 4 KiB. This meant that systems
with a 16 KiB native page size were wasting 12 KiB per HeapBlock on
nothing, leading to worse locality and more mmap/madvise churn.
We now query the system page size on startup and use that as the
HeapBlock size.
The only downside here is that some of the pointer math for finding the
base of a HeapBlock now has to use a runtime computed value instead of a
compile time constant. But that's a small price to pay for what we get.
According to https://www.w3.org/TR/css-grid-2/#placement-shorthands
when setting the 'grid-row' and 'grid-column' shorthand property to a
single <custom-ident> value, both 'grid-row-start'/'grid-column-start'
and 'grid-row-end'/'grid-column-end' should be set to that
<custom_ident>.
And add tests! This implementation closely follows the current C++
implementation, replacing macros and gotos with a slightly more
complex state machine. It's very possible that an async version that
yields tokens on "emit" would be even simpler, but let's get this
one working first :).
Also give the Swift.String init routines an explict label when
constructing from AK String types, as this caused issues in a later
commit to have them both with `_ data`.
In particular, there was an assertion failure due to the temporary
parser document's "about base URL" being empty when trying to "parse a
URL" during parsing.
We fix this by copying the context element's document's about base URL
to the temporary parsing document while parsing a fragment.
This fixes a crash when loading search results on https://amazon.com/
Adjust the translation from Gfx::ScalingMode to Skia SkFilterMode, so
that CSS::ImageRendering::Pixelated will result in
SkFilterMode::kNearest.
Before:
ScalingMode::SmoothPixels -> kLinear
After:
ScalingMode::SmoothPixels -> kNearest
Fixes#1170
At the same time, simplify CMakeLists magic for libraries that want to
include Swift code in the library. The Lib-less name of the library is
now always the module name for the library with any Swift additions,
extensions, etc. All vfs overlays now live in a common location to make
finding them easier from CMake functions. A new pattern is needed for
the Lib-less modules to re-export their Cxx counterparts.
This causes UI interactions with the document selection to also update
the input and textarea DOM selection state. Note that we switch around
the order of focusing a DOM node and setting the selection, so we allow
the focus event to override whatever selection we came up with.
For both types of elements, `.selectionStart`, `.selectionEnd`,
`.selectionDirection`, `.setSelectionRange()`, `.select()` and the
`select` event are now implemented.
Before this change, :hover wouldn't match anything outside the shadow
boundary when hovering elements inside a shadow tree. This was most
noticeable when hovering the text inside an input element and hover
styles disappearing from the hosting input element itself.
This creates a TimeZoneWatcher in the UI process to inform all open
WebContent processes when the time zone changes. The WebContent process
will clear its time zone cache to retrieve a fresh zone the next time
it is asked for one.
This creates platform-dependent monitors to detect when the system time
zone changes. On Linux, we use a file watcher to monitor files such as
/etc/localtime for changes. On macOS, this uses CFNotificationCenter to
be notified by the OS when the time zone changes.
Note: the macOS implementation requires running in a process which is
running the CoreFoundation event loop. Both the AppKit and Qt chromes
are doing so in the UI process, but this means we cannot run this
monitor in the WebContent process.
It's expensive to determine the system time zone from disk each time it
is requested. This makes LibUnicode cache the result, and provides an
API to clear that cache. This will let us set up a monitor to watch for
system time zone changes in platform-dependent ways.
When asked to monitor a file (not a directory), we often need to instead
monitor the parent directory to receive FS events. For example, when a
symbolic link is deleted/created, we don't receive any events unless we
are watching the parent.
The monitored files can be internally removed by inotify. If we then try
to explicitly remove them, the inotify_rm_watch call will fail. We do
this when the file is deleted and we receive an IN_DELETE event. This
ensures we clean up the monitored files.
According to the inotify man page, this event is always generated after
a IN_DELETE, which we separately handle. Just ignore IN_IGNORED events
to avoid spamming stderr.
We *could* even skip creating a paintable for hidden nodes, but that
means that dynamic updates to the CSS visibility property would require
mutating the paint tree, so let's keep it simple for now.
Previously, only DOM nodes with `is_editable()` allowed selection via
the mouse. This had the unwanted consequence, that read-only
input/textarea elements did not allow selection.
Now, `EventHandler::handle_mousedown()` asks the node's non-shadow
parent element over the new virtual method `is_child_node_selectable()`,
if selection of the node is allowed.
This method is overridden for `HTMLButtonElement` and
`HTMLInputElement`, to disallow selection of buttons and placeholders.
Fixes#579
We were incorrectly looking at the CSS computed values for width and
height to determine the natural size of <svg> root elements.
This meant that elements where the attribute and computed value were
different values would end up with incorrect natural size.
The spec requires that "multipart/form-data" Content-Type headers also
include a boundary directive. This allows the content server to validate
the submitted form data.
Google Lens, for example, rejects forms missing this directive.
When scripts receive a DataTransferItem from any IDL method, the spec
requires we return the same DataTransferItem for a particular item in
the drag data store. Meaning, we cannot just create these on the fly as
needed.
To do this, we store a list of DataTransferItem on the DataTransfer
object. We will return one of these objects any time one is requested by
a script.
It feels a bit weird to have the DataTransfer object store: the drag
data store, a DataTransferItemList, and a list of DataTransferItem. But
this is how other engines implement this as well. It basically has to be
this way as DataTransferItemList is just a proxy to the DataTransfer -
meaning, DataTransfer is the source of truth for all IDL access.
A DataTransferItem is associated with a DataTransfer, and points to an
item in the drag data store. We don't yet support removing items from
the store, but when we do, we will clear the index stored here to set
the DataTransferItem's mode to "disabled".
The IDL constructor has to take separate steps than a DataTransfer that
is internally constructed. Notably, an IDL-created object has its own
drag data store, and that store is placed in a read-write mode.
Ownership of the drag data store is a bit weird. In a normal drag-and-
drop operation, the DragAndDropEventHandler owns the store. When events
are fired for the operation, the DataTransfer object assigned to those
events are "associated" with the store. We currently represent that with
an Optional<DragDataStore&>.
However, it's also possible to create DataTransfer objects from scripts.
Those objects create their own drag data store. This puts DataTransfer
in a weird situation where it may own a store or just reference one.
Rather than coming up with something like Variant<DDS, DDS&> or using
MaybeOwned<DDS> here, we can get by with just making the store reference
counted.
We don't actually generate any such events ourselves. But Google Lens
will create one with the DataTransfer attribute set to that of any drop
event we send it.
Previously, a crash would occur in the if `CSSPixelFraction` was given a
denominator value less than the resolution of `CSSPixels` (1/64).
We now divide both parts of the ratio by the denominator in this case.
- Expose table from console object
- Add new Table log level
- Create a JS object that represents table rows and columns
- Print table as HTML using WebContentConsoleClient
Prior to funcref, a partial chunk of an invalid module was never needed,
but funcref allows a partially instantiated module to modify imported
tables with references to its own functions, which means we need to keep
the second module alive while that function reference is present within
the imported table.
This was tested by the spectests, but very rarely caught as our GC does
not behave particularly predictably, making it so the offending module
remains in memory just long enough to let the tests pass.
This commit makes it so all function references keep their respective
modules alive.
If the document is disconnected from the navigable by the time a favicon
decode completes successfully, we don't want to show the favicon for
whatever document is now loaded in the navigable.
Fix this by deferring getting the navigable until after the decode has
completed.
When determining the intrinsic cross size contribution of a flex item
with a preferred aspect ratio, we have to account for any min/max
constraints in the main axis.
Capture the incoming reason argument to
transform_stream_default_source_cancel_algorithm() on the
on_fulfilled_callback() of WebIDL::react_to_promise() on step 7.
Instead of CSSColorValue holding a Gfx::Color, make it an abstract class
with subclasses for each different color function, to match the Typed-OM
spec. This means moving the color calculations from the parsing code to
the `to_color()` method on the style value.
This lets us have calc() inside a color function, instead of having to
fully resolve the color at parse time. The canvas fillStyle tests have
been updated to reflect this.
The other test change is Screenshot/css-color-functions.html: previously
we produced slightly different colors for an alpha of 0.5 and one of
50%, and this incorrect behavior was baked into the test. So now it's
more correct. :^)
"Parse a style value for <foo>", where we don't care if it's a literal
<foo> or a calculated one, is a really common thing that we previously
didn't have methods for.
A couple of methods we had have been extended to parse calc(), and the
others have been filled in.
The method for parsing the `flex` property's value is renamed
`parse_flex_shorthand_value()` as it conflicted.
For simplicity in user code, the `parse_foo_value()` methods should
parse anything that is a `<foo>`. In these cases, that means a
number/integer or calculation that resolves to them.
These uses in parse_css_value_for_properties() specifically only want a
literal IntegerStyleValue/NumberStyleValue, as calc-parsing is done
elsewhere. So, do the parsing for them locally.
Parsing a `Gfx::Color` no longer makes sense, as CSS has many ways of
defining a color, often in a dynamic way where the color value isn't
known until later. This is a small preparatory change before a much
larger color rewrite.
Soon, CSSColorValue will be an abstract class, and we'll instead create
a CSSRGB, CSSHSL, or other specific color type from the Typed-OM spec.
However, it's still useful to have an easy "just give me a style value
for this color" method. So change the name to distinguish this from the
usual StyleValue::create() methods.
CSS-Typed-OM has the following hierarchy:
CSSStyleValue
- CSSNumericValue
- CSSUnitValue
- CSSMathValue
- ...various math functions...
Somewhat unintuitively, numbers are also stored using CSSUnitValue with
`unit = "number"`.
There are no distinct classes for LengthStyleValue, etc in the spec, but
they're convenient for us, so they are implemented as subclasses of
CSSUnitValue, at least for now.
Always assuming unpremultiplied color data only worked for PNGs (which
are specced as unpremultiplied) and bitmaps with alpha set to 100%.
Properly propagate the Gfx::AlphaType of a bitmap to Skia.
The reference tests were updated to reflect this change, but visually
it's practically impossible to see the difference. A new test was added
to clearly expose this issue.
Fixes#1104
Instead, it could be applied directly as a clip path in Skia painter.
As a side bonus, we get rid of some DeprecatedPath and
AntiAliasingPainter usage.
We don't have to invalidate style for the entire document when a style
sheet changes inside of a shadow root.
To make this possible, StyleSheetList now keeps track of which
Document-or-ShadowRoot it corresponds to, instead of just tracking the
containing Document.
This avoids a lot of style recomputation on pages with lots of shadow
DOM content (like GitHub).
Before this change, we would go through every known pseudo element and
compute style for it whenever recomputing the style of an element.
This led to disastrous performance on pages with selectors like
`::selection` or `::placeholder`, as they'd effectively match every
single element and thus we'd compute multiple additional styles for
every element in the DOM.
The fix is simple: only recompute `before` and `after` pseudo element
styles, since those are the only two pseudo elements that generate
*new* nodes -- other pseudo elements refer to (possibly) existing
nodes or concepts within the DOM (or internal shadow DOM).
This makes style updates take ~40ms on our GitHub repo instead of
~220ms. It's still slower than it should be, but a huge improvement.
This gives us free devirtualization of some hot calls inside the
bytecode interpreter. Most notably the did_trap() checks.
Modest performance improvement on the https://figma.com/ landing page.
