summaryrefslogtreecommitdiffstats
path: root/frontend/__tests__
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/__tests__')
-rw-r--r--frontend/__tests__/AddToCart.test.js17
-rw-r--r--frontend/__tests__/Cart.test.js3
-rw-r--r--frontend/__tests__/CreateItem.test.js3
-rw-r--r--frontend/__tests__/EditUser.test.js6
-rw-r--r--frontend/__tests__/Nav.test.js2
-rw-r--r--frontend/__tests__/Order.test.js3
-rw-r--r--frontend/__tests__/Pagination.test.js6
-rw-r--r--frontend/__tests__/PleaseSignIn.test.js2
-rw-r--r--frontend/__tests__/RemoveFromCart.test.js4
-rw-r--r--frontend/__tests__/ResetRequest.test.js49
-rw-r--r--frontend/__tests__/Signup.test.js36
-rw-r--r--frontend/__tests__/SingleItem.test.js17
-rw-r--r--frontend/__tests__/TakeMyMoney.test.js21
-rw-r--r--frontend/__tests__/__snapshots__/Signup.test.js.snap7
-rw-r--r--frontend/__tests__/__snapshots__/SingleItem.test.js.snap97
15 files changed, 84 insertions, 189 deletions
diff --git a/frontend/__tests__/AddToCart.test.js b/frontend/__tests__/AddToCart.test.js
index 888ad68..fe15f3f 100644
--- a/frontend/__tests__/AddToCart.test.js
+++ b/frontend/__tests__/AddToCart.test.js
@@ -1,12 +1,12 @@
import React from 'react';
import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
-import AddToCart from '../components/AddToCart';
import { ApolloConsumer } from 'react-apollo';
import { MockedProvider } from 'react-apollo/test-utils';
import wait from 'waait';
+import AddToCart, { ADD_TO_CART_MUTATION } from '../components/AddToCart';
import { fakeCartItem, fakeUser } from '../lib/testUtils';
-import { ADD_TO_CART_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
const mocks = [
{
@@ -34,12 +34,15 @@ const mocks = [
];
describe('<AddtoCart/>', () => {
- it('renders and matches snapshot', () => {
+ it('renders and matches snapshot', async () => {
const wrapper = mount(
- <MockedProvider>
+ <MockedProvider mocks={mocks}>
<AddToCart id="abc123" />
</MockedProvider>
);
+ await wait();
+ wrapper.update();
+
expect(toJSON(wrapper.find('button'))).toMatchSnapshot();
});
@@ -58,6 +61,8 @@ describe('<AddtoCart/>', () => {
</MockedProvider>
);
await wait();
+ wrapper.update();
+
const { me } = apolloClient.readQuery({ query: CURRENT_USER_QUERY });
expect(me.cart).toHaveLength(0);
@@ -72,12 +77,14 @@ describe('<AddtoCart/>', () => {
expect(me2.cart[0].quantity).toBe(1);
});
- it('changes to adding when clicked', () => {
+ it('changes to adding when clicked', async () => {
const wrapper = mount(
<MockedProvider mocks={mocks}>
<AddToCart id="abc123" />
</MockedProvider>
);
+ await wait();
+ wrapper.update();
expect(wrapper.text()).toContain('🛒 Add To Cart');
wrapper.find('button').simulate('click');
expect(wrapper.text()).toContain('🛒 Adding To Cart');
diff --git a/frontend/__tests__/Cart.test.js b/frontend/__tests__/Cart.test.js
index f32c7f9..255183e 100644
--- a/frontend/__tests__/Cart.test.js
+++ b/frontend/__tests__/Cart.test.js
@@ -6,7 +6,8 @@ import wait from 'waait';
import Cart from '../components/Cart';
import { MockedProvider } from 'react-apollo/test-utils';
import { fakeCartItem, fakeUser } from '../lib/testUtils';
-import { CURRENT_USER_QUERY, LOCAL_STATE_QUERY } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
+import { LOCAL_STATE_QUERY } from '../components/Cart';
const mocks = [
{
diff --git a/frontend/__tests__/CreateItem.test.js b/frontend/__tests__/CreateItem.test.js
index a2fcb90..56c3f10 100644
--- a/frontend/__tests__/CreateItem.test.js
+++ b/frontend/__tests__/CreateItem.test.js
@@ -3,10 +3,9 @@ import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
import Router from 'next/router';
import { MockedProvider } from 'react-apollo/test-utils';
-import CreateItem from '../components/CreateItem';
+import CreateItem, { CREATE_ITEM_MUTATION } from '../components/CreateItem';
import wait from 'waait';
import { fakeItem } from '../lib/testUtils';
-import { CREATE_ITEM_MUTATION } from '../queries/queries.graphql';
const dogImage = 'https://dog.com/dog.jpg';
diff --git a/frontend/__tests__/EditUser.test.js b/frontend/__tests__/EditUser.test.js
index c1aea1c..a98cbb5 100644
--- a/frontend/__tests__/EditUser.test.js
+++ b/frontend/__tests__/EditUser.test.js
@@ -1,11 +1,11 @@
import React from 'react';
import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
-import EditUser from '../components/EditUser';
-import wait from 'waait';
import { MockedProvider } from 'react-apollo/test-utils';
+import wait from 'waait';
+import EditUser, { UPDATE_USER_MUTATION } from '../components/EditUser';
import { fakeUser } from '../lib/testUtils';
-import { CURRENT_USER_QUERY, UPDATE_USER_MUTATION } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
const mocks = [
{
diff --git a/frontend/__tests__/Nav.test.js b/frontend/__tests__/Nav.test.js
index 16f20e3..5c61c56 100644
--- a/frontend/__tests__/Nav.test.js
+++ b/frontend/__tests__/Nav.test.js
@@ -6,7 +6,7 @@ import Router from 'next/router';
import Nav from '../components/Nav';
import { MockedProvider } from 'react-apollo/test-utils';
import { fakeUser } from '../lib/testUtils';
-import { CURRENT_USER_QUERY } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
// Mock the router
Router.router = { push() {} };
diff --git a/frontend/__tests__/Order.test.js b/frontend/__tests__/Order.test.js
index 5cb21c8..f3a4f06 100644
--- a/frontend/__tests__/Order.test.js
+++ b/frontend/__tests__/Order.test.js
@@ -2,10 +2,9 @@ import React from 'react';
import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
import wait from 'waait';
-import Order from '../components/Order';
import { MockedProvider } from 'react-apollo/test-utils';
+import Order, { SINGLE_ORDER_QUERY } from '../components/Order';
import { fakeOrder } from '../lib/testUtils';
-import { SINGLE_ORDER_QUERY } from '../queries/queries.graphql';
const mocks = [
{
diff --git a/frontend/__tests__/Pagination.test.js b/frontend/__tests__/Pagination.test.js
index 1202d9a..29a57f9 100644
--- a/frontend/__tests__/Pagination.test.js
+++ b/frontend/__tests__/Pagination.test.js
@@ -1,11 +1,10 @@
import React from 'react';
import { shallow, mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
-import Pagination from '../components/Pagination';
+import Pagination, { PAGINATION_QUERY } from '../components/Pagination';
import { MockedProvider } from 'react-apollo/test-utils';
import wait from 'waait';
import { fakeItem } from '../lib/testUtils';
-import { ALL_ITEMS_QUERY } from '../queries/queries.graphql';
import Router from 'next/router';
@@ -15,7 +14,7 @@ Router.router = { push() {}, prefetch() {} };
function makeMocksFor(length) {
return [
{
- request: { query: ALL_ITEMS_QUERY, variables: { skip: 0, first: 4 } },
+ request: { query: PAGINATION_QUERY, variables: { skip: 0, first: 4 } },
result: {
data: {
itemsConnection: {
@@ -25,7 +24,6 @@ function makeMocksFor(length) {
__typename: 'count',
},
},
- items: Array.from({ length }, (_, i) => fakeItem({ id: `item${i}` })),
},
},
},
diff --git a/frontend/__tests__/PleaseSignIn.test.js b/frontend/__tests__/PleaseSignIn.test.js
index 68581b7..f516ea3 100644
--- a/frontend/__tests__/PleaseSignIn.test.js
+++ b/frontend/__tests__/PleaseSignIn.test.js
@@ -4,7 +4,7 @@ import wait from 'waait';
import PleaseSignIn from '../components/PleaseSignIn';
import { MockedProvider } from 'react-apollo/test-utils';
import { fakeUser } from '../lib/testUtils';
-import { CURRENT_USER_QUERY } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
const notSignedInMocks = [
{
diff --git a/frontend/__tests__/RemoveFromCart.test.js b/frontend/__tests__/RemoveFromCart.test.js
index 581e815..34229a5 100644
--- a/frontend/__tests__/RemoveFromCart.test.js
+++ b/frontend/__tests__/RemoveFromCart.test.js
@@ -4,9 +4,9 @@ import toJSON from 'enzyme-to-json';
import { ApolloConsumer } from 'react-apollo';
import { MockedProvider } from 'react-apollo/test-utils';
import wait from 'waait';
-import RemoveFromCart from '../components/RemoveFromCart';
+import RemoveFromCart, { REMOVE_FROM_CART_MUTATION } from '../components/RemoveFromCart';
import { fakeCartItem, fakeUser } from '../lib/testUtils';
-import { CURRENT_USER_QUERY, REMOVE_FROM_CART_MUTATION } from '../queries/queries.graphql';
+import { CURRENT_USER_QUERY } from '../components/User';
const mocks = [
{
diff --git a/frontend/__tests__/ResetRequest.test.js b/frontend/__tests__/ResetRequest.test.js
index 7e9a7c2..22a9508 100644
--- a/frontend/__tests__/ResetRequest.test.js
+++ b/frontend/__tests__/ResetRequest.test.js
@@ -1,11 +1,8 @@
-import React from 'react';
import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
-import ResetRequest from '../components/ResetRequest';
import { MockedProvider } from 'react-apollo/test-utils';
import wait from 'waait';
-import { fakeItem } from '../lib/testUtils';
-import { REQUEST_RESET_MUTATION, RESET_MUTATION } from '../queries/queries.graphql';
+import ResetRequest, { REQUEST_RESET_MUTATION } from '../components/ResetRequest';
const mocks = [
{
@@ -46,50 +43,12 @@ describe('<ResetRequest/>', () => {
});
// submit the form
- wrapper.find('form').simulate('submit');
+ const form = wrapper.find('form');
+ console.log(form);
+ form.simulate('submit');
await wait();
wrapper.update();
expect(wrapper.find('p').text()).toContain('Success! Check Your Email!');
});
-
- xit('displays an error', async () => {
- const errorMocks = [
- {
- request: {
- query: REQUEST_RESET_MUTATION,
- variables: {
- email: 'wesbos@gmail.com',
- },
- },
- error: {
- message: 'Shit',
- },
- },
- ];
- const wrapper = mount(
- <MockedProvider mocks={errorMocks}>
- <ResetRequest />
- </MockedProvider>
- );
-
- wrapper.find('input').simulate('change', {
- target: { value: 'wesbos@gmail.com' },
- });
-
- try {
- wrapper.find('form').simulate('submit');
- await wait();
- } catch (e) {
- console.log('CAUGHT');
- console.log(e);
- }
- // expect(async () => {
- // }).toThrow();
-
- // wrapper.find('form').simulate('submit');
- wrapper.update();
- console.log(wrapper.debug());
- // expect(wrapper.find('p').text()).toContain('Success! Check Your Email!');
- });
});
diff --git a/frontend/__tests__/Signup.test.js b/frontend/__tests__/Signup.test.js
index 018f9b9..2a668a6 100644
--- a/frontend/__tests__/Signup.test.js
+++ b/frontend/__tests__/Signup.test.js
@@ -2,10 +2,11 @@ import React from 'react';
import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
import wait from 'waait';
-import Signup from '../components/Signup';
+import { ApolloConsumer } from 'react-apollo';
import { MockedProvider } from 'react-apollo/test-utils';
-import { LocalStorageMock, fakeItem, fakeUser, fakeCartItem } from '../lib/testUtils';
-import { SIGNUP_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql';
+import Signup, { SIGNUP_MUTATION } from '../components/Signup';
+import { fakeUser } from '../lib/testUtils';
+import { CURRENT_USER_QUERY } from '../components/User';
function type(wrapper, name, value) {
wrapper.find(`input[name="${name}"]`).simulate('change', {
@@ -29,14 +30,10 @@ const mocks = [
result: {
data: {
signup: {
- __typename: 'AuthPayload',
- token: 'tok123',
- user: {
- __typename: 'User',
- id: 'abc123',
- email: me.email,
- name: me.name,
- },
+ __typename: 'User',
+ id: 'abc123',
+ email: me.email,
+ name: me.name,
},
},
},
@@ -56,11 +53,6 @@ const mocks = [
];
describe('<Signup/>', () => {
- beforeAll(() => {
- // mock localStorage
- global.localStorage = new LocalStorageMock();
- });
-
it('renders and matches snapshot', () => {
const wrapper = mount(
<MockedProvider>
@@ -71,9 +63,15 @@ describe('<Signup/>', () => {
});
it('calls mutation with correct data', async () => {
+ let apolloClient;
const wrapper = mount(
<MockedProvider mocks={mocks}>
- <Signup />
+ <ApolloConsumer>
+ {client => {
+ apolloClient = client;
+ return <Signup />;
+ }}
+ </ApolloConsumer>
</MockedProvider>
);
@@ -87,7 +85,7 @@ describe('<Signup/>', () => {
wrapper.update();
wrapper.find('form').simulate('submit');
- await wait(5);
- expect(localStorage.getItem('token')).toBe('tok123');
+ const user = await apolloClient.query({ query: CURRENT_USER_QUERY });
+ expect(user.data.me).toMatchObject(me);
});
});
diff --git a/frontend/__tests__/SingleItem.test.js b/frontend/__tests__/SingleItem.test.js
index e99facf..aeb8554 100644
--- a/frontend/__tests__/SingleItem.test.js
+++ b/frontend/__tests__/SingleItem.test.js
@@ -2,10 +2,10 @@ import React from 'react';
import { mount } from 'enzyme';
import wait from 'waait';
import toJSON from 'enzyme-to-json';
-import SingleItem from '../components/SingleItem';
-import { SINGLE_ITEM_QUERY } from '../queries/queries.graphql';
+import SingleItem, { SINGLE_ITEM_QUERY } from '../components/SingleItem';
import { MockedProvider } from 'react-apollo/test-utils';
-import { fakeItem } from '../lib/testUtils';
+import { fakeItem, fakeUser } from '../lib/testUtils';
+import { CURRENT_USER_QUERY } from '../components/User';
const data = {
items: [fakeItem()],
@@ -16,9 +16,12 @@ describe('<SingleItem/>', () => {
const mocks = [
{
request: { query: SINGLE_ITEM_QUERY, variables: { id: '123' } },
- delay: 50,
result: { data },
},
+ {
+ request: { query: CURRENT_USER_QUERY },
+ result: { data: { me: fakeUser() } },
+ },
];
const wrapper = mount(
<MockedProvider mocks={mocks}>
@@ -32,9 +35,9 @@ describe('<SingleItem/>', () => {
await wait(55);
wrapper.update();
// Grab the piece we want
- const Item = wrapper.find('[data-test="SingleItem"]');
- // snapshot it!
- expect(toJSON(Item)).toMatchSnapshot();
+ 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 () => {
diff --git a/frontend/__tests__/TakeMyMoney.test.js b/frontend/__tests__/TakeMyMoney.test.js
index f2d0ca7..1c41410 100644
--- a/frontend/__tests__/TakeMyMoney.test.js
+++ b/frontend/__tests__/TakeMyMoney.test.js
@@ -1,13 +1,12 @@
-import React from 'react';
-import { shallow, mount } from 'enzyme';
+import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
import NProgress from 'nprogress';
-import TakeMyMoney from '../components/TakeMyMoney';
import Router from 'next/router';
import wait from 'waait';
import { MockedProvider } from 'react-apollo/test-utils';
-import { fakeItem, fakeUser, fakeCartItem } from '../lib/testUtils';
-import { CREATE_ITEM_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql';
+import TakeMyMoney from '../components/TakeMyMoney';
+import { fakeUser, fakeCartItem } from '../lib/testUtils';
+import { CURRENT_USER_QUERY } from '../components/User';
Router.router = { push() {} };
@@ -40,9 +39,7 @@ describe('<TakeMyMoney />', () => {
});
it('creates an order onToken', async () => {
- const createOrderSpy = jest
- .fn()
- .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } });
+ const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } });
const wrapper = mount(
<MockedProvider mocks={mocks}>
@@ -66,9 +63,7 @@ describe('<TakeMyMoney />', () => {
wrapper.update();
NProgress.start = jest.fn();
- const createOrderSpy = jest
- .fn()
- .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } });
+ const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } });
const component = wrapper.find('TakeMyMoney');
component.instance().onToken({ id: 'abc123' }, createOrderSpy);
wrapper.find('button').simulate('click');
@@ -87,9 +82,7 @@ describe('<TakeMyMoney />', () => {
// Spy on Router Push
Router.router.push = jest.fn();
- const createOrderSpy = jest
- .fn()
- .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } });
+ const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } });
const component = wrapper.find('TakeMyMoney');
component.instance().onToken({ id: 'abc123' }, createOrderSpy);
diff --git a/frontend/__tests__/__snapshots__/Signup.test.js.snap b/frontend/__tests__/__snapshots__/Signup.test.js.snap
index 536c1d8..b3c057e 100644
--- a/frontend/__tests__/__snapshots__/Signup.test.js.snap
+++ b/frontend/__tests__/__snapshots__/Signup.test.js.snap
@@ -3,6 +3,7 @@
exports[`<Signup/> renders and matches snapshot 1`] = `
<form
className="sc-bdVaJa LHejR"
+ method="post"
onSubmit={[Function]}
>
<fieldset
@@ -24,7 +25,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = `
onChange={[Function]}
placeholder="email"
type="text"
- value="wesbos@gmail.com"
+ value=""
/>
</label>
<label
@@ -36,7 +37,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = `
onChange={[Function]}
placeholder="name"
type="text"
- value="Wes Bos"
+ value=""
/>
</label>
<label
@@ -50,7 +51,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = `
onChange={[Function]}
placeholder="password"
type="password"
- value="wes"
+ value=""
/>
</label>
<button
diff --git a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
index 0969d73..28e9174 100644
--- a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
+++ b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
@@ -12,84 +12,21 @@ exports[`<SingleItem/> Errors with a not found Item 1`] = `
`;
exports[`<SingleItem/> Renders with Proper Data 1`] = `
-Array [
- <styled.div
- data-test="SingleItem"
- >
- <div
- className="sc-bwzfXH dFvSZo"
- data-test="SingleItem"
- >
- <img
- alt="dogs are best"
- src="dog.jpg"
- />
- <div
- className="details"
- >
- <h2>
- Viewing
- dogs are best
- </h2>
- <p>
- dogs
- </p>
- <Link
- href={
- Object {
- "pathname": "/update",
- "query": Object {
- "id": "123",
- },
- }
- }
- >
- <a
- href="/update?id=123"
- onClick={[Function]}
- >
- Edit ✏️
- </a>
- </Link>
- </div>
- </div>
- </styled.div>,
- <div
- className="sc-bwzfXH dFvSZo"
- data-test="SingleItem"
- >
- <img
- alt="dogs are best"
- src="dog.jpg"
- />
- <div
- className="details"
- >
- <h2>
- Viewing
- dogs are best
- </h2>
- <p>
- dogs
- </p>
- <Link
- href={
- Object {
- "pathname": "/update",
- "query": Object {
- "id": "123",
- },
- }
- }
- >
- <a
- href="/update?id=123"
- onClick={[Function]}
- >
- Edit ✏️
- </a>
- </Link>
- </div>
- </div>,
-]
+<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>
`;