tests: add basic screenshot test for schema view

cypress.json

@@ -3,7 +3,7 @@
   "integrationFolder": "e2e/integration",
   "pluginsFile": "e2e/plugins/index.js",
   "fixturesFolder": false,
-  "supportFile": false,
+  "supportFile": "e2e/plugins/support.js",
   "fileServerFolder": ".",
   "video": true,
   "projectId": "z6eb6h",

e2e/custom.d.ts

@@ -0,0 +1,10 @@
+type MatchSnapShotOptions = Cypress.ScreenshotOptions &
+  import('jest-image-snapshot').MatchImageSnapshotOptions;
+
+declare namespace Cypress {
+  interface Chainable<Subject = any> {
+    matchImageSnapshot(name?: string): void;
+    matchImageSnapshot(name: string, options: MatchSnapShotOptions): void;
+    matchImageSnapshot(options: MatchSnapShotOptions): void;
+  }
+}

e2e/integration/schema.e2e.ts

@@ -0,0 +1,12 @@
+describe('Schema View', () => {
+  beforeEach(() => {
+    cy.visit('e2e/standalone.html');
+  });
+
+  it('Pet schema view should match screenshot', () => {
+    cy.get('[data-section-id="operation/addPet"] table')
+      .last()
+      .scrollIntoView()
+      .matchImageSnapshot('pet-schema-view');
+  });
+});

e2e/plugins/index.js

@@ -1,5 +1,7 @@
 const cypressTypeScriptPreprocessor = require('./cy-ts-preprocessor');
+const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin');
 
 module.exports = on => {
   on('file:preprocessor', cypressTypeScriptPreprocessor);
+  addMatchImageSnapshotPlugin(on);
 };

e2e/plugins/support.js

@@ -0,0 +1,6 @@
+import { addMatchImageSnapshotCommand } from 'cypress-image-snapshot/command';
+
+addMatchImageSnapshotCommand({
+  customSnapshotsDir: 'e2e/snapshots',
+  // disableTimersAndAnimations: false,
+});

e2e/tsconfig.json

@@ -21,6 +21,7 @@
   },
   "compileOnSave": false,
   "include": [
+    "custom.d.ts",
     "integration/*.ts",
     "../node_modules/cypress"
   ]

package.json

@@ -31,9 +31,10 @@
     "test": "npm run lint && npm run unit && npm run bundlesize && npm run license-check",
     "unit": "jest --coverage",
     "e2e": "cypress run",
+    "e2e:update-snapshots": "cypress run --env updateSnapshots=true",
     "e2e-ci": "cypress run --record",
-    "bundlesize": "bundlesize",
     "cy:open": "cypress open",
+    "bundlesize": "bundlesize",
     "bundle:clean": "rimraf bundles",
     "bundle:standalone": "webpack --env.standalone --mode=production",
     "bundle:lib": "webpack --mode=production",
@@ -45,9 +46,9 @@
     "lint": "tslint --project tsconfig.json",
     "benchmark": "node ./benchmark/benchmark.js",
     "start:demo": "webpack-dev-server --hot --config demo/webpack.config.ts --mode=development",
-    "compile:cli": "tsc custom.d.ts cli/index.ts --target es6 --module commonjs --types yargs",
     "build:demo": "webpack --mode=production --config demo/webpack.config.ts",
     "deploy:demo": "npm run build:demo && deploy-to-gh-pages --update demo/dist",
+    "compile:cli": "tsc custom.d.ts cli/index.ts --target es6 --module commonjs --types yargs",
     "license-check": "license-checker --production --onlyAllow 'MIT;ISC;Apache-2.0;BSD;BSD-2-Clause;BSD-3-Clause' --summary"
   },
   "devDependencies": {
@@ -61,6 +62,7 @@
     "@types/enzyme": "^3.1.13",
     "@types/enzyme-to-json": "^1.5.2",
     "@types/jest": "^23.3.1",
+    "@types/jest-image-snapshot": "^2.4.0",
     "@types/json-pointer": "^1.0.30",
     "@types/lodash": "^4.14.116",
     "@types/lunr": "^2.1.6",
@@ -86,6 +88,7 @@
     "coveralls": "^3.0.2",
     "css-loader": "^1.0.0",
     "cypress": "~3.1.0",
+    "cypress-image-snapshot": "^2.1.1",
     "deploy-to-gh-pages": "^1.3.6",
     "enzyme": "^3.4.4",
     "enzyme-adapter-react-16": "^1.2.0",

yarn.lock

@@ -230,6 +230,16 @@
     "@types/cheerio" "*"
     "@types/react" "*"
 
+"@types/jest-image-snapshot@^2.4.0":
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/@types/jest-image-snapshot/-/jest-image-snapshot-2.4.0.tgz#fbc79f5e3e7e5e7b8e92198fbcf2234284f1929c"
+  dependencies:
+    "@types/jest" "*"
+
+"@types/jest@*":
+  version "23.3.2"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-23.3.2.tgz#07b90f6adf75d42c34230c026a2529e56c249dbb"
+
 "@types/jest@^23.3.1":
   version "23.3.1"
   resolved "https://registry.yarnpkg.com/@types/jest/-/jest-23.3.1.tgz#a4319aedb071d478e6f407d1c4578ec8156829cf"
@@ -2551,6 +2561,13 @@ cyclist@~0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640"
 
+cypress-image-snapshot@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/cypress-image-snapshot/-/cypress-image-snapshot-2.1.1.tgz#e0bc0847c653ce8a2c8e956538f8f4cdb575c0e4"
+  dependencies:
+    fs-extra "^7.0.0"
+    jest-image-snapshot "2.4.3"
+
 cypress@~3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/cypress/-/cypress-3.1.0.tgz#b718ba64289b887c7ab7a7f09245d871a4a409ba"
@@ -3732,6 +3749,14 @@ fs-extra@6.0.1:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
+fs-extra@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-7.0.0.tgz#8cc3f47ce07ef7b3593a11b9fb245f7e34c041d6"
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^4.0.0"
+    universalify "^0.1.0"
+
 fs-minipass@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/fs-minipass/-/fs-minipass-1.2.5.tgz#06c277218454ec288df77ada54a03b8702aacb9d"
@@ -3814,6 +3839,10 @@ get-stdin@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-4.0.1.tgz#b968c6b0a04384324902e8bf1a5df32579a450fe"
 
+get-stdin@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-5.0.1.tgz#122e161591e21ff4c52530305693f20e6393a398"
+
 get-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
@@ -4890,6 +4919,18 @@ jest-haste-map@^23.5.0:
     micromatch "^2.3.11"
     sane "^2.0.0"
 
+jest-image-snapshot@2.4.3:
+  version "2.4.3"
+  resolved "https://registry.yarnpkg.com/jest-image-snapshot/-/jest-image-snapshot-2.4.3.tgz#68422dc0040a7855fa837cf015a1a3bb3d4c35db"
+  dependencies:
+    chalk "^1.1.3"
+    get-stdin "^5.0.1"
+    lodash "^4.17.4"
+    mkdirp "^0.5.1"
+    pixelmatch "^4.0.2"
+    pngjs "^3.3.3"
+    rimraf "^2.6.2"
+
 jest-jasmine2@^23.5.0:
   version "23.5.0"
   resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-23.5.0.tgz#05fe7f1788e650eeb5a03929e6461ea2e9f3db53"
@@ -6552,6 +6593,12 @@ pinkie@^2.0.0:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/pinkie/-/pinkie-2.0.4.tgz#72556b80cfa0d48a974e80e77248e80ed4f7f870"
 
+pixelmatch@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/pixelmatch/-/pixelmatch-4.0.2.tgz#8f47dcec5011b477b67db03c243bc1f3085e8854"
+  dependencies:
+    pngjs "^3.0.0"
+
 pkg-dir@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b"
@@ -6572,6 +6619,10 @@ pn@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/pn/-/pn-1.1.0.tgz#e2f4cef0e219f463c179ab37463e4e1ecdccbafb"
 
+pngjs@^3.0.0, pngjs@^3.3.3:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-3.3.3.tgz#85173703bde3edac8998757b96e5821d0966a21b"
+
 polished@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/polished/-/polished-2.0.2.tgz#968aa98a86a51d611ccbfe23d3593afea7184b90"