Support attributes in HTML paths in style mappings

1 files changed, 36 insertions, 12 deletions

diff --git a/lib/style-reader.js b/lib/style-reader.js
index 07521ad..38202f9 100644
--- a/lib/style-reader.js
+++ b/lib/style-reader.js
@@ -57,12 +57,13 @@ function documentMatcherRule() {
         runRule
     );
 
-    var styleIdRule = lop.rules.then(
-        classRule,
-        function(styleId) {
-            return {styleId: styleId};
-        }
-    );
+    var styleIdRule = lop.rules.sequence(
+        lop.rules.tokenOfType("dot"),
+        lop.rules.sequence.cut(),
+        lop.rules.sequence.capture(identifierRule)
+    ).map(function(styleId) {
+        return {styleId: styleId};
+    });
 
     var styleNameMatcherRule = lop.rules.firstOf("style name matcher",
         lop.rules.then(
@@ -234,15 +235,19 @@ function htmlPathRule() {
 
     var styleElementRule = lop.rules.sequence(
         capture(tagNamesRule),
-        capture(lop.rules.zeroOrMore(classRule)),
+        capture(lop.rules.zeroOrMore(attributeOrClassRule)),
         capture(freshRule),
         capture(separatorRule)
-    ).map(function(tagName, classNames, fresh, separator) {
+    ).map(function(tagName, attributesList, fresh, separator) {
         var attributes = {};
         var options = {};
-        if (classNames.length > 0) {
-            attributes["class"] = classNames.join(" ");
-        }
+        attributesList.forEach(function(attribute) {
+            if (attribute.append && attributes[attribute.name]) {
+                attributes[attribute.name] += " " + attribute.value;
+            } else {
+                attributes[attribute.name] = attribute.value;
+            }
+        });
         if (fresh) {
             options.fresh = true;
         }
@@ -293,11 +298,30 @@ function decodeEscapeSequences(value) {
     });
 }
 
+var attributeRule = lop.rules.sequence(
+    lop.rules.tokenOfType("open-square-bracket"),
+    lop.rules.sequence.cut(),
+    lop.rules.sequence.capture(identifierRule),
+    lop.rules.tokenOfType("equals"),
+    lop.rules.sequence.capture(stringRule),
+    lop.rules.tokenOfType("close-square-bracket")
+).map(function(name, value) {
+    return {name: name, value: value, append: false};
+});
+
 var classRule = lop.rules.sequence(
     lop.rules.tokenOfType("dot"),
     lop.rules.sequence.cut(),
     lop.rules.sequence.capture(identifierRule)
-).head();
+).map(function(className) {
+    return {name: "class", value: className, append: true};
+});
+
+var attributeOrClassRule = lop.rules.firstOf(
+    "attribute or class",
+    attributeRule,
+    classRule
+);
 
 function parseString(rule, string) {
     var tokens = tokenise(string);