@sa11y/jest 5.1.0 → 5.2.0

package/README.md

@@ -19,6 +19,7 @@ Accessibility matcher for [Jest](https://jestjs.io)
     - [JSON result transformation](#json-result-transformation)
   - [Limitations](#limitations)
   - [Disabled Checks](#disabled-checks)
+  - [Jest toMatchSnapshot() API Wrapper](#jest-tomatchsnapshot-api-wrapper)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -278,3 +279,7 @@ Automatic checks currently has the following limitations.
 ### Disabled Checks
 
 -   @sa11y/jest automatic checks also disabled rules which were disabled in `toBeAccessible` Jest API ([disabled-checks](https://github.com/salesforce/sa11y/tree/master/packages/jest#disabled-checks))
+
+### Jest toMatchSnapshot() API Wrapper
+
+-   When Snapshot testing is done, jest's `toMatchSnapshot()` API is altering the document.body element attributes as needed to generate snapshots thereby the a11y checks which happen later on `document.body` isn't running on actual elements. To solve this, a wrapper has been introduced to restore the document.body DOM before jest's `toMatchSnapshot` is invoked and use the restored version of document.body for a11y checks.

package/dist/automatic.d.ts

@@ -7,6 +7,7 @@ export type AutoCheckOpts = {
     consolidateResults?: boolean;
     filesFilter?: string[];
 };
+export declare const setOriginalDocumentBodyHtml: (bodyHtml: string | null) => void;
 /**
  * Check if current test file needs to be skipped based on any provided filter
  */

package/dist/automatic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"automatic.d.ts","sourceRoot":"","sources":["../src/automatic.ts"],"names":[],"mappings":"AAeA;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAI7B,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CAC1B,CAAC;AAYF;;GAEG;AACH,wBAAgB,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,EAAE,WAAW,CAAC,EAAE,MAAM,EAAE,GAAG,OAAO,CAUtF;AAED;;;GAGG;AACH,wBAAsB,cAAc,CAAC,IAAI,GAAE,aAAoC,GAAG,OAAO,CAAC,IAAI,CAAC,CAgC9F;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,IAAI,GAAE,aAAoC,GAAG,IAAI,CAM7F"}
+{"version":3,"file":"automatic.d.ts","sourceRoot":"","sources":["../src/automatic.ts"],"names":[],"mappings":"AAeA;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAI7B,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CAC1B,CAAC;AAcF,eAAO,MAAM,2BAA2B,aAAc,MAAM,GAAG,IAAI,SAElE,CAAC;AAEF;;GAEG;AACH,wBAAgB,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,EAAE,WAAW,CAAC,EAAE,MAAM,EAAE,GAAG,OAAO,CAUtF;AAED;;;GAGG;AACH,wBAAsB,cAAc,CAAC,IAAI,GAAE,aAAoC,GAAG,OAAO,CAAC,IAAI,CAAC,CAoC9F;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,IAAI,GAAE,aAAoC,GAAG,IAAI,CAM7F"}

package/dist/automatic.js

@@ -6,7 +6,7 @@
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.registerSa11yAutomaticChecks = exports.automaticCheck = exports.skipTest = void 0;
+exports.registerSa11yAutomaticChecks = exports.automaticCheck = exports.skipTest = exports.setOriginalDocumentBodyHtml = void 0;
 const common_1 = require("@sa11y/common");
 const assert_1 = require("@sa11y/assert");
 const format_1 = require("@sa11y/format");
@@ -23,6 +23,11 @@ const defaultAutoCheckOpts = {
     consolidateResults: true,
     filesFilter: [],
 };
+let originalDocumentBodyHtml = null;
+const setOriginalDocumentBodyHtml = (bodyHtml) => {
+    originalDocumentBodyHtml = bodyHtml ?? null;
+};
+exports.setOriginalDocumentBodyHtml = setOriginalDocumentBodyHtml;
 /**
  * Check if current test file needs to be skipped based on any provided filter
  */
@@ -49,6 +54,9 @@ async function automaticCheck(opts = defaultAutoCheckOpts) {
         return;
     }
     const violations = [];
+    if (originalDocumentBodyHtml) {
+        document.body.innerHTML = originalDocumentBodyHtml;
+    }
     // Create a DOM walker filtering only elements (skipping text, comment nodes etc)
     const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT);
     let currNode = walker.firstChild();
@@ -66,6 +74,7 @@ async function automaticCheck(opts = defaultAutoCheckOpts) {
         }
     }
     finally {
+        (0, exports.setOriginalDocumentBodyHtml)(null);
         if (opts.cleanupAfterEach)
             document.body.innerHTML = ''; // remove non-element nodes
         // TODO (spike): Disable stack trace for automatic checks.

package/dist/setup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../src/setup.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAgC,MAAM,aAAa,CAAC;AAG1E,eAAO,MAAM,aAAa,UAiBzB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG;IACpB,aAAa,EAAE,aAAa,CAAC;CAKhC,CAAC;AAaF;;;GAGG;AACH,wBAAgB,KAAK,CAAC,IAAI,GAAE,SAA4B,GAAG,IAAI,CAW9D;AAED;;GAEG;AACH,wBAAgB,oBAAoB,IAAI,IAAI,CAU3C;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,UAAU,EAAE,WAAW,WAAgB,GAAG,UAAU,CAK3F"}
+{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../src/setup.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAA6D,MAAM,aAAa,CAAC;AASvG,eAAO,MAAM,aAAa,UAiBzB,CAAC;AAWF;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG;IACpB,aAAa,EAAE,aAAa,CAAC;CAKhC,CAAC;AAaF;;;GAGG;AACH,wBAAgB,KAAK,CAAC,IAAI,GAAE,SAA4B,GAAG,IAAI,CAW9D;AAED;;GAEG;AACH,wBAAgB,oBAAoB,IAAI,IAAI,CAW3C;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,UAAU,EAAE,WAAW,WAAgB,GAAG,UAAU,CAK3F"}

package/dist/setup.js

@@ -10,6 +10,7 @@ exports.adaptA11yConfig = exports.registerSa11yMatcher = exports.setup = exports
 const matcher_1 = require("./matcher");
 const automatic_1 = require("./automatic");
 const globals_1 = require("@jest/globals");
+const jest_snapshot_1 = require("jest-snapshot");
 exports.disabledRules = [
     // Descendancy checks that would fail at unit/component level, but pass at page level
     'aria-required-children',
@@ -28,6 +29,14 @@ exports.disabledRules = [
     'audio-caption',
     'video-caption',
 ];
+function wrapperSnapshotMatcher(originalMatcher) {
+    return function (...args) {
+        (0, automatic_1.setOriginalDocumentBodyHtml)(document?.body?.innerHTML ?? '');
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        return originalMatcher.call(globals_1.expect.getState(), ...args);
+    };
+}
 /**
  * Default options for sa11y jest matcher
  */
@@ -59,8 +68,9 @@ exports.setup = setup;
  * Register accessibility helpers toBeAccessible as jest matchers
  */
 function registerSa11yMatcher() {
+    const wrapper = wrapperSnapshotMatcher(jest_snapshot_1.toMatchSnapshot);
     if (globals_1.expect !== undefined) {
-        globals_1.expect.extend({ toBeAccessible: matcher_1.toBeAccessible });
+        globals_1.expect.extend({ toBeAccessible: matcher_1.toBeAccessible, toMatchSnapshot: wrapper });
     }
     else {
         throw new Error("Unable to find Jest's expect function." +

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@sa11y/jest",
-    "version": "5.1.0",
+    "version": "5.2.0",
     "description": "Accessibility testing matcher for Jest",
     "license": "BSD-3-Clause",
     "homepage": "https://github.com/salesforce/sa11y/tree/master/packages/jest#readme",
@@ -24,9 +24,9 @@
     ],
     "dependencies": {
         "@jest/test-result": "^27",
-        "@sa11y/assert": "5.1.0",
-        "@sa11y/format": "5.1.0",
-        "@sa11y/preset-rules": "5.1.0",
+        "@sa11y/assert": "5.2.0",
+        "@sa11y/format": "5.2.0",
+        "@sa11y/preset-rules": "5.2.0",
         "jest-matcher-utils": "^27"
     },
     "peerDependencies": {
@@ -34,8 +34,10 @@
     },
     "devDependencies": {
         "@jest/globals": "28.1.3",
-        "@sa11y/common": "5.1.0",
-        "@sa11y/test-utils": "5.1.0"
+        "@sa11y/common": "5.2.0",
+        "@sa11y/test-utils": "5.2.0",
+        "expect": "28.1.3",
+        "jest-snapshot": "28.1.3"
     },
     "publishConfig": {
         "access": "public"
@@ -43,5 +45,5 @@
     "engines": {
         "node": "^16 || ^18"
     },
-    "gitHead": "60b921be53c4ad776944a6538d429e93b127bf29"
+    "gitHead": "440bbb4f9d9fc3e2263e75af8e2235008eafe789"
 }