Commit graph

393 commits

Author SHA1 Message Date
Andreas Kling
a5c2ab69ec LibWeb: Look for nearest available size when using bitmap fonts
Use the new Gfx::Font::AllowInexactSizeMatch parameter when doing CSS
font lookups. This fixes a long-standing issue where text with e.g text
with "font-size:12px" would be larger than "font-size:13px" since there
was an exact match for 12, but none for 13 (so we'd fall back to 10).
2022-02-25 19:38:31 +01:00
Sam Atkins
f3cda3c830 LibWeb: Add a rule-cache for PseudoElements
This works a little differently from the other caches - ALL rules
containing a pseudo-element are in this bucket. This lets us only look
at this bucket when finding styles for a pseudo-element, and ignore it
if we're not.
2022-02-25 19:35:34 +01:00
Sam Atkins
7eb7396f8b LibWeb: Match styles for pseudo-elements
Since each selector can only have zero or one pseudo-element, we match
against it as a separate step, before matching the rest of the
selector. This should be faster, but mostly I did this because I could
not figure out how else to stop selectors without a pseudo-element from
matching the pseudo-element, eg so `.foo` styles don't affect
`.foo::before`.
2022-02-25 19:35:34 +01:00
Andreas Kling
c61747fb2a LibWeb: Respect font-size specified by CSS in "em" length calculations
"5em" means 5*font-size, but by forcing "em" to mean the presentation
size of the bitmap font actually used, we broke a bunch of layouts that
depended on a correct interpretation of "em".

This means that "em" units will no longer be relative to the exact
size of the bitmap font in use, but I think that's a compromise we'll
have to make, since accurate layouts are more important.

This yields a visual progression on both ACID2 and ACID3. :^)
2022-02-21 18:35:12 +01:00
Andreas Kling
9c05639d35 LibWeb: Assign correct viewport dimensions when making style for ICB
The ICB (initial containing block) gets its style from StyleComputer's
create_document_style(). It's basically a generic style for the root of
the layout tree.

With this patch, we now assign the width and height of the viewport rect
as two CSS "px" lengths to the "width" and "height" properties of the
ICB style. (Previously they were just defaulting to "auto" and we
assigned override dimensions during layout.)

This fixes an issue where position:absolute elements with relative width
and/or height were not dimensioned correctly, since the values were
relative to the width and/or height of the ICB style.
2022-02-21 18:35:12 +01:00
Karol Kosek
4e50f8a8b7 LibWeb+Base: Parse font-style CSS property 2022-02-20 11:50:38 +01:00
Andreas Kling
141b01d3e3 LibWeb: Turn StyleProperties::m_property_values into an Array
After style computation, every StyleProperties has a value for every
PropertyID. Given this, it's simpler, faster and less memory-heavy to
use an Array instead of a HashMap. :^)
2022-02-19 14:45:59 +01:00
Sam Atkins
a99d02e14d LibWeb: Add an enum for !important 2022-02-12 16:13:27 +00:00
Andreas Kling
5ff816abbf LibWeb: Remove unused CascadeOrigin::Any
This was an ad-hoc concept from before we implemented the CSS cascade.
2022-02-11 12:45:38 +01:00
Andreas Kling
b68c51379e LibWeb: Add "tag name" buckets to StyleComputer::RuleCache
We can skip rules that require a specific tag name when matching against
any element with a different tag name. :^)
2022-02-10 20:52:11 +01:00
Andreas Kling
031296cf7b LibWeb: Add "ID" buckets to StyleComputer::RuleCache
We can skip rules that require a specific ID when matching against any
element that doesn't have that ID.
2022-02-10 20:52:11 +01:00
Andreas Kling
646b37d1a9 LibWeb: Cache CSS rules in buckets to reduce number of rules checked
This patch introduces the StyleComputer::RuleCache, which divides all of
our (author) CSS rules into buckets.

Currently, there are two buckets:
- Rules where a specific class must be present.
- All other rules.

This allows us to check a significantly smaller set of rules for each
element, since we can skip over any rule that requires a class attribute
not present on the element.

This takes the typical numer of rules tested per element on Discord from
~16000 to ~550. :^)

We can definitely improve the cache invalidation. It currently happens
too often due to media queries. And we also need to make sure we
invalidate when mutating style through CSSOM APIs.
2022-02-10 20:52:11 +01:00
Andreas Kling
8d104b7de2 LibWeb: Perform CSS custom property cascade once instead of per-property
Previously we would re-run the entire CSS selector machinery for each
property resolved. Instead of doing that, we now resolve a final set of
custom property key/value pairs at the start of the cascade.
2022-02-10 20:52:11 +01:00
Andreas Kling
b248661f11 LibWeb: Fix a bunch of trivial clang-tidy warnings in StyleComputer
- Replace "auto" with "auto const" where appropriate.
- Remove an unused struct.
- Make sort_matching_rules() a file-local static function.
- Remove some unnecessary includes.
2022-02-10 20:51:44 +01:00
Andreas Kling
31695e1695 LibWeb: Rename a CascadeOrigin parameter in StyleComputer 2022-02-10 20:51:44 +01:00
Sam Atkins
8bd1854406 LibWeb+Base: Enable calc() for font-weight property :^)
Modified the test-page because FontDatabase looks for exact font-weight
matches, so requesting weight 800 in a font that only has 700, causes
it to return the default font instead. So, we ask for 700 here.

The actual fix is to improve our font-matching but I am trying not to
get distracted today. :^)
2022-02-04 13:52:02 +01:00
Sam Atkins
ce0a516e59 LibWeb: Replace Length::set_calculated_style() with ::make_calculated()
There's no need to modify the Length's calculated-value after creating
it, so let's make it immutable. :^)
2022-02-04 13:52:02 +01:00
thankyouverycool
96895cd22c Everywhere: Fully qualify font names by including their slope
Fixes typefaces of the same weight but different slopes being
incorrectly returned for each other by FontDatabase.
2022-02-01 10:06:26 +01:00
Andreas Kling
12932d187e LibWeb: Teach StyleComputer about "Automatic Box Type Transformation"
CSS has rules about automatic blockification or inlinification of boxes
in certain circumstances.

This patch implements automatic blockification of absolutely positioned
and floating elements. This makes the smile appear on ACID2. :^)
2022-01-24 14:44:46 +01:00
Sam Atkins
0162ca912b LibWeb: Handle percentage font sizes 2022-01-20 00:04:10 +01:00
Sam Atkins
c9062b4ed5 LibWeb: Remove now-unused CustomStyleValue 2021-12-09 21:30:31 +01:00
Sam Atkins
c3437bccb3 LibWeb: Handle dependency cycles in CSS var()s :^)
We now detect situations like this, where variables infinitely recur,
without crashing:

```css
div {
  --a: var(--b);
  --b: var(--a);
  background: var(--a);
}

p {
  --foo: var(--foo);
  background: var(--foo);
}
```
2021-12-09 21:30:31 +01:00
Sam Atkins
3df0bf2c8d LibWeb: Mitigate the billion-laughs attack on CSS variables
We now stop processing variables once a length of 16384 tokens is
reached. This is an arbitrary number, but should be far beyond what
anyone will reasonably use, and small enough to not crash.
2021-12-09 21:30:31 +01:00
Sam Atkins
67e1125b4c LibWeb: Handle fallback values for CSS variables :^) 2021-12-09 21:30:31 +01:00
Sam Atkins
23dc0dac88 LibWeb: Parse and resolve UnresolvedStyleValues
If a property is custom or contains a `var()` reference, it cannot be
parsed into a proper StyleValue immediately, so we store it as an
UnresolvedStyleValue until the property is compute. Then, at compute
time, we resolve them by expanding out any `var()` references, and
parsing the result.

The implementation here is very naive, and involves copying the
UnresolvedStyleValue's tree of StyleComponentValueRules while copying
the contents of any `var()`s it finds along the way. This is quite an
expensive operation to do every time that the style is computed.
2021-12-09 21:30:31 +01:00
Andreas Kling
7c57961c61 LibWeb: Move BrowsingContext into HTML/
Browsing contexts are defined by the HTML specification, so let's move
them into the HTML directory. :^)
2021-11-18 21:11:30 +01:00
Sam Atkins
ecf1b7f977 LibWeb: Handle multiple backgrounds in StyleComputer
This actually involves doing *less*, because we now just pass the
StyleValueLists through instead of needing to grab their first layer's
value. :^)
2021-11-17 22:20:01 +01:00
Sam Atkins
e52f987020 LibWeb: Make property_initial_value() return a NonnullRefPtr
The finale! Users can now be sure that the value is valid, which makes
things simpler.
2021-11-10 21:58:14 +01:00
Sam Atkins
96936d04d6 LibWeb: Parse background-size as part of background shorthand 2021-11-10 14:38:49 +01:00
Sam Atkins
67214e0b61 LibWeb: Parse background-size property 2021-11-10 14:38:49 +01:00
Sam Atkins
901a990b1b LibWeb: Remove concept of CSS pseudo-properties
We don't need them any more, so they're gone. :^)
2021-11-10 14:38:49 +01:00
Sam Atkins
1e53768f1b LibWeb: Combine background-repeat-x/y pseudo-properties
While right now this doesn't save much complexity, it will do once we
care about multiple background layers per node. Then, having a single
repeat value per layer will simplify things.

It also means we can remove the pseudo-property concept entirely! :^)
2021-11-10 14:38:49 +01:00
Sam Atkins
5d0acb63ae LibWeb: Use BackgroundRepeatStyleValue in background shorthand
This is step 1 in removing the two `background-repeat-x/y`
pseudo-properties. Since adding the concept of compound StyleValues, we
don't need `background-repeat` to be split in two any more.
2021-11-10 14:38:49 +01:00
Sam Atkins
532f1e859d LibWeb: Parse background-clip and background-origin
Including as part of the `background` shorthand. :^)
2021-11-10 14:38:49 +01:00
Sam Atkins
018a4aa85c LibWeb: Parse background-attachment as part of background property 2021-11-10 14:38:49 +01:00
Sam Atkins
116a5fe5d0 LibWeb: Add background-position to background property
This required modifying the background-parsing code to use a
TokenStream, but that turned out to be pretty simple.
2021-11-10 14:38:49 +01:00
Sam Atkins
988a8ed3d8 LibWeb: Parse CSS background-position property
This is done a bit differently from other properties: using a
TokenStream instead of just a Vector of ComponentValues. The reason for
this is, we can then use call the same function when parsing the
`background` shorthand. Otherwise, we would have to know in advance how
many values to pass down, which basically would involve duplicating the
`background-position` parsing code inside `background`.

The StyleValue is PositionStyleValue, since it represents a
`<position>`: https://www.w3.org/TR/css-values-4/#typedef-position
Unfortunately, background-position's parsing is a bit different from
`<position>`'s, (background-position allows 3-value syntax and
`<position>` doesn't) so we'll need to come back and write a different
parsing function for that later.
2021-11-10 14:38:49 +01:00
Sam Atkins
78e57096e2 LibWeb: Distinguish between integer and float in NumericStyleValue
We have this information when parsing, and some properties specifically
only allow integers, so it makes sense to keep that around.
2021-10-19 19:12:09 +02:00
Sam Atkins
2d0c6bde01 LibWeb: Use W3C urls for CSS-CASCADE spec links 2021-10-15 21:05:35 +01:00
Andreas Kling
3b0da8b28c LibWeb: Add a missing null check in StyleComputer::compute_font() 2021-10-09 16:35:25 +02:00
Ben Wiederhake
0db6ca4065 LibWeb: Resolve cyclic dependency between StyleSheet and ImportRule
Previously: CSSImportRule::loaded_style_sheet() (and others) depend on
the definition of class CSSStyleSheet. Meanwhile,
CSSStyleSheet::template for_each_effective_style_rule (and others)
depend on the definition of class CSSImportRule.

This hasn't caused any problems so far because CSSStyleSheet.h happened
to be always included after CSSImportRule.h (in part due to alphabetical
ordering).

However, a compilation unit that (for example) only contains
    #include <Userland/Libraries/LibWeb/CSSImportRule.h>
would fail to compile.

This patch resolves this issue by pushing the inline definition of
Web::CSS::CSSStyleSheet::for_each_effective_style_rule and
for_first_not_loaded_import_rule into a different file, and adding the
missing headers.
2021-10-06 23:52:40 +01:00
Andreas Kling
71f371f6b1 LibWeb: Ignore font-size: calc(...) for now
This doesn't work correctly in the new world where fonts are resolved
during the CSS cascade. Let's patch it out with a FIXME and get back to
it once everything has fallen into place.
2021-09-24 15:49:04 +02:00
Andreas Kling
f8dd3e14ba LibWeb: Rename CSS::StyleResolver => StyleComputer
Resolved style is a spec concept that refers to the weird mix of
computed style and used style reflected by getComputedStyle().

The purpose of this class is to produce the *computed* style for a given
element, so let's call it StyleComputer.
2021-09-24 15:12:15 +02:00
Renamed from Userland/Libraries/LibWeb/CSS/StyleResolver.cpp (Browse further)