check cycles

index.js

@@ -62,6 +62,7 @@ function AtImport(options) {
         state,
         [],
         [],
+        [],
         postcss
       )
 

lib/parse-statements.js

@@ -20,16 +20,16 @@ function split(params, start) {
   return list
 }
 
-module.exports = function parseStatements(result, styles) {
+module.exports = function parseStatements(result, styles, from) {
   const statements = []
   let nodes = []
 
   styles.each(node => {
     let stmt
     if (node.type === "atrule") {
-      if (node.name === "import") stmt = parseImport(result, node)
-      else if (node.name === "media") stmt = parseMedia(result, node)
-      else if (node.name === "charset") stmt = parseCharset(result, node)
+      if (node.name === "import") stmt = parseImport(result, node, from)
+      else if (node.name === "media") stmt = parseMedia(result, node, from)
+      else if (node.name === "charset") stmt = parseCharset(result, node, from)
     }
 
     if (stmt) {
@@ -39,6 +39,7 @@ module.exports = function parseStatements(result, styles) {
           nodes,
           media: [],
           layer: [],
+          from,
         })
         nodes = []
       }
@@ -52,23 +53,25 @@ module.exports = function parseStatements(result, styles) {
       nodes,
       media: [],
       layer: [],
+      from,
     })
   }
 
   return statements
 }
 
-function parseMedia(result, atRule) {
+function parseMedia(result, atRule, from) {
   const params = valueParser(atRule.params).nodes
   return {
     type: "media",
     node: atRule,
     media: split(params, 0),
     layer: [],
+    from,
   }
 }
 
-function parseCharset(result, atRule) {
+function parseCharset(result, atRule, from) {
   if (atRule.prev()) {
     return result.warn("@charset must precede all other statements", {
       node: atRule,
@@ -79,10 +82,11 @@ function parseCharset(result, atRule) {
     node: atRule,
     media: [],
     layer: [],
+    from,
   }
 }
 
-function parseImport(result, atRule) {
+function parseImport(result, atRule, from) {
   let prev = atRule.prev()
   if (prev) {
     do {
@@ -119,6 +123,7 @@ function parseImport(result, atRule) {
     media: [],
     layer: [],
     supports: [],
+    from,
   }
 
   for (let i = 0; i < params.length; i++) {

lib/parse-styles.js

@@ -17,9 +17,10 @@ async function parseStyles(
   state,
   media,
   layer,
+  from,
   postcss
 ) {
-  const statements = parseStatements(result, styles)
+  const statements = parseStatements(result, styles, from)
 
   for (const stmt of statements) {
     stmt.media = joinMedia(media, stmt.media || [])
@@ -141,7 +142,7 @@ async function loadImportContent(
   postcss
 ) {
   const atRule = stmt.node
-  const { media, layer } = stmt
+  const { media, layer, from } = stmt
 
   assignLayerNames(layer, atRule, state, options)
 
@@ -159,6 +160,8 @@ async function loadImportContent(
       state.importedFiles[filename][media] = {}
     }
     state.importedFiles[filename][media][layer] = true
+  } else if (from.includes(filename)) {
+    return
   }
 
   const content = await options.load(filename, options)
@@ -201,7 +204,16 @@ async function loadImportContent(
   }
 
   // recursion: import @import from imported file
-  return parseStyles(result, styles, options, state, media, layer, postcss)
+  return parseStyles(
+    result,
+    styles,
+    options,
+    state,
+    media,
+    layer,
+    [...from, filename],
+    postcss
+  )
 }
 
 module.exports = parseStyles

test/fixtures/cyclical.css

@@ -0,0 +1,2 @@
+@import "cyclical-a.css";
+@import "cyclical-b.css";

test/fixtures/cyclical.expected.css

@@ -0,0 +1,17 @@
+
+
+.b {
+  color: red;
+}
+
+.a {
+  color: blue;
+}
+
+.a {
+  color: blue;
+}
+
+.b {
+  color: red;
+}

test/fixtures/imports/cyclical-a.css

@@ -0,0 +1,5 @@
+@import url(cyclical-b.css);
+
+.a {
+  color: blue;
+}

test/fixtures/imports/cyclical-b.css

@@ -0,0 +1,5 @@
+@import url(cyclical-a.css);
+
+.b {
+  color: red;
+}

test/import.js

@@ -13,15 +13,29 @@ const atImport = require("..")
 // internal tooling
 const checkFixture = require("./helpers/check-fixture")
 
-test("should import stylsheets", checkFixture, "simple")
+test("should import stylesheets", checkFixture, "simple")
 
-test("should not import a stylsheet twice", checkFixture, "no-duplicate")
+test("should not import a stylesheet twice", checkFixture, "no-duplicate")
 
-test("should be able to import a stylsheet twice", checkFixture, "duplicates", {
-  skipDuplicates: false,
-})
+test(
+  "should be able to import a stylesheet twice",
+  checkFixture,
+  "duplicates",
+  {
+    skipDuplicates: false,
+  }
+)
+
+test(
+  "should be able to import a stylesheet with cyclical dependencies",
+  checkFixture,
+  "cyclical",
+  {
+    skipDuplicates: false,
+  }
+)
 
-test("should import stylsheets with same content", checkFixture, "same")
+test("should import stylesheets with same content", checkFixture, "same")
 
 test("should ignore & adjust external import", checkFixture, "ignore")