v1.6.2

CHANGELOG.md

@@ -1,7 +1,98 @@
 # Changelog
 
+# v1.6.2
+
+## Fix
+- [x] fix base64 encoding error when inline sourcemap is enabled
+
+## Improvements
+- [x] handle division by zero in calc()
+- [x] strip escaped new line from string
+- [x] range media query : parse more expression as range query
+- [x] handle NaN and Infinity in computation
+- [x] parse \<url-modifiers\>
+
+strip escaped new line from string
+```css
+a[title="a not s\
+o very long title"] {
+
+color: blue;
+```
+
+is escaped as 
+
+```css
+a[title="a not so very long title"] {
+ color: blue
+}
+```
+parsing range query is improved
+
+```css
+
+@media (min-resolution: 2dppx) {}
+```
+is parsed as 
+
+```css
+@media (resolution>=2x) {}
+```
+
+NaN and Infinity are now handled in calc().
+
+```css
+
+    @media (min-width: 300px) and (max-width: 768px){
+    .s {
+
+    top: calc(NaN * 1px);
+    line-height: calc(NaN * 1);
+  color: alpha(from red/calc(0/0));
+  background: alpha(from red/calc(pi/0));
+    height: calc(1px * (NaN + 1));  
+    width: calc(NaN + 1 + calc(NaN - 1 + calc(NaN / 1 + calc(NaN * 1))));
+    margin-left: calc(infinity + 1 + calc(infinity - 1 + calc(infinity / 1 + calc(infinity * 1))));
+    margin-right: calc(infinity + 1px + calc(infinity - 1 + calc(infinity / 1 + calc(infinity * 1))));
+
+}
+
+```
+is parsed as 
+
+```css
+@media (300px<=width<=768px) {
+ .s {
+  top: calc(NaN*1px);
+  line-height: calc(NaN);
+  color: alpha(from red/calc(NaN));
+  background: alpha(from red/calc(1/0));
+  height: calc(1px*NaN);
+  width: calc(NaN);
+  margin-left: calc(0/0);
+  margin-right: calc(0/0 + 1px)
+ }
+}
+```
+Parsing url() \<url-modifiers\> is supported.
+
+```css
+
+    .s {
+    background: url("star.gif" crossorigin(anonymous));
+}
+```
+is parsed as 
+
+```css
+.s {
+ background: url(star.gif crossorigin(anonymous))
+}
+```
+
 # v1.6.1
 
+## Fixes
 - [x] fix bugs when computing math functions.
 - [x] reduce array mutations
 - [x] supporting additional shorthands: scroll-timeline, scroll-padding, scroll-margin.
@@ -28,9 +119,8 @@ a:hover {
 
 # v1.6.0
 
-- [x] added support for math function `tan()`.
-
 ## Improvements
+- [x] added support for math function `tan()`.
 - [x] faster tokenizer
 - [x] ensure transform: rotate(360deg) is not minified to transform: none
 - [x] support input sourcemap from inline sourcemap file. This is only supported by the async parser.

README.md

@@ -139,6 +139,7 @@ Try it [online](https://tbela99.github.io/css-parser/playground/)
 ## Sourcemap
 
 - [x] Sourcemap generation
+- [x] Input sourcemap: when the input CSS comes from another tool, you can pass the sourcemap content to link the generated CSS positions to the original files.
 
 ## Computed shorthands properties
 

benchmark/src/minify.bench.js → benchmark/bench/minify.bench.js

@@ -1,6 +1,6 @@
 import { bench, describe } from "vitest";
-import { minifiers } from "./src/minifiers.js";
-import { fixtures } from "./src/fixtures.js";
+import { minifiers } from "../src/minifiers.js";
+import { fixtures } from "../src/fixtures.js";
 
 // Time budget per (file x library) benchmark. Keeps the whole suite
 // (6 files x 7 libraries = 42 benchmarks) finishing in a reasonable time
@@ -19,4 +19,4 @@ for (const fixture of fixtures) {
             );
         }
     });
-}
+}

benchmark/package.json

@@ -10,15 +10,15 @@
     "all": "npm run sizes && npm run bench && npm run report"
   },
   "dependencies": {
-    "@tbela99/css-parser": "^1.6.0",
-    "@tbela99/css-parser2": "github:tbela99/css-parser#20f608b",
+    "@tbela99/css-parser": "^1.6.1",
+    "@tbela99/css-parser2": "github:tbela99/css-parser#7862cfa",
     "clean-css": "^5.3.3",
     "css-tree": "^3.2.1",
-    "cssnano": "^9.0.2",
+    "cssnano": "^9.0.3",
     "csso": "^5.0.5",
     "esbuild": "^0.28.2",
     "lightningcss": "^1.33.0",
-    "postcss": "^8.5.26",
+    "postcss": "^8.5.28",
     "vitest": "^4.1.11"
   }
 }

benchmark/src/generate-report.js

@@ -43,7 +43,7 @@ for (const fixture of fixtures) {
         const ms = timings[fixture.name]?.[m.id];
         bodyRows += `<td>
             <div class="metric"><span class="metric-label">final:</span> ${fmtBytes(size)}</div>
-            <div class="metric reduction">${fmtReduction(fixture.size, size)}</div>
+            <div class="metric reduction${size == null ? " missing" : ""}">${fmtReduction(fixture.size, size)}</div>
             <div class="metric time"><span class="metric-label">time:</span> ${fmtMs(ms)}</div>
         </td>`;
     }
@@ -58,7 +58,7 @@ for (const m of minifiers) {
     const totalMs = fixtures.reduce((sum, f) => sum + (timings[f.name]?.[m.id] ?? 0), 0);
     totalRow += `<td>
         <div class="metric"><span class="metric-label">final:</span> ${anyMissing ? fmtBytes(totalSize) + " (partial)" : fmtBytes(totalSize)}</div>
-        <div class="metric reduction">${anyMissing ? "n/a" : fmtReduction(totalOriginal, totalSize)}</div>
+        <div class="metric reduction${anyMissing ? " missing" : ''}">${anyMissing ? "n/a" : fmtReduction(totalOriginal, totalSize)}</div>
         <div class="metric time"><span class="metric-label">time:</span> ${fmtMs(totalMs)}</div>
     </td>`;
 }
@@ -106,10 +106,13 @@ const html = `<!DOCTYPE html>
   .metric { line-height: 1.5; }
   .metric-label { color: #8b949e; font-size: 0.75rem; }
   .metric.reduction { color: #7ee787; font-size: 0.78rem; font-weight: 600; }
+  .metric.reduction.missing { color: #8c241a; }
   .metric.time { color: #58a6ff; font-size: 0.78rem; }
   tr.total-row td { background: #161b22; font-weight: 700; }
   tr.total-row .metric.time { color: #79c0ff; }
-  tr.total-row .metric.reduction { color: #56d364; }
+  tr.total-row .metric.reduction { color: #56d364; }  
+  tr.total-row .metric.reduction.missing { color: #8c241a; }
+
   .meta {
     margin-top: 1.5rem;
     color: #8b949e;

benchmark/src/minifiers.js

@@ -98,6 +98,7 @@ export const minifiers = [
         label: `csso - ${versions.csso.version}`,
         minify: (css) => csso.minify(css).css,
     },
+    // infinite loop bug
     {
         id: "css-tree",
         url: versions["css-tree"].url,