diff --git a/package.json b/package.json
index ba08ec7..a3f964b 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
"path-match": "^1.2.4",
"react": "^15.4.2",
"react-dom": "^15.4.2",
+ "react-test-renderer": "^15.4.2",
"serializr": "^1.1.9"
},
"scripts": {
diff --git a/src/components/App.test.js b/src/components/App.test.js
index 1cc959a..d20db74 100644
--- a/src/components/App.test.js
+++ b/src/components/App.test.js
@@ -2,16 +2,30 @@ import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
import { Provider } from 'mobx-react'
+import renderer from 'react-test-renderer'
+import fs from "fs"
import ShopStore from "../stores/ShopStore"
-it('renders without crashing', () => {
- const shop = new ShopStore(() => Promise.resolve([]));
+const bookFetcher = () => Promise.resolve(JSON.parse(fs.readFileSync("./public/books.json")))
- const div = document.createElement('div')
- ReactDOM.render(
+it('matches snapshot before and after loading', (done) => {
+ const shop = new ShopStore(bookFetcher)
+
+ const app = renderer.create(
- ,
- div)
+
+ )
+ let tree = app.toJSON()
+ expect(tree).toMatchSnapshot()
+
+ setTimeout(
+ () => {
+ let tree = app.toJSON()
+ expect(tree).toMatchSnapshot()
+ done()
+ },
+ 100
+ )
})
diff --git a/src/components/__snapshots__/App.test.js.snap b/src/components/__snapshots__/App.test.js.snap
new file mode 100644
index 0000000..43a3029
--- /dev/null
+++ b/src/components/__snapshots__/App.test.js.snap
@@ -0,0 +1,100 @@
+exports[`test matches snapshot before and after loading 1`] = `
+
+
+
+
+ Welcome to the React MobX Book shop!
+
+
+
+
+ Loading...
+
+
+
+
+
+ Welcome to the React MobX Book shop!
+
+
+
+
+