fix: the css parser should handle empty nodes (#8503)

darind · web-flow · commit f7ab4ba3c9c3 · 2020-04-06T08:53:12.000+03:00
diff --git a/nativescript-core/css/css-tree-parser.ts b/nativescript-core/css/css-tree-parser.ts
@@ -39,7 +39,7 @@ function transformAst(node, css, type = null) {
         return {
             type: "stylesheet",
             stylesheet: {
-                rules: node.children.map(child => transformAst(child, css)).toArray(),
+                rules: node.children.map(child => transformAst(child, css)).filter(child => child !== null).toArray(),
                 parsingErrors: []
             }
         };
@@ -78,7 +78,7 @@ function transformAst(node, css, type = null) {
     }
 
     if (node.type === "Block") {
-        return node.children.map(child => transformAst(child, css, type)).toArray();
+        return node.children.map(child => transformAst(child, css, type)).filter(child => child !== null).toArray();
     }
 
     if (node.type === "Rule") {
@@ -116,6 +116,10 @@ function transformAst(node, css, type = null) {
         };
     }
 
+    if (node.type === "Raw") {
+        return null;
+    }
+
     throw Error(`Unknown node type ${node.type}`);
 }
 
diff --git a/unit-tests/css-tree-parser/css-tree-parser.ts b/unit-tests/css-tree-parser/css-tree-parser.ts
@@ -11,6 +11,16 @@ describe("css-tree parser compatible with rework ", () => {
         assert.deepEqual(cssTreeAST, reworkAST);
     });
 
+    it("empty rule", () => {
+        const css = `.test {
+            color: red;
+            ;
+        }`;
+        const reworkAST = reworkCssParse(css, { source: "file.css" });
+        const cssTreeAST = cssTreeParse(css, "file.css");
+        assert.deepEqual(cssTreeAST, reworkAST);
+    });
+
     it("@keyframes", () => {
         const testCase = ".test { animation-name: test; } @keyframes test { from { background-color: red; } to { background-color: blue; } } .test { color: red; }";
         const reworkAST = reworkCssParse(testCase, { source: "file.css" });

Original file line number	Diff line number	Diff line change
`@@ -39,7 +39,7 @@ function transformAst(node, css, type = null) {`
`39`	`39`	`return {`
`40`	`40`	`type: "stylesheet",`
`41`	`41`	`stylesheet: {`
`42`		`- rules: node.children.map(child => transformAst(child, css)).toArray(),`
	`42`	`+ rules: node.children.map(child => transformAst(child, css)).filter(child => child !== null).toArray(),`
`43`	`43`	`parsingErrors: []`
`44`	`44`	`}`
`45`	`45`	`};`
`@@ -78,7 +78,7 @@ function transformAst(node, css, type = null) {`
`78`	`78`	`}`
`79`	`79`
`80`	`80`	`if (node.type === "Block") {`
`81`		`- return node.children.map(child => transformAst(child, css, type)).toArray();`
	`81`	`+ return node.children.map(child => transformAst(child, css, type)).filter(child => child !== null).toArray();`
`82`	`82`	`}`
`83`	`83`
`84`	`84`	`if (node.type === "Rule") {`
`@@ -116,6 +116,10 @@ function transformAst(node, css, type = null) {`
`116`	`116`	`};`
`117`	`117`	`}`
`118`	`118`
	`119`	`+ if (node.type === "Raw") {`
	`120`	`+ return null;`
	`121`	`+ }`
	`122`	`+`
`119`	`123`	throw Error(`Unknown node type ${node.type}`);
`120`	`124`	`}`
`121`	`125`