Fin P5Ch6 - Snapshots

2017-12-08 16:13:49 +01:00
8 changed files with 406 additions and 2 deletions
@@ -1590,6 +1590,82 @@
        "jest-matcher-utils": "20.0.3"
      }
    },
+    "chai-jest-snapshot": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/chai-jest-snapshot/-/chai-jest-snapshot-2.0.0.tgz",
+      "integrity": "sha512-u8jZZjw/0G1t5A8wDfH6K7DAVfMg3g0dsw9wKQURNUyrZX96VojHNrFMmLirq1m0kOvC5icgL/Qh/fu1MZyvUw==",
+      "dev": true,
+      "requires": {
+        "jest-snapshot": "21.2.1",
+        "lodash.values": "4.3.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "chalk": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
+          "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "3.2.0",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "4.5.0"
+          }
+        },
+        "jest-diff": {
+          "version": "21.2.1",
+          "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.2.1.tgz",
+          "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA==",
+          "dev": true,
+          "requires": {
+            "chalk": "2.3.0",
+            "diff": "3.4.0",
+            "jest-get-type": "21.2.0",
+            "pretty-format": "21.2.1"
+          }
+        },
+        "jest-matcher-utils": {
+          "version": "21.2.1",
+          "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz",
+          "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg==",
+          "dev": true,
+          "requires": {
+            "chalk": "2.3.0",
+            "jest-get-type": "21.2.0",
+            "pretty-format": "21.2.1"
+          }
+        },
+        "jest-snapshot": {
+          "version": "21.2.1",
+          "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.2.1.tgz",
+          "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg==",
+          "dev": true,
+          "requires": {
+            "chalk": "2.3.0",
+            "jest-diff": "21.2.1",
+            "jest-matcher-utils": "21.2.1",
+            "mkdirp": "0.5.1",
+            "natural-compare": "1.4.0",
+            "pretty-format": "21.2.1"
+          }
+        },
+        "pretty-format": {
+          "version": "21.2.1",
+          "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.2.1.tgz",
+          "integrity": "sha512-ZdWPGYAnYfcVP8yKA3zFjCn8s4/17TeYH28MXuC8vTp0o21eXjbFGcOAXZEaDaOFJjc3h2qa7HQNHNshhvoh2A==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "3.0.0",
+            "ansi-styles": "3.2.0"
+          }
+        }
+      }
+    },
    "chalk": {
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -2723,6 +2799,15 @@
        "prop-types": "15.6.0"
      }
    },
+    "enzyme-to-json": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/enzyme-to-json/-/enzyme-to-json-3.2.2.tgz",
+      "integrity": "sha512-Paym79t9PFsTxvazN5+k9aZfoZO+lul/qDLspL1UlNwhbg+RUczVuuP4SO/RZ/sFRxal3dPCl+5VmqtCE1bxBw==",
+      "dev": true,
+      "requires": {
+        "lodash": "4.17.4"
+      }
+    },
    "errno": {
      "version": "0.1.4",
      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
@@ -5592,6 +5677,12 @@
        "jest-util": "20.0.3"
      }
    },
+    "jest-get-type": {
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.2.0.tgz",
+      "integrity": "sha512-y2fFw3C+D0yjNSDp7ab1kcd6NUYfy3waPTlD8yWkAtiocJdBRQqNoRqVfMNxgj+IjT0V5cBIHJO0z9vuSSZ43Q==",
+      "dev": true
+    },
    "jest-haste-map": {
      "version": "20.0.5",
      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-20.0.5.tgz",
@@ -6094,6 +6185,12 @@
      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
    },
+    "lodash.values": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-4.3.0.tgz",
+      "integrity": "sha1-o6bCsOvsxcLLocF+bmIP6BtT00c=",
+      "dev": true
+    },
    "loglevel": {
      "version": "1.6.0",
      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.0.tgz",
@@ -19,9 +19,11 @@
    "chai": "^4.1.2",
    "chai-enzyme": "^1.0.0-beta.0",
    "chai-jest-diff": "^1.0.1",
+    "chai-jest-snapshot": "^2.0.0",
    "dirty-chai": "^2.0.1",
    "enzyme": "^3.2.0",
    "enzyme-adapter-react-16": "^1.1.0",
+    "enzyme-to-json": "^3.2.2",
    "eslint-config-prettier": "^2.6.0",
    "eslint-config-react-app": "^2.0.1",
    "eslint-plugin-prettier": "^2.3.1",
@@ -9,7 +9,7 @@ import HallOfFame, { FAKE_HOF } from './HallOfFame'
 import HighScoreInput from './HighScoreInput'

 const SIDE = 6
-const SYMBOLS = '😀🎉💖🎩🐶🐱🦄🐬🌍🌛🌞💫🍎🍌🍓🍐🍟🍿'
+export const SYMBOLS = '😀🎉💖🎩🐶🐱🦄🐬🌍🌛🌞💫🍎🍌🍓🍐🍟🍿'
 const VISUAL_PAUSE_MSECS = 750

 class App extends Component {
@@ -1,8 +1,9 @@
 import { expect } from 'chai'
 import React from 'react'
 import { shallow } from 'enzyme'
+import sinon from 'sinon'

-import App from './App'
+import App, { SYMBOLS } from './App'
 import GuessCount from './GuessCount'

 describe('<App/>', () => {
@@ -20,4 +21,17 @@ describe('<App/>', () => {
    const wrapper = shallow(<App />)
    expect(wrapper.find('Card')).to.have.length(36)
  })
+
+  it('should match its reference snapshot', () => {
+    const mock = sinon
+      .stub(App.prototype, 'generateCards')
+      .returns([...SYMBOLS.repeat(2)])
+    try {
+      const wrapper = shallow(<App />)
+
+      expect(wrapper).to.matchSnapshot()
+    } finally {
+      mock.restore()
+    }
+  })
 })
@@ -15,4 +15,13 @@ describe('<Card/>', () => {
    wrapper.simulate('click')
    expect(onClick).to.have.been.calledWith(0)
  })
+
+  it('should match its reference snapshot', () => {
+    const onClick = sinon.spy()
+    const wrapper = shallow(
+      <Card card="😁" feedback="hidden" index={0} onClick={onClick} />
+    )
+
+    expect(wrapper).to.matchSnapshot()
+  })
 })
@@ -0,0 +1,263 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<App/> should match its reference snapshot 1`] = `
+<div
+  className="memory"
+>
+  <GuessCount
+    guesses={0}
+  />
+  <Card
+    card="😀"
+    feedback="hidden"
+    index={0}
+    key="0"
+    onClick={[Function]}
+  />
+  <Card
+    card="🎉"
+    feedback="hidden"
+    index={1}
+    key="1"
+    onClick={[Function]}
+  />
+  <Card
+    card="💖"
+    feedback="hidden"
+    index={2}
+    key="2"
+    onClick={[Function]}
+  />
+  <Card
+    card="🎩"
+    feedback="hidden"
+    index={3}
+    key="3"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐶"
+    feedback="hidden"
+    index={4}
+    key="4"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐱"
+    feedback="hidden"
+    index={5}
+    key="5"
+    onClick={[Function]}
+  />
+  <Card
+    card="🦄"
+    feedback="hidden"
+    index={6}
+    key="6"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐬"
+    feedback="hidden"
+    index={7}
+    key="7"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌍"
+    feedback="hidden"
+    index={8}
+    key="8"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌛"
+    feedback="hidden"
+    index={9}
+    key="9"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌞"
+    feedback="hidden"
+    index={10}
+    key="10"
+    onClick={[Function]}
+  />
+  <Card
+    card="💫"
+    feedback="hidden"
+    index={11}
+    key="11"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍎"
+    feedback="hidden"
+    index={12}
+    key="12"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍌"
+    feedback="hidden"
+    index={13}
+    key="13"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍓"
+    feedback="hidden"
+    index={14}
+    key="14"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍐"
+    feedback="hidden"
+    index={15}
+    key="15"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍟"
+    feedback="hidden"
+    index={16}
+    key="16"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍿"
+    feedback="hidden"
+    index={17}
+    key="17"
+    onClick={[Function]}
+  />
+  <Card
+    card="😀"
+    feedback="hidden"
+    index={18}
+    key="18"
+    onClick={[Function]}
+  />
+  <Card
+    card="🎉"
+    feedback="hidden"
+    index={19}
+    key="19"
+    onClick={[Function]}
+  />
+  <Card
+    card="💖"
+    feedback="hidden"
+    index={20}
+    key="20"
+    onClick={[Function]}
+  />
+  <Card
+    card="🎩"
+    feedback="hidden"
+    index={21}
+    key="21"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐶"
+    feedback="hidden"
+    index={22}
+    key="22"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐱"
+    feedback="hidden"
+    index={23}
+    key="23"
+    onClick={[Function]}
+  />
+  <Card
+    card="🦄"
+    feedback="hidden"
+    index={24}
+    key="24"
+    onClick={[Function]}
+  />
+  <Card
+    card="🐬"
+    feedback="hidden"
+    index={25}
+    key="25"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌍"
+    feedback="hidden"
+    index={26}
+    key="26"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌛"
+    feedback="hidden"
+    index={27}
+    key="27"
+    onClick={[Function]}
+  />
+  <Card
+    card="🌞"
+    feedback="hidden"
+    index={28}
+    key="28"
+    onClick={[Function]}
+  />
+  <Card
+    card="💫"
+    feedback="hidden"
+    index={29}
+    key="29"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍎"
+    feedback="hidden"
+    index={30}
+    key="30"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍌"
+    feedback="hidden"
+    index={31}
+    key="31"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍓"
+    feedback="hidden"
+    index={32}
+    key="32"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍐"
+    feedback="hidden"
+    index={33}
+    key="33"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍟"
+    feedback="hidden"
+    index={34}
+    key="34"
+    onClick={[Function]}
+  />
+  <Card
+    card="🍿"
+    feedback="hidden"
+    index={35}
+    key="35"
+    onClick={[Function]}
+  />
+</div>
+`;
@@ -0,0 +1,14 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Card/> should match its reference snapshot 1`] = `
+<div
+  className="card hidden"
+  onClick={[Function]}
+>
+  <span
+    className="symbol"
+  >
+    ❓
+  </span>
+</div>
+`;
@@ -1,15 +1,20 @@
 import Adapter from 'enzyme-adapter-react-16'
 import chai from 'chai'
 import { configure as configureEnzyme } from 'enzyme'
+import chaiJestSnapshot from 'chai-jest-snapshot'
 import createChaiEnzyme from 'chai-enzyme'
 import createChaiJestDiff from 'chai-jest-diff'
 import dirtyChai from 'dirty-chai'
+import enzymeToJSON from 'enzyme-to-json/serializer'
 import sinonChai from 'sinon-chai'

 chai
  .use(dirtyChai)
  .use(createChaiJestDiff())
+  .use(chaiJestSnapshot)
  .use(createChaiEnzyme())
  .use(sinonChai)

+expect.addSnapshotSerializer(enzymeToJSON)
+
 configureEnzyme({ adapter: new Adapter() })