From 2d145b026cfdf54a63bef0b9d6324b6785390307 Mon Sep 17 00:00:00 2001 From: Wes Bos Date: Fri, 14 Sep 2018 12:18:12 -0400 Subject: move finished folder --- .../frontend/__tests__/AddToCart.test.js | 97 + .../frontend/__tests__/Cart.test.js | 39 + .../frontend/__tests__/CartCount.test.js | 21 + .../frontend/__tests__/CreateItem.test.js | 112 + .../frontend/__tests__/Item.test.js | 39 + .../frontend/__tests__/Nav.test.js | 76 + .../frontend/__tests__/Order.test.js | 27 + .../frontend/__tests__/Pagination.test.js | 89 + .../frontend/__tests__/PleaseSignIn.test.js | 51 + .../frontend/__tests__/RemoveFromCart.test.js | 67 + .../frontend/__tests__/RequestReset.test.js | 46 + .../frontend/__tests__/Signup.test.js | 80 + .../frontend/__tests__/SingleItem.test.js | 57 + .../frontend/__tests__/TakeMyMoney.test.js | 98 + .../__tests__/__snapshots__/AddToCart.test.js.snap | 11 + .../__tests__/__snapshots__/Cart.test.js.snap | 32 + .../__tests__/__snapshots__/CartCount.test.js.snap | 79 + .../__snapshots__/CreateItem.test.js.snap | 77 + .../__tests__/__snapshots__/Item.test.js.snap | 58 + .../__tests__/__snapshots__/Nav.test.js.snap | 37 + .../__tests__/__snapshots__/Order.test.js.snap | 118 + .../__snapshots__/Pagination.test.js.snap | 67 + .../__snapshots__/RemoveFromCart.test.js.snap | 12 + .../__snapshots__/RequestReset.test.js.snap | 39 + .../__tests__/__snapshots__/Signup.test.js.snap | 62 + .../__snapshots__/SingleItem.test.js.snap | 32 + .../__snapshots__/TakeMyMoney.test.js.snap | 67 + .../frontend/__tests__/formatMoney.test.js | 23 + .../frontend/__tests__/mocking.test.js | 36 + .../frontend/__tests__/sample.test.js | 19 + .../frontend/components/AddToCart.js | 36 + finished-application/frontend/components/Cart.js | 66 + .../frontend/components/CartCount.js | 60 + .../frontend/components/CartItem.js | 53 + .../frontend/components/CreateItem.js | 142 + .../frontend/components/DeleteItem.js | 50 + .../frontend/components/ErrorMessage.js | 51 + finished-application/frontend/components/Header.js | 75 + finished-application/frontend/components/Item.js | 50 + finished-application/frontend/components/Items.js | 61 + finished-application/frontend/components/Meta.js | 13 + finished-application/frontend/components/Nav.js | 49 + finished-application/frontend/components/Order.js | 92 + .../frontend/components/OrderList.js | 80 + finished-application/frontend/components/Page.js | 68 + .../frontend/components/Pagination.js | 67 + .../frontend/components/Permissions.js | 131 + .../frontend/components/PleaseSignIn.js | 22 + .../frontend/components/RemoveFromCart.js | 71 + .../frontend/components/RequestReset.js | 60 + finished-application/frontend/components/Reset.js | 84 + finished-application/frontend/components/Search.js | 94 + finished-application/frontend/components/Signin.js | 76 + .../frontend/components/Signout.js | 19 + finished-application/frontend/components/Signup.js | 87 + .../frontend/components/SingleItem.js | 70 + .../frontend/components/TakeMyMoney.js | 79 + .../frontend/components/UpdateItem.js | 117 + finished-application/frontend/components/User.js | 41 + .../frontend/components/styles/CartStyles.js | 47 + .../frontend/components/styles/CloseButton.js | 13 + .../frontend/components/styles/DropDown.js | 47 + .../frontend/components/styles/Form.js | 71 + .../frontend/components/styles/ItemStyles.js | 39 + .../frontend/components/styles/NavStyles.js | 66 + .../frontend/components/styles/OrderItemStyles.js | 44 + .../frontend/components/styles/OrderStyles.js | 37 + .../frontend/components/styles/PaginationStyles.js | 27 + .../frontend/components/styles/PriceTag.js | 17 + .../frontend/components/styles/SickButton.js | 20 + .../frontend/components/styles/Supreme.js | 13 + .../frontend/components/styles/Table.js | 35 + .../frontend/components/styles/Title.js | 20 + finished-application/frontend/config.js | 4 + finished-application/frontend/jest.setup.js | 4 + .../frontend/lib/calcTotalPrice.js | 6 + finished-application/frontend/lib/formatMoney.js | 11 + finished-application/frontend/lib/testUtils.js | 79 + finished-application/frontend/lib/withData.js | 42 + finished-application/frontend/notes.md | 36 + finished-application/frontend/package-lock.json | 9474 ++++++++++++++++++++ finished-application/frontend/package.json | 114 + finished-application/frontend/pages/.gitkeep | 0 finished-application/frontend/pages/_app.js | 31 + finished-application/frontend/pages/_document.js | 23 + finished-application/frontend/pages/index.js | 9 + finished-application/frontend/pages/item.js | 9 + finished-application/frontend/pages/items.js | 3 + finished-application/frontend/pages/order.js | 12 + finished-application/frontend/pages/orders.js | 12 + finished-application/frontend/pages/permissions.js | 12 + finished-application/frontend/pages/reset.js | 10 + finished-application/frontend/pages/sell.js | 12 + finished-application/frontend/pages/signup.js | 20 + finished-application/frontend/pages/update.js | 9 + finished-application/frontend/static/favicon.png | Bin 0 -> 5122 bytes finished-application/frontend/static/nprogress.css | 72 + .../static/radnikanext-medium-webfont.woff2 | Bin 0 -> 20012 bytes 98 files changed, 14132 insertions(+) create mode 100644 finished-application/frontend/__tests__/AddToCart.test.js create mode 100644 finished-application/frontend/__tests__/Cart.test.js create mode 100644 finished-application/frontend/__tests__/CartCount.test.js create mode 100644 finished-application/frontend/__tests__/CreateItem.test.js create mode 100644 finished-application/frontend/__tests__/Item.test.js create mode 100644 finished-application/frontend/__tests__/Nav.test.js create mode 100644 finished-application/frontend/__tests__/Order.test.js create mode 100644 finished-application/frontend/__tests__/Pagination.test.js create mode 100644 finished-application/frontend/__tests__/PleaseSignIn.test.js create mode 100644 finished-application/frontend/__tests__/RemoveFromCart.test.js create mode 100644 finished-application/frontend/__tests__/RequestReset.test.js create mode 100644 finished-application/frontend/__tests__/Signup.test.js create mode 100644 finished-application/frontend/__tests__/SingleItem.test.js create mode 100644 finished-application/frontend/__tests__/TakeMyMoney.test.js create mode 100644 finished-application/frontend/__tests__/__snapshots__/AddToCart.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Cart.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/CartCount.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/CreateItem.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Item.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Nav.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Order.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Pagination.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/RemoveFromCart.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/RequestReset.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/Signup.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/SingleItem.test.js.snap create mode 100644 finished-application/frontend/__tests__/__snapshots__/TakeMyMoney.test.js.snap create mode 100644 finished-application/frontend/__tests__/formatMoney.test.js create mode 100644 finished-application/frontend/__tests__/mocking.test.js create mode 100644 finished-application/frontend/__tests__/sample.test.js create mode 100644 finished-application/frontend/components/AddToCart.js create mode 100644 finished-application/frontend/components/Cart.js create mode 100644 finished-application/frontend/components/CartCount.js create mode 100644 finished-application/frontend/components/CartItem.js create mode 100644 finished-application/frontend/components/CreateItem.js create mode 100644 finished-application/frontend/components/DeleteItem.js create mode 100644 finished-application/frontend/components/ErrorMessage.js create mode 100644 finished-application/frontend/components/Header.js create mode 100644 finished-application/frontend/components/Item.js create mode 100644 finished-application/frontend/components/Items.js create mode 100644 finished-application/frontend/components/Meta.js create mode 100644 finished-application/frontend/components/Nav.js create mode 100644 finished-application/frontend/components/Order.js create mode 100644 finished-application/frontend/components/OrderList.js create mode 100644 finished-application/frontend/components/Page.js create mode 100644 finished-application/frontend/components/Pagination.js create mode 100644 finished-application/frontend/components/Permissions.js create mode 100644 finished-application/frontend/components/PleaseSignIn.js create mode 100644 finished-application/frontend/components/RemoveFromCart.js create mode 100644 finished-application/frontend/components/RequestReset.js create mode 100644 finished-application/frontend/components/Reset.js create mode 100644 finished-application/frontend/components/Search.js create mode 100644 finished-application/frontend/components/Signin.js create mode 100644 finished-application/frontend/components/Signout.js create mode 100644 finished-application/frontend/components/Signup.js create mode 100644 finished-application/frontend/components/SingleItem.js create mode 100644 finished-application/frontend/components/TakeMyMoney.js create mode 100644 finished-application/frontend/components/UpdateItem.js create mode 100644 finished-application/frontend/components/User.js create mode 100644 finished-application/frontend/components/styles/CartStyles.js create mode 100644 finished-application/frontend/components/styles/CloseButton.js create mode 100644 finished-application/frontend/components/styles/DropDown.js create mode 100644 finished-application/frontend/components/styles/Form.js create mode 100644 finished-application/frontend/components/styles/ItemStyles.js create mode 100644 finished-application/frontend/components/styles/NavStyles.js create mode 100644 finished-application/frontend/components/styles/OrderItemStyles.js create mode 100644 finished-application/frontend/components/styles/OrderStyles.js create mode 100644 finished-application/frontend/components/styles/PaginationStyles.js create mode 100644 finished-application/frontend/components/styles/PriceTag.js create mode 100644 finished-application/frontend/components/styles/SickButton.js create mode 100644 finished-application/frontend/components/styles/Supreme.js create mode 100644 finished-application/frontend/components/styles/Table.js create mode 100644 finished-application/frontend/components/styles/Title.js create mode 100644 finished-application/frontend/config.js create mode 100644 finished-application/frontend/jest.setup.js create mode 100644 finished-application/frontend/lib/calcTotalPrice.js create mode 100644 finished-application/frontend/lib/formatMoney.js create mode 100644 finished-application/frontend/lib/testUtils.js create mode 100644 finished-application/frontend/lib/withData.js create mode 100644 finished-application/frontend/notes.md create mode 100644 finished-application/frontend/package-lock.json create mode 100644 finished-application/frontend/package.json create mode 100644 finished-application/frontend/pages/.gitkeep create mode 100644 finished-application/frontend/pages/_app.js create mode 100644 finished-application/frontend/pages/_document.js create mode 100644 finished-application/frontend/pages/index.js create mode 100644 finished-application/frontend/pages/item.js create mode 100644 finished-application/frontend/pages/items.js create mode 100644 finished-application/frontend/pages/order.js create mode 100644 finished-application/frontend/pages/orders.js create mode 100644 finished-application/frontend/pages/permissions.js create mode 100644 finished-application/frontend/pages/reset.js create mode 100644 finished-application/frontend/pages/sell.js create mode 100644 finished-application/frontend/pages/signup.js create mode 100644 finished-application/frontend/pages/update.js create mode 100644 finished-application/frontend/static/favicon.png create mode 100644 finished-application/frontend/static/nprogress.css create mode 100755 finished-application/frontend/static/radnikanext-medium-webfont.woff2 (limited to 'finished-application/frontend') diff --git a/finished-application/frontend/__tests__/AddToCart.test.js b/finished-application/frontend/__tests__/AddToCart.test.js new file mode 100644 index 0000000..cfc2e3e --- /dev/null +++ b/finished-application/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('', () => { + it('renders and matches the snap shot', async () => { + const wrapper = mount( + + + + ); + await wait(); + wrapper.update(); + expect(toJSON(wrapper.find('button'))).toMatchSnapshot(); + }); + + it('adds an item to cart when clicked', async () => { + let apolloClient; + const wrapper = mount( + + + {client => { + apolloClient = client; + return ; + }} + + + ); + 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( + + + + ); + 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/finished-application/frontend/__tests__/Cart.test.js b/finished-application/frontend/__tests__/Cart.test.js new file mode 100644 index 0000000..b8afc88 --- /dev/null +++ b/finished-application/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('', () => { + it('renders and matches snappy', async () => { + const wrapper = mount( + + + + ); + await wait(); + wrapper.update(); + expect(toJSON(wrapper.find('header'))).toMatchSnapshot(); + expect(wrapper.find('CartItem')).toHaveLength(1); + }); +}); diff --git a/finished-application/frontend/__tests__/CartCount.test.js b/finished-application/frontend/__tests__/CartCount.test.js new file mode 100644 index 0000000..8ace3da --- /dev/null +++ b/finished-application/frontend/__tests__/CartCount.test.js @@ -0,0 +1,21 @@ +import { shallow, mount } from 'enzyme'; +import toJSON from 'enzyme-to-json'; +import CartCount from '../components/CartCount'; + +describe('', () => { + it('renders', () => { + shallow(); + }); + + it('matches the snapshot', () => { + const wrapper = shallow(); + expect(toJSON(wrapper)).toMatchSnapshot(); + }); + + it('updates via props', () => { + const wrapper = shallow(); + expect(toJSON(wrapper)).toMatchSnapshot(); + wrapper.setProps({ count: 10 }); + expect(toJSON(wrapper)).toMatchSnapshot(); + }); +}); diff --git a/finished-application/frontend/__tests__/CreateItem.test.js b/finished-application/frontend/__tests__/CreateItem.test.js new file mode 100644 index 0000000..6e88d94 --- /dev/null +++ b/finished-application/frontend/__tests__/CreateItem.test.js @@ -0,0 +1,112 @@ +import { mount } from 'enzyme'; +import wait from 'waait'; +import toJSON from 'enzyme-to-json'; +import Router from 'next/router'; +import { MockedProvider } from 'react-apollo/test-utils'; +import CreateItem, { CREATE_ITEM_MUTATION } from '../components/CreateItem'; +import { fakeItem } from '../lib/testUtils'; + +const dogImage = 'https://dog.com/dog.jpg'; + +// mock the global fetch API +global.fetch = jest.fn().mockResolvedValue({ + json: () => ({ + secure_url: dogImage, + eager: [{ secure_url: dogImage }], + }), +}); + +describe('', () => { + it('renders and matches snapshot', async () => { + const wrapper = mount( + + + + ); + const form = wrapper.find('form[data-test="form"]'); + expect(toJSON(form)).toMatchSnapshot(); + }); + + it('uploads a file when changed', async () => { + const wrapper = mount( + + + + ); + const input = wrapper.find('input[type="file"]'); + input.simulate('change', { target: { files: ['fakedog.jpg'] } }); + await wait(); + const component = wrapper.find('CreateItem').instance(); + expect(component.state.image).toEqual(dogImage); + expect(component.state.largeImage).toEqual(dogImage); + expect(global.fetch).toHaveBeenCalled(); + global.fetch.mockReset(); + }); + + it('handles state updating', async () => { + const wrapper = mount( + + + + ); + wrapper.find('#title').simulate('change', { target: { value: 'Testing', name: 'title' } }); + wrapper + .find('#price') + .simulate('change', { target: { value: 50000, name: 'price', type: 'number' } }); + wrapper + .find('#description') + .simulate('change', { target: { value: 'This is a really nice item', name: 'description' } }); + + expect(wrapper.find('CreateItem').instance().state).toMatchObject({ + title: 'Testing', + price: 50000, + description: 'This is a really nice item', + }); + }); + it('creates an item when the form is submitted', async () => { + const item = fakeItem(); + const mocks = [ + { + request: { + query: CREATE_ITEM_MUTATION, + variables: { + title: item.title, + description: item.description, + image: '', + largeImage: '', + price: item.price, + }, + }, + result: { + data: { + createItem: { + ...fakeItem, + id: 'abc123', + __typename: 'Item', + }, + }, + }, + }, + ]; + + const wrapper = mount( + + + + ); + // simulate someone filling out the form + wrapper.find('#title').simulate('change', { target: { value: item.title, name: 'title' } }); + wrapper + .find('#price') + .simulate('change', { target: { value: item.price, name: 'price', type: 'number' } }); + wrapper + .find('#description') + .simulate('change', { target: { value: item.description, name: 'description' } }); + // mock the router + Router.router = { push: jest.fn() }; + wrapper.find('form').simulate('submit'); + await wait(50); + expect(Router.router.push).toHaveBeenCalled(); + expect(Router.router.push).toHaveBeenCalledWith({ pathname: '/item', query: { id: 'abc123' } }); + }); +}); diff --git a/finished-application/frontend/__tests__/Item.test.js b/finished-application/frontend/__tests__/Item.test.js new file mode 100644 index 0000000..692b913 --- /dev/null +++ b/finished-application/frontend/__tests__/Item.test.js @@ -0,0 +1,39 @@ +import ItemComponent from '../components/Item'; +import { shallow, mount } from 'enzyme'; +import toJSON from 'enzyme-to-json'; + +const fakeItem = { + id: 'ABC123', + title: 'A Cool Item', + price: 4000, + description: 'This item is really cool!', + image: 'dog.jpg', + largeImage: 'largedog.jpg', +}; + +describe('', () => { + it('renders and matches the snapshot', () => { + const wrapper = shallow(); + expect(toJSON(wrapper)).toMatchSnapshot(); + }); + // it('renders the image properly', () => { + // const wrapper = shallow(); + // const img = wrapper.find('img'); + // expect(img.props().src).toBe(fakeItem.image); + // expect(img.props().alt).toBe(fakeItem.title); + // }); + // it('renders the pricetag and title', () => { + // const wrapper = shallow(); + // const PriceTag = wrapper.find('PriceTag'); + // expect(PriceTag.children().text()).toBe('$50'); + // expect(wrapper.find('Title a').text()).toBe(fakeItem.title); + // }); + // it('renders out the buttons properly', () => { + // const wrapper = shallow(); + // const buttonList = wrapper.find('.buttonList'); + // expect(buttonList.children()).toHaveLength(3); + // expect(buttonList.find('Link')).toHaveLength(1); + // expect(buttonList.find('AddToCart').exists()).toBe(true); + // expect(buttonList.find('DeleteItem').exists()).toBe(true); + // }); +}); diff --git a/finished-application/frontend/__tests__/Nav.test.js b/finished-application/frontend/__tests__/Nav.test.js new file mode 100644 index 0000000..d30cb39 --- /dev/null +++ b/finished-application/frontend/__tests__/Nav.test.js @@ -0,0 +1,76 @@ +import { mount } from 'enzyme'; +import wait from 'waait'; +import toJSON from 'enzyme-to-json'; +import Nav from '../components/Nav'; +import { CURRENT_USER_QUERY } from '../components/User'; +import { MockedProvider } from 'react-apollo/test-utils'; +import { fakeUser, fakeCartItem } from '../lib/testUtils'; + +const notSignedInMocks = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { data: { me: null } }, + }, +]; + +const signedInMocks = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { data: { me: fakeUser() } }, + }, +]; + +const signedInMocksWithCartItems = [ + { + request: { query: CURRENT_USER_QUERY }, + result: { + data: { + me: { + ...fakeUser(), + cart: [fakeCartItem(), fakeCartItem(), fakeCartItem()], + }, + }, + }, + }, +]; + +describe('