2 Commits

Author SHA1 Message Date
Adam Wathan
42136e94ce
Run test suite against both engines (#10373)
* Run test suite against both engines

* make eslint happy

* only run `stable` tests on Node 12

* use normal expectation instead of snapshot file

When we run the tests only against `stable` (for node 12), then the
snapshots exists for the `Oxide` build. They are marked as `obsolete`
and will cause the `npm run test` script to fail. Sadly.

Inlined them for now, but ideally we make those tests more blackbox-y so
that we test that we get source maps and that we can map the sourcemap
back to the input files (without looking at the actual annotations).

* properly indent inline css

Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>
Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
2023-01-20 18:45:04 +01:00
Robin Malfait
b9af5a916b
Improve collapsing of duplicate declarations (#6856)
* improve collapsing of duplicate properties

In theory, we don't have to do anything because the browser is smart
enough to figure everything out. However, leaving in duplicate
properties is not that ideal for file size.

Our previous method was pretty simple: if you see a declaration you
already saw in this rule, delete the previous one and keep the current
one.

This works pretty well, but this gets rid of **all** the declarations
with the same property. This is not great for overrides for older
browsers.

In a perfect world, we can handle this based on your target browser but
this is a lot of unnecessary complexity and will slow things down
performance wise.

Alternative, we improved the solution by being a bit smarter:
1. Delete duplicate declarations that have the same property and value
   (this will get rid of **exact** duplications).
2. Delete declarations with the same property and the same **unit**.

This means that we will reduce this:
```css
.example {
  height: 50%;
  height: 100px;
  height: 20vh;
  height: 30%;
  height: 50px;
  height: 30vh;
  transform: var(--value);
  transform: var(--value);
}
```

To:
```diff-css
  .example {
-   height: 50%;    /* Another height exists later with a `%` unit */
-   height: 100px;  /* Another height exists later with a `px` unit */
-   height: 20vh;   /* Another height exists later with a `vh` unit */
    height: 30%;
    height: 50px;
    height: 30vh;
-   transform: var(--value); /* Value is too complex, but is **exactly** the same as the one below */
    transform: var(--value);
  }
```

This will reduce the values that we are 100% sure that can be safely
removed. This will still result in some overrides but the browser can
handle those for you.

Fixes: #6844

* update changelog
2022-01-03 15:41:49 +01:00