more tests for the parser

Author: jogibear9988

src/parse/index.ts

@@ -228,14 +228,16 @@ export const parse = (
    * Parse selector.
    */
   function selector() {
-    const m = /^([^{]+)/.exec(css);
-    if (!m) {
+    const bracePos = indexOfArrayWithBracketAndQuoteSupport(css, ['{']);
+    if (bracePos === -1 || bracePos === 0) {
       return;
     }
-    processMatch(m);
+    const selectorStr = css.substring(0, bracePos);
+    const fakeMatch = [selectorStr] as unknown as RegExpExecArray;
+    processMatch(fakeMatch);
 
     // remove comment in selector;
-    const res = trim(m[0]).replace(commentRegex, '');
+    const res = trim(selectorStr).replace(commentRegex, '');
 
     return splitWithBracketAndQuoteSupport(res, [',']).map((v) => trim(v));
   }

test/cases/complex-nesting/ast.json

@@ -0,0 +1,207 @@
+.dashboard {
+  display: grid;
+  gap: 1rem;
+
+  .sidebar {
+    width: 250px;
+
+    nav {
+      padding: 1rem;
+
+      a {
+        color: inherit;
+        text-decoration: none;
+
+        &:hover {
+          text-decoration: underline;
+        }
+
+        &::after {
+          content: " \2192";
+        }
+
+        &.active {
+          font-weight: bold;
+
+          &::before {
+            content: "\25B6";
+            margin-right: 0.5em;
+          }
+        }
+      }
+
+      ul {
+        list-style: none;
+        padding: 0;
+
+        > li {
+          margin-bottom: 0.5rem;
+
+          + li {
+            border-top: 1px solid #eee;
+            padding-top: 0.5rem;
+          }
+        }
+      }
+    }
+  }
+
+  .main-content {
+    flex: 1;
+
+    @media (min-width: 768px) {
+      padding: 2rem;
+    }
+
+    @media (min-width: 1024px) {
+      padding: 3rem;
+
+      .hero {
+        font-size: 2rem;
+      }
+    }
+
+    @supports (container-type: inline-size) {
+      container-type: inline-size;
+
+      @container (min-width: 500px) {
+        .card-grid {
+          grid-template-columns: repeat(2, 1fr);
+        }
+      }
+    }
+
+    h1 {
+      font-size: 1.5rem;
+      margin-bottom: 1rem;
+
+      ~ p {
+        color: #666;
+      }
+    }
+
+    .card {
+      border: 1px solid #ddd;
+      border-radius: 8px;
+      padding: 1rem;
+
+      &:first-child {
+        border-color: blue;
+      }
+
+      &:not(:last-child) {
+        margin-bottom: 1rem;
+      }
+
+      .card-header {
+        font-weight: bold;
+
+        .card-title {
+          font-size: 1.2em;
+        }
+
+        .card-subtitle {
+          color: #999;
+          font-size: 0.9em;
+        }
+      }
+
+      .card-body {
+        margin-top: 0.5rem;
+      }
+
+      .card-footer {
+        margin-top: 1rem;
+        border-top: 1px solid #eee;
+        padding-top: 0.5rem;
+
+        button {
+          cursor: pointer;
+
+          &:disabled {
+            opacity: 0.5;
+            cursor: not-allowed;
+          }
+        }
+      }
+    }
+  }
+}
+
+@layer base {
+  @layer reset {
+    *, *::before, *::after {
+      box-sizing: border-box;
+      margin: 0;
+      padding: 0;
+    }
+  }
+
+  @layer typography {
+    body {
+      font-family: system-ui, sans-serif;
+      line-height: 1.5;
+
+      @media (prefers-color-scheme: dark) {
+        color: #f0f0f0;
+        background: #1a1a1a;
+      }
+    }
+  }
+}
+
+@scope (.theme-dark) to (.theme-light) {
+  :scope {
+    color: white;
+    background: #333;
+
+    a {
+      color: lightblue;
+
+      &:visited {
+        color: plum;
+      }
+    }
+  }
+
+  .card {
+    background: #444;
+    border-color: #555;
+
+    @media (prefers-contrast: high) {
+      border-width: 2px;
+      border-color: white;
+    }
+  }
+}
+
+@media print {
+  @page {
+    margin: 2cm;
+
+    @top-center {
+      content: "Printed Document";
+    }
+
+    @bottom-center {
+      content: counter(page) " / " counter(pages);
+    }
+  }
+
+  .dashboard {
+    display: block;
+
+    .sidebar {
+      display: none;
+    }
+
+    .main-content {
+      width: 100%;
+
+      .card {
+        break-inside: avoid;
+        page-break-inside: avoid;
+      }
+    }
+  }
+}