Merge pull request #13 from meowcakes/develop

Allow for data-* and aria-* attributes in html-attr?

src/re_com/validate.cljs

@@ -192,6 +192,10 @@
                   :on-mouse-leave :on-mouse-move :on-mouse-out :on-mouse-over :on-mouse-up :on-paste :on-scroll :on-submit :on-touch-cancel
                   :on-touch-end :on-touch-move :on-touch-start :on-wheel})
 
+;; Reference: http://facebook.github.io/react/docs/tags-and-attributes.html#supported-attributes
+
+(def extension-attrs #{:data :aria})
+
 ;; Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
 
 (def css-styles #{; ----- Standard CSS styles
@@ -263,6 +267,21 @@
                  {:status  :warning
                   :message (str "Unknown CSS style(s): " (remove css-styles arg-keys))}))))))
 
+(defn extension-attribute?
+  "Returns truthy if the attribute name is an extension attribute, that is data-* or aria-*, otherwise falsey."
+  ([attr]
+   (let [attr (name attr)
+         ext? #(and (= (.indexOf attr %) 0)
+                       (> (count attr) (count %)))]
+     (some (comp ext? #(str % "-") name) extension-attrs))))
+
+(defn invalid-html-attrs
+  "Returns the subset of HTML attributes contained in the passed argument that are not valid HTML attributes."
+  [attrs]
+  (remove #(or (html-attrs %)
+               (extension-attribute? %))
+          attrs))
+
 (defn html-attr?
   "Returns true if the passed argument is a valid HTML, SVG or event attribute.
    Otherwise returns a warning map.
@@ -277,9 +296,10 @@
                  contains-class? (contains? arg-keys :class)
                  contains-style? (contains? arg-keys :style)
                  result   (cond
-                            contains-class?                       ":class not allowed in :attr argument"
-                            contains-style?                       ":style not allowed in :attr argument"
-                            (not (superset? html-attrs arg-keys)) (str "Unknown HTML attribute(s): " (remove html-attrs arg-keys)))]
+                            contains-class? ":class not allowed in :attr argument"
+                            contains-style? ":style not allowed in :attr argument"
+                            :else           (when-let [invalid (not-empty (invalid-html-attrs arg-keys))]
+                                              (str "Unknown HTML attribute(s): " invalid)))]
              (or (nil? result)
                  {:status  (if (or contains-class? contains-style?) :error :warning)
                   :message result}))))))