From 093c172d16732ba8d01faa313e0af99d26902205 Mon Sep 17 00:00:00 2001
From: Wes Bos <wesbos@gmail.com>
Date: Fri, 7 Sep 2018 12:15:53 -0400
Subject: getting there

---
 .../60/frontend/__tests__/SingleItem.test.js       | 57 ++++++++++++++++++++++
 .../__snapshots__/SingleItem.test.js.snap          | 32 ++++++++++++
 2 files changed, 89 insertions(+)
 create mode 100755 stepped-solutions/60/frontend/__tests__/SingleItem.test.js
 create mode 100755 stepped-solutions/60/frontend/__tests__/__snapshots__/SingleItem.test.js.snap

(limited to 'stepped-solutions/60/frontend/__tests__')

diff --git a/stepped-solutions/60/frontend/__tests__/SingleItem.test.js b/stepped-solutions/60/frontend/__tests__/SingleItem.test.js
new file mode 100755
index 0000000..2963bde
--- /dev/null
+++ b/stepped-solutions/60/frontend/__tests__/SingleItem.test.js
@@ -0,0 +1,57 @@
+import { mount } from 'enzyme';
+import toJSON from 'enzyme-to-json';
+import wait from 'waait';
+import SingleItem, { SINGLE_ITEM_QUERY } from '../components/SingleItem';
+import { MockedProvider } from 'react-apollo/test-utils';
+import { fakeItem } from '../lib/testUtils';
+
+describe('<SingleItem/>', () => {
+  it('renders with proper data', async () => {
+    const mocks = [
+      {
+        // when someone makes a request with this query and variable combo
+        request: { query: SINGLE_ITEM_QUERY, variables: { id: '123' } },
+        // return this fake data (mocked data)
+        result: {
+          data: {
+            item: fakeItem(),
+          },
+        },
+      },
+    ];
+    const wrapper = mount(
+      <MockedProvider mocks={mocks}>
+        <SingleItem id="123" />
+      </MockedProvider>
+    );
+    expect(wrapper.text()).toContain('Loading...');
+    await wait();
+    wrapper.update();
+    // console.log(wrapper.debug());
+    expect(toJSON(wrapper.find('h2'))).toMatchSnapshot();
+    expect(toJSON(wrapper.find('img'))).toMatchSnapshot();
+    expect(toJSON(wrapper.find('p'))).toMatchSnapshot();
+  });
+
+  it('Errors with a not found item', async () => {
+    const mocks = [
+      {
+        request: { query: SINGLE_ITEM_QUERY, variables: { id: '123' } },
+        result: {
+          errors: [{ message: 'Items Not Found!' }],
+        },
+      },
+    ];
+    const wrapper = mount(
+      <MockedProvider mocks={mocks}>
+        <SingleItem id="123" />
+      </MockedProvider>
+    );
+    await wait();
+    wrapper.update();
+    console.log(wrapper.debug());
+    const item = wrapper.find('[data-test="graphql-error"]');
+    expect(item.text()).toContain('Items Not Found!');
+    expect(toJSON(item)).toMatchSnapshot();
+  });
+});
diff --git a/stepped-solutions/60/frontend/__tests__/__snapshots__/SingleItem.test.js.snap b/stepped-solutions/60/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
new file mode 100755
index 0000000..2f41d4c
--- /dev/null
+++ b/stepped-solutions/60/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
@@ -0,0 +1,32 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<SingleItem/> Errors with a not found item 1`] = `
+<p
+  data-test="graphql-error"
+>
+  <strong>
+    Shoot!
+  </strong>
+  Items Not Found!
+</p>
+`;
+
+exports[`<SingleItem/> renders with proper data 1`] = `
+<h2>
+  Viewing 
+  dogs are best
+</h2>
+`;
+
+exports[`<SingleItem/> renders with proper data 2`] = `
+<img
+  alt="dogs are best"
+  src="dog.jpg"
+/>
+`;
+
+exports[`<SingleItem/> renders with proper data 3`] = `
+<p>
+  dogs
+</p>
+`;
-- 
cgit v1.3