Otherwise, in a simple page such as:
<video src=...>
<audio src=...>
The video's clip rect would "leak" to the AudioPaintable, preventing the
audio controls from rendering at all.
Not a huge deal because the base MediaPaintable class goes very out of
its way to paint within the confines of its own box, but just to be
safe, this was missed when adding the AudioPaintable class.
Fixes the issue that before "automatic minimum size" were used to size
flexible tracks even though specification says is should be "minimum
contribution"
Parsing 'data:' URLs took it's own route. It never set standard URL
fields like path, query or fragment (except for scheme) and instead
gave us separate methods called `data_payload()`, `data_mime_type()`,
and `data_payload_is_base64()`.
Because parsing 'data:' didn't use standard fields, running the
following JS code:
new URL('#a', 'data:text/plain,hello').toString()
not only cleared the path as URLParser doesn't check for data from
data_payload() function (making the result be 'data:#a'), but it also
crashes the program because we forbid having an empty MIME type when we
serialize to string.
With this change, 'data:' URLs will be parsed like every other URLs.
To decode the 'data:' URL contents, one needs to call process_data_url()
on a URL, which will return a struct containing MIME type with already
decoded data! :^)
This makes the loader more agnostic.
Additionally, this allows us to load tab in Ladybird with a 'data:' URL
containing parameters, as a Resource will now call
`mime_type_from_content_type` to extract the content type from MIME. :^)
CSS shouldn't probably check if a MIME type in the 'data:' URL is
correct or not. Every URL gets sent to a ResourceLoader so a client can
just validate if got file with correct media type.
This also makes loading 'data:' URLs in @import work now, as we didn't
have AllowedDataUrlType for stylesheets.
When toggling `display: none` on an element, it can go from having a
layout subtree to not having one. In the `none` case, we were previously
leaving stale layout nodes hanging off DOM nodes in the subtree.
These layout nodes could be queried for outdated information and
probably other things that we shouldn't allow.
Fix this by having TreeBuilder prune any old layout nodes hanging off
nodes in a subtree after its subtree root doesn't produce a layout node.
CSSStyleSheet now caches the CSSNamespaceRule for the default namespace,
which is the only one we currently care about. This saves us from
iterating over its list of rules every time we want to know what that
default namespace is.
The spec dictates that `@namespace` rules are only valid near the start
of a stylesheet, so we also take advantage of that to quit searching
for namespaces as soon as we see a non-import rule.
Also renamed `namespace_filter()` to `default_namespace()` since that's
what it actually returns.
This makes github.com/serenityos/serenity snappy again. :^)
This patch changes the way StructuredSerializeInternal() serialize
strings by storing four bytes into a 32-bit entry, instead of one code
point per 32-bit entry.
StructuredDeserialize() has also been changed to deserialize strings by
the same ruleset.
In order to follow spec text to achieve this, we need to change the
underlying representation of a host in AK::URL to deserialized format.
Before this, we were parsing the host and then immediately serializing
it again.
Making that change resulted in a whole bunch of fallout.
After this change, callers can access the serialized data through
this concept-host-serializer. The functional end result of this
change is that IPv6 hosts are now correctly serialized to be
surrounded with '[' and ']'.
Previously, we always rounded border-widths up when converting them to
device pixels. However, the spec asks us to follow a specific algorithm
to "snap" these values, so that the computed value is snapped.
The difference from before, is that widths of between 0 and 1 device
pixels are rounded up to 1, and and values larger than 1 are rounded
down.
The `clip_shrink` optimization in `paint_background()` now also
correctly uses DevicePixels, instead of reducing a DevicePixel rect by
a CSSPixels amount.
If a math function resolves to `<length>` or `<percentage>`, then it
will by definition also resolve to `<length-percentage>`. (Same for any
other basic types.) Since we were checking `<length-percentage>` first
and then bailing if no given properties could accept that, math
functions would always fail to match a property that just accepts a non
`-percentage` type.
This is a universal value like `initial` and `inherit` and works by
reverting the current value to whatever we had at the start of the
current cascade origin.
The implementation is somewhat inefficient as we make a copy of all
current values at the start of each origin. I'm sure we can come up with
a way to make this faster eventually.
Checking if CSSPixels contains a finite value is no longer makes sense
after converting to fixed-point arithmetics. Instead there should
assertion that used value is not saturated.
This patch implements "react to changes in the environment" from the
HTML spec and hooks HTMLImageElement up with viewport rect change
notifications (from the browsing context).
This fixes the issue where we'd load a low-resolution image and not
switch to a high-resolution image after resizing the window.
Note that we currently can't resolve calc() values without a layout
node, so when normalizing an image's source set, we'll flush any pending
layout updates and hope that gives us an up-to-date layout node.
I've left a FIXME about implementing this in a more elegant and less
layout-thrashy way, as that will require more architectural work.
A small workaround is needed here as <stop> elements don't create a
layout node, so we can't get the current color from value->to_color().
This fixes the gradients in the Atlassian logo and icons.
Allow the left margin of a box which creates a block formatting context
to overlap with left floating boxes which are siblings in the document
tree.
Fixes#20233 and the comment layout on https://lobste.rs.
Required by Atlassian to continue to their authorization process.
Also used by the SerenityOS FAQ redirect on the website, the Bootstrap
documentation for going to older versions from the dropdown and
likely several other sites.
This change makes tree builder omit elements with "display: contents"
from the layout tree during construction. Their child elements are
instead directly appended to the parent element in layout tree.
Before this change, we would process each image as it finished
downloading. This often led to a situation where we'd decode 1 image,
schedule a layout, do the layout, then decode another image, schedule
a layout, do the layout, etc. Basically decoding and layouts would get
interleaved even though we had multiple images fetched and ready for
decoding.
This patch adds a simple BatchingDispatcher thingy that HTMLImageElement
uses to batch the handling of successful fetches.
With this, the number of layouts while loading https://shopify.com/ goes
from 48 to 6, and the page loads noticeably faster. :^)
Transforms are a paint-level concept for us, so we should be okay to
only update the stacking context tree and repaint.
This makes a lot of CSS animations use way less CPU.
For malformed tables which only have cells with span greater than 1, the
content sizes for row and column aren't initialized to non-zero values.
Avoid undefined behavior in such cases, which sometimes show up on
Wikipedia.
When joined border width is zero width, then the midpoint
of the joined corner is no longer need to be computed
anymore. Just set the mid point to be the endpoint of the
corner.
Auto margins used together with justify-content would previously
result in children being positioned outside their parent. This was
solved by letting auto margins take precedence when they are used,
which was already implemented to some extent before, but not
fully.
Containers with both flex reverse and justify content would
sometimes place children outside the container. This happened
because it assumed any reversed container would have items
aligned to the right, which isn't true when using eg. `flex-end`.
Both `justify-content: start` and `justify-content: end` are now
also independent of the reverseness.
