fix: prioritize important styles

tborg commented 1 week ago

When two selectors would set a property for an element, if one of those selectors is important then it should take precedence over non-important selector. If they are both important, or neither are important, then specificity is enough.

I observed this issue when comparing generated emails against the output of the node inline-css library. Here's a simple playground input/output that demonstrates the problem:

<html>
  <head>
    <style>
      .tw-text-secondary { color: rgb(119, 119, 119) !important; }
      ._reset_q8zsn_1 { color: unset; }
    </style>
  </head>
  <body>
    <span class="_reset_q8zsn_1 tw-text-secondary">Big Text</span>
  </body>
</html>

<html><head>

  </head>
  <body>
    <span class="pc-reset _reset_q8zsn_1 tw-font-body tw-text-ssm tw-text-substack-secondary" style="color: unset;">Big Text</span>

</body></html>

Note that if you reverse the order of the rule declarations, you get the correct behavior.

codspeed-hq[bot] commented 1 week ago

CodSpeed Performance Report

Merging #398 will not alter performance

_{Comparing tborg:tborg-fix-merge (72154dd) with master (143cd63)}

Summary

✅ 6 untouched benchmarks

codecov[bot] commented 1 week ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 89.22%. Comparing base (143cd63) to head (72154dd). Report is 1 commits behind head on master.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## master #398 +/- ## ========================================== + Coverage 89.17% 89.22% +0.04% ========================================== Files 18 18 Lines 1913 1921 +8 ========================================== + Hits 1706 1714 +8 Misses 207 207 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

tborg commented 1 week ago

Hi @Stranger6667 — very glad you were able to release 0.14.2 on Monday!

Here's another patch for you — please let me know if this seems reasonable to you and whether there's anything I can do to make it better.

Stranger6667 commented 1 week ago

Hi @tborg

Thank you so much for fixing this :) Absolutely reasonable! I am going to make a new patch release soon

Stranger6667 / css-inline