Only log distinct new errors

- Check equality of stringified violations to see if we've already had a
  warning with that signature.

Author: Cameron Cundiff

src/auditor.js

@@ -1,14 +1,14 @@
 import { axe } from "axe-core/axe.min.js";
 import report from "./reporter";
 
-export default function(target) {
+export default function(target, logger) {
   const options = {
     "rules": {
       "color-contrast": { enabled: false },
     }
   };
 
   window.axe.a11yCheck(target.parentNode, options, (results) => {
-    report(results);
+    report(results, logger);
   });
 }

src/index.js

@@ -1,14 +1,17 @@
 import auditor from "./auditor.js";
+import Logger from "./logger";
 
 (function() {
+  var logger = new Logger();
+
   var load = function() {
     window.removeEventListener("load", load, false);
-    auditor(document);
+    auditor(document, logger);
   };
 
   var observer = new MutationObserver(function(mutations) {
     mutations.forEach(function(mutation) {
-      auditor(mutation.target);
+      auditor(mutation.target, logger);
     });
   });
 

src/logger.js

@@ -0,0 +1,24 @@
+export default class Logger {
+  constructor() {
+    this.logged = []
+  }
+
+  warn(violation) {
+    if(!this.exists(violation)) {
+      console.warn(violation);
+      this.logged.push(violation);
+    }
+  }
+
+  exists(violation) {
+    let exists = false;
+
+    this.logged.forEach(function(entry) {
+      if (JSON.stringify(entry) === JSON.stringify(violation)) {
+        exists = true;
+      }
+    });
+
+    return exists;
+  }
+}

src/reporter.js

@@ -2,14 +2,15 @@ import request from "browser-request";
 
 const url = "/access_lint/errors";
 
-export default function(message) {
+export default function(message, logger) {
+
   var violations = message.violations.map(function(violation) {
     return {
       description: violation.description,
       help: violation.help,
       impact: violation.impact,
       nodes: violation.nodes.map(function(n) {
-        return document.querySelectorAll(n.target);
+        return document.querySelector(n.target);
       }),
     };
   });
@@ -26,6 +27,8 @@ export default function(message) {
       }
     }, function() {});
 
-    console.warn(violations);
+    violations.forEach(function(violation) {
+      logger.warn(violation);
+    });
   }
 }

test/unit/auditor_test.js

@@ -8,6 +8,7 @@ let expect = chai.expect;
 
 import auditor from "../../src/auditor";
 import report from "../../src/reporter";
+import Logger from "../../src/logger";
 
 describe("auditor", () => {
   it("runs axe-core tests", () => {
@@ -30,10 +31,11 @@ describe("report", () => {
         nodes: []
       }]
     };
-    sinon.spy(console, "warn");
+    let logger = new Logger();
+    sinon.spy(logger, "warn");
 
-    report(results);
+    report(results, logger);
 
-    expect(console.warn).to.have.been.called.once;
+    expect(logger.warn).to.have.been.called.once;
   });
 });

test/unit/logger_test.js

@@ -0,0 +1,19 @@
+let chai = require("chai");
+let sinon = require("sinon");
+let sinonChai = require("sinon-chai");
+chai.use(sinonChai);
+let expect = chai.expect;
+
+import Logger from "../../src/logger";
+
+describe("warn", () => {
+  it("logs to console.warn", () => {
+    let logger = new Logger();
+    sinon.spy(console, "warn");
+    logger.warn("example");
+    logger.warn("example");
+
+    expect(console.warn).to.be.have.been.calledWith("example");
+    expect(console.warn).to.be.have.been.calledOnce;
+  });
+});