[FIX] Improve rule diffing algorithm (#104)

Diffing algorithm now handles comments between rules correctly

lib/diff.js

@@ -80,7 +80,7 @@ Diffing.prototype.diffRules = function(oBaseRules, oCompareRules) {
 
 		if (oBaseNode.type === "rule") {
 			// Add all rules with different selector to stack and check for next one
-			while (!selectorEquals(oBaseNode.selectors, oCompareNode.selectors)) {
+			while (oCompareNode && (oCompareNode.type !== "rule" || !selectorEquals(oBaseNode.selectors, oCompareNode.selectors))) {
 				this.oStack.stylesheet.rules.push(oCompareNode);
 				iCompareNode++;
 				oCompareNode = oCompareRules[iCompareNode];

test/expected/libraries/lib5/my/ui/lib/themes/cascading/library-RTL.css

@@ -0,0 +1,32 @@
+body {
+  color: black;
+}
+a {
+  color: black;
+}
+b {
+  text-align: center;
+}
+.sapContrastPlus {
+  color: orange;
+}
+
+body.sapContrastPlus,
+body .sapContrastPlus {
+  color: blue;
+}
+
+.sapContrastPlus a {
+  color: blue;
+}
+/* ============================= */
+
+/* Shared CSS 1 theme            */
+
+/* ============================= */
+
+/* ============================= */
+
+/* Shared CSS 2 theme            */
+
+/* ============================= */

test/expected/libraries/lib5/my/ui/lib/themes/cascading/library.css

@@ -0,0 +1,32 @@
+body {
+  color: black;
+}
+a {
+  color: black;
+}
+b {
+  text-align: center;
+}
+.sapContrastPlus {
+  color: orange;
+}
+
+body.sapContrastPlus,
+body .sapContrastPlus {
+  color: blue;
+}
+
+.sapContrastPlus a {
+  color: blue;
+}
+/* ============================= */
+
+/* Shared CSS 1 theme            */
+
+/* ============================= */
+
+/* ============================= */
+
+/* Shared CSS 2 theme            */
+
+/* ============================= */

test/fixtures/libraries/lib5/my/ui/lib/themes/cascading/base/library.source.less

@@ -0,0 +1,11 @@
+body {
+  color: black;
+}
+
+a {
+  color: black;
+}
+
+b {
+  text-align: center;
+}

test/fixtures/libraries/lib5/my/ui/lib/themes/cascading/library.source.less

@@ -0,0 +1,2 @@
+@import "base/library.source.less";
+@import "plus/library.source.less";

test/fixtures/libraries/lib5/my/ui/lib/themes/cascading/plus/library.source.less

@@ -0,0 +1,19 @@
+body {
+  color: blue;
+}
+/* ============================= */
+/* Shared CSS 1 theme            */
+/* ============================= */
+#CSS_SCOPE_ROOT {
+  color: orange;
+}
+/* ============================= */
+/* Shared CSS 2 theme            */
+/* ============================= */
+a {
+  color: blue;
+}
+
+b {
+  text-align: center;
+}

test/test.js

@@ -1309,5 +1309,25 @@ describe("CSS Scoping (via option) of", function() {
 			}
 			return Promise.all(aPromises);
 		});
+
+		it("diff testing with comments in between", function() {
+			const expectedLibraryCssContent = readFile("test/expected/libraries/lib5/my/ui/lib/themes/cascading/library.css");
+			const expectedLibraryCssRtlContent = readFile("test/expected/libraries/lib5/my/ui/lib/themes/cascading/library-RTL.css");
+			return new Builder().build({
+				lessInputPath: "my/ui/lib/themes/cascading/library.source.less",
+				rootPaths: [
+					"test/fixtures/libraries/lib5"
+				],
+				scope: {
+					selector: "sapContrastPlus",
+					embeddedFilePath: "my/ui/lib/themes/cascading/plus/library.source.less",
+					embeddedCompareFilePath: "my/ui/lib/themes/cascading/base/library.source.less",
+					baseFilePath: "."
+				}
+			}).then(function(result) {
+				assert.equal(result.css, expectedLibraryCssContent, "CSS scoping should be correctly generated");
+				assert.equal(result.cssRtl, expectedLibraryCssRtlContent, "RTL CSS scoping should be correctly generated");
+			});
+		});
 	});
 });