diff options
Diffstat (limited to 'stepped-solutions/65/frontend/__tests__')
3 files changed, 203 insertions, 0 deletions
diff --git a/stepped-solutions/65/frontend/__tests__/AddToCart.test.js b/stepped-solutions/65/frontend/__tests__/AddToCart.test.js new file mode 100755 index 0000000..cfc2e3e --- /dev/null +++ b/stepped-solutions/65/frontend/__tests__/AddToCart.test.js @@ -0,0 +1,97 @@ +import { mount } from 'enzyme'; +import wait from 'waait'; +import toJSON from 'enzyme-to-json'; +import { MockedProvider } from 'react-apollo/test-utils'; +import { ApolloConsumer } from 'react-apollo'; +import AddToCart, { ADD_TO_CART_MUTATION } from '../components/AddToCart'; +import { CURRENT_USER_QUERY } from '../components/User'; +import { fakeUser, fakeCartItem } from '../lib/testUtils'; + +const mocks = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { + data: { + me: { + ...fakeUser(), + cart: [], + }, + }, + }, + }, + { + request: { query: CURRENT_USER_QUERY }, + result: { + data: { + me: { + ...fakeUser(), + cart: [fakeCartItem()], + }, + }, + }, + }, + { + request: { query: ADD_TO_CART_MUTATION, variables: { id: 'abc123' } }, + result: { + data: { + addToCart: { + ...fakeCartItem(), + quantity: 1, + }, + }, + }, + }, +]; + +describe('<AddToCart/>', () => { + it('renders and matches the snap shot', async () => { + const wrapper = mount( + <MockedProvider mocks={mocks}> + <AddToCart id="abc123" /> + </MockedProvider> + ); + await wait(); + wrapper.update(); + expect(toJSON(wrapper.find('button'))).toMatchSnapshot(); + }); + + it('adds an item to cart when clicked', async () => { + let apolloClient; + const wrapper = mount( + <MockedProvider mocks={mocks}> + <ApolloConsumer> + {client => { + apolloClient = client; + return <AddToCart id="abc123" />; + }} + </ApolloConsumer> + </MockedProvider> + ); + await wait(); + wrapper.update(); + const { data: { me } } = await apolloClient.query({ query: CURRENT_USER_QUERY }); + // console.log(me); + expect(me.cart).toHaveLength(0); + // add an item to the cart + wrapper.find('button').simulate('click'); + await wait(); + // check if the item is in the cart + const { data: { me: me2 } } = await apolloClient.query({ query: CURRENT_USER_QUERY }); + expect(me2.cart).toHaveLength(1); + expect(me2.cart[0].id).toBe('omg123'); + expect(me2.cart[0].quantity).toBe(3); + }); + + it('changes from add 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/stepped-solutions/65/frontend/__tests__/Cart.test.js b/stepped-solutions/65/frontend/__tests__/Cart.test.js new file mode 100755 index 0000000..b8afc88 --- /dev/null +++ b/stepped-solutions/65/frontend/__tests__/Cart.test.js @@ -0,0 +1,39 @@ +import { mount } from 'enzyme'; +import wait from 'waait'; +import toJSON from 'enzyme-to-json'; +import { MockedProvider } from 'react-apollo/test-utils'; +import Cart, { LOCAL_STATE_QUERY } from '../components/Cart'; +import { CURRENT_USER_QUERY } from '../components/User'; +import { fakeUser, fakeCartItem } from '../lib/testUtils'; + +const mocks = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { + data: { + me: { + ...fakeUser(), + cart: [fakeCartItem()], + }, + }, + }, + }, + { + request: { query: LOCAL_STATE_QUERY }, + result: { data: { cartOpen: true } }, + }, +]; + +describe('<Cart/>', () => { + it('renders and matches snappy', async () => { + const wrapper = mount( + <MockedProvider mocks={mocks}> + <Cart /> + </MockedProvider> + ); + await wait(); + wrapper.update(); + expect(toJSON(wrapper.find('header'))).toMatchSnapshot(); + expect(wrapper.find('CartItem')).toHaveLength(1); + }); +}); diff --git a/stepped-solutions/65/frontend/__tests__/RemoveFromCart.test.js b/stepped-solutions/65/frontend/__tests__/RemoveFromCart.test.js new file mode 100755 index 0000000..faacc91 --- /dev/null +++ b/stepped-solutions/65/frontend/__tests__/RemoveFromCart.test.js @@ -0,0 +1,67 @@ +import { mount } from 'enzyme'; +import wait from 'waait'; +import toJSON from 'enzyme-to-json'; +import { MockedProvider } from 'react-apollo/test-utils'; +import { ApolloConsumer } from 'react-apollo'; +import RemoveFromCart, { REMOVE_FROM_CART_MUTATION } from '../components/RemoveFromCart'; +import { CURRENT_USER_QUERY } from '../components/User'; +import { fakeUser, fakeCartItem } from '../lib/testUtils'; + +global.alert = console.log; + +const mocks = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { + data: { + me: { + ...fakeUser(), + cart: [fakeCartItem({ id: 'abc123' })], + }, + }, + }, + }, + { + request: { query: REMOVE_FROM_CART_MUTATION, variables: { id: 'abc123' } }, + result: { + data: { + removeFromCart: { + __typename: 'CartItem', + id: 'abc123', + }, + }, + }, + }, +]; + +describe('<RemoveFromCart/>', () => { + it('renders and matches snapshot', async () => { + const wrapper = mount( + <MockedProvider> + <RemoveFromCart id="abc123" /> + </MockedProvider> + ); + expect(toJSON(wrapper.find('button'))).toMatchSnapshot(); + }); + + it('removes the item from cart', async () => { + let apolloClient; + const wrapper = mount( + <MockedProvider mocks={mocks}> + <ApolloConsumer> + {client => { + apolloClient = client; + return <RemoveFromCart id="abc123" />; + }} + </ApolloConsumer> + </MockedProvider> + ); + const res = await apolloClient.query({ query: CURRENT_USER_QUERY }); + expect(res.data.me.cart).toHaveLength(1); + expect(res.data.me.cart[0].item.price).toBe(5000); + wrapper.find('button').simulate('click'); + await wait(); + const res2 = await apolloClient.query({ query: CURRENT_USER_QUERY }); + expect(res2.data.me.cart).toHaveLength(0); + }); +}); |