summaryrefslogtreecommitdiffstats
path: root/frontend/__tests__
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/__tests__')
-rw-r--r--frontend/__tests__/PleaseSignIn.test.js10
-rw-r--r--frontend/__tests__/ResetRequest.test.js46
-rw-r--r--frontend/__tests__/SingleItem.test.js40
-rw-r--r--frontend/__tests__/__snapshots__/ResetRequest.test.js.snap230
-rw-r--r--frontend/__tests__/__snapshots__/SingleItem.test.js.snap97
-rw-r--r--frontend/__tests__/mockMang.js39
6 files changed, 370 insertions, 92 deletions
diff --git a/frontend/__tests__/PleaseSignIn.test.js b/frontend/__tests__/PleaseSignIn.test.js
new file mode 100644
index 0000000..8dc6124
--- /dev/null
+++ b/frontend/__tests__/PleaseSignIn.test.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import toJSON from 'enzyme-to-json';
+import PleaseSignIn from '../components/PleaseSignIn';
+
+describe('<PleaseSignIn />', () => {
+ it('works', () => {
+ console.log('heyy');
+ });
+});
diff --git a/frontend/__tests__/ResetRequest.test.js b/frontend/__tests__/ResetRequest.test.js
index bd8a934..6d8d99f 100644
--- a/frontend/__tests__/ResetRequest.test.js
+++ b/frontend/__tests__/ResetRequest.test.js
@@ -1,33 +1,39 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { mount } from 'enzyme';
import toJSON from 'enzyme-to-json';
-import { ResetRequest } from '../components/ResetRequest';
-
-const wait = amount => new Promise(resolve => setTimeout(resolve, amount));
+import { ApolloProvider } from 'react-apollo';
+import ResetRequest from '../components/ResetRequest';
+import mountOptions from './mockMang';
describe('<ResetRequest/>', () => {
- it('renders and matches snapshot', () => {
- const wrapper = shallow(<ResetRequest requestReset={() => {}} />);
- expect(toJSON(wrapper)).toMatchSnapshot();
+ it('renders and matches snapshot', async () => {
+ const wrapper = mount(<ResetRequest />, mountOptions);
+ const Form = wrapper.find("Form[data-test='ResetRequest']");
+ expect(toJSON(Form)).toMatchSnapshot();
});
- it('handles the reset request', async () => {
- const resetSpy = jest.fn(() => Promise.resolve({}));
- const wrapper = shallow(<ResetRequest requestReset={resetSpy} />);
+ it('calls the mutation', async () => {
+ const wrapper = mount(<ResetRequest />, mountOptions);
+ const mutation = wrapper.find('Mutation').instance();
const input = wrapper.find('input[name="email"]');
input.simulate('change', { target: { name: 'email', value: 'wesbos@gmail.com' } });
- wrapper.simulate('submit', { preventDefault() {} });
- expect(resetSpy).toHaveBeenCalledWith({ variables: { email: 'wesbos@gmail.com' } });
+ // Create a spy function on mutate
+ mutation.client.mutate = jest.fn();
+ mutation.forceUpdate();
+ wrapper.find('Form').simulate('submit');
+ expect(mutation.client.mutate.mock.calls[0][0].variables).toEqual({
+ email: 'wesbos@gmail.com',
+ });
+ expect(toJSON(wrapper)).toMatchSnapshot();
});
- it('displays errors', async () => {
- const resetSpy = jest.fn(() => Promise.resolve({ errors: [{ message: 'Error!!!' }] }));
- const wrapper = shallow(<ResetRequest requestReset={resetSpy} />);
- const input = wrapper.find('input[name="email"]');
- input.simulate('change', { target: { name: 'email', value: 'wesbos@gmail.com' } });
- wrapper.simulate('submit', { preventDefault() {} });
- await wait(0);
+ it('renders errors', () => {
+ const wrapper = mount(<ResetRequest />, mountOptions);
+ const mutation = wrapper.find('Mutation').instance();
+ mutation.setState({ error: { message: 'Shit!' } });
wrapper.update();
- expect(toJSON(wrapper)).toMatchSnapshot();
+ const error = wrapper.find('DisplayError');
+ expect(error).toHaveLength(1);
+ expect(toJSON(error)).toMatchSnapshot();
});
});
diff --git a/frontend/__tests__/SingleItem.test.js b/frontend/__tests__/SingleItem.test.js
index e39431d..313784e 100644
--- a/frontend/__tests__/SingleItem.test.js
+++ b/frontend/__tests__/SingleItem.test.js
@@ -1,23 +1,31 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, mount } from 'enzyme';
+import wait from 'waait';
import toJSON from 'enzyme-to-json';
-import { SingleItem } from '../components/SingleItem';
+import SingleItem from '../components/SingleItem';
+import { ApolloProvider } from 'react-apollo';
+import mockClient from './mockMang';
+import { SINGLE_ITEM_QUERY } from '../queries/queries';
-const wait = amount => new Promise(resolve => setTimeout(resolve, amount));
+describe('<SingleItem/>', () => {
+ it('Renders with Proper Data', async () => {
+ const wrapper = mount(
+ <ApolloProvider client={mockClient.client}>
+ <SingleItem id="123" />
+ </ApolloProvider>
+ );
+ await wait();
+ wrapper.update();
-const findItem = {
- items: [
- {
- largeImage: 'dog.jpg',
- title: 'Sneakers',
- description: 'A cool set of shoes',
- },
- ],
-};
+ const Item = wrapper.find('[data-test="SingleItem"]');
+ expect(toJSON(Item)).toMatchSnapshot();
+ });
-describe('<SingleItem/>', () => {
- it('renders', () => {
- const wrapper = shallow(<SingleItem findItem={findItem} />);
- expect(toJSON(wrapper)).toMatchSnapshot();
+ it('Errors with a not found Item', async () => {
+ const wrapper = mount(
+ <ApolloProvider client={mockClient.client}>
+ <SingleItem id="123" />
+ </ApolloProvider>
+ );
});
});
diff --git a/frontend/__tests__/__snapshots__/ResetRequest.test.js.snap b/frontend/__tests__/__snapshots__/ResetRequest.test.js.snap
index ef7e9f9..66c4ff1 100644
--- a/frontend/__tests__/__snapshots__/ResetRequest.test.js.snap
+++ b/frontend/__tests__/__snapshots__/ResetRequest.test.js.snap
@@ -1,54 +1,200 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`<ResetRequest/> displays errors 1`] = `
-<Form
- onSubmit={[Function]}
->
- <p
- key="0"
- >
- Error!!!
- </p>
- <label
- htmlFor="email"
- >
- Email
- <input
- name="email"
- onChange={[Function]}
- placeholder="email"
- type="text"
- value="wesbos@gmail.com"
- />
- </label>
- <button
- type="submit"
+exports[`<ResetRequest/> calls the mutation 1`] = `
+<ResetRequest>
+ <Mutation
+ mutation={
+ Object {
+ "definitions": Array [
+ Object {
+ "directives": Array [],
+ "kind": "OperationDefinition",
+ "name": Object {
+ "kind": "Name",
+ "value": "requestReset",
+ },
+ "operation": "mutation",
+ "selectionSet": Object {
+ "kind": "SelectionSet",
+ "selections": Array [
+ Object {
+ "alias": undefined,
+ "arguments": Array [
+ Object {
+ "kind": "Argument",
+ "name": Object {
+ "kind": "Name",
+ "value": "email",
+ },
+ "value": Object {
+ "kind": "Variable",
+ "name": Object {
+ "kind": "Name",
+ "value": "email",
+ },
+ },
+ },
+ ],
+ "directives": Array [],
+ "kind": "Field",
+ "name": Object {
+ "kind": "Name",
+ "value": "requestReset",
+ },
+ "selectionSet": Object {
+ "kind": "SelectionSet",
+ "selections": Array [
+ Object {
+ "alias": undefined,
+ "arguments": Array [],
+ "directives": Array [],
+ "kind": "Field",
+ "name": Object {
+ "kind": "Name",
+ "value": "id",
+ },
+ "selectionSet": undefined,
+ },
+ ],
+ },
+ },
+ ],
+ },
+ "variableDefinitions": Array [
+ Object {
+ "defaultValue": undefined,
+ "kind": "VariableDefinition",
+ "type": Object {
+ "kind": "NonNullType",
+ "type": Object {
+ "kind": "NamedType",
+ "name": Object {
+ "kind": "Name",
+ "value": "String",
+ },
+ },
+ },
+ "variable": Object {
+ "kind": "Variable",
+ "name": Object {
+ "kind": "Name",
+ "value": "email",
+ },
+ },
+ },
+ ],
+ },
+ ],
+ "kind": "Document",
+ "loc": Object {
+ "end": 97,
+ "start": 0,
+ },
+ }
+ }
+ variables={
+ Object {
+ "email": "wesbos@gmail.com",
+ }
+ }
>
- Request Reset!
- </button>
-</Form>
+ <Form
+ data-test="ResetRequest"
+ onSubmit={[Function]}
+ >
+ <form
+ className="sc-bdVaJa LHejR"
+ data-test="ResetRequest"
+ onSubmit={[Function]}
+ >
+ <DisplayError />
+ <fieldset
+ aria-busy={true}
+ disabled={true}
+ >
+ <label
+ htmlFor="email"
+ >
+ Email
+ <input
+ name="email"
+ onChange={[Function]}
+ placeholder="email"
+ type="text"
+ value="wesbos@gmail.com"
+ />
+ </label>
+ <button
+ type="submit"
+ >
+ Request Reset!
+ </button>
+ </fieldset>
+ </form>
+ </Form>
+ </Mutation>
+</ResetRequest>
`;
exports[`<ResetRequest/> renders and matches snapshot 1`] = `
<Form
+ data-test="ResetRequest"
onSubmit={[Function]}
>
- <label
- htmlFor="email"
- >
- Email
- <input
- name="email"
- onChange={[Function]}
- placeholder="email"
- type="text"
- value=""
- />
- </label>
- <button
- type="submit"
+ <form
+ className="sc-bdVaJa LHejR"
+ data-test="ResetRequest"
+ onSubmit={[Function]}
>
- Request Reset!
- </button>
+ <DisplayError />
+ <fieldset
+ aria-busy={false}
+ disabled={false}
+ >
+ <label
+ htmlFor="email"
+ >
+ Email
+ <input
+ name="email"
+ onChange={[Function]}
+ placeholder="email"
+ type="text"
+ value=""
+ />
+ </label>
+ <button
+ type="submit"
+ >
+ Request Reset!
+ </button>
+ </fieldset>
+ </form>
</Form>
`;
+
+exports[`<ResetRequest/> renders errors 1`] = `
+<DisplayError
+ error={
+ Object {
+ "message": "Shit!",
+ }
+ }
+>
+ <styled.div>
+ <div
+ className="sc-bwzfXH flKeYn"
+ >
+ <p>
+ <strong>
+ Shoot!
+ </strong>
+ Shit!
+ <button>
+ Try Again
+ </button>
+ </p>
+ </div>
+ </styled.div>
+</DisplayError>
+`;
diff --git a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
index 173fb95..fd7e481 100644
--- a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
+++ b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap
@@ -1,17 +1,86 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`<SingleItem/> renders 1`] = `
-<div>
- <img
- alt="Sneakers"
- src="dog.jpg"
- />
- <h2>
- Viewing
- Sneakers
- </h2>
- <p>
- A cool set of shoes
- </p>
-</div>
+exports[`<SingleItem/> Renders with Proper Data 1`] = `
+Array [
+ <styled.div
+ data-test="SingleItem"
+ >
+ <div
+ className="sc-bwzfXH dFvSZo"
+ data-test="SingleItem"
+ >
+ <DisplayError />
+ <img
+ alt="Quo quis molestiae"
+ src="Hello World"
+ />
+ <div
+ className="details"
+ >
+ <h2>
+ Viewing
+ Quo quis molestiae
+ </h2>
+ <p>
+ Omnis porro porro quos nihil omnis reiciendis velit. Culpa deleniti qui reprehenderit in nisi et qui. Odio dolore veritatis eligendi in.
+ </p>
+ <Link
+ href={
+ Object {
+ "pathname": "/admin/update",
+ "query": Object {
+ "id": "79c17dc9-5865-4045-9bad-f487a49d94a8",
+ },
+ }
+ }
+ >
+ <a
+ href="/admin/update?id=79c17dc9-5865-4045-9bad-f487a49d94a8"
+ onClick={[Function]}
+ >
+ Edit ✏️
+ </a>
+ </Link>
+ </div>
+ </div>
+ </styled.div>,
+ <div
+ className="sc-bwzfXH dFvSZo"
+ data-test="SingleItem"
+ >
+ <DisplayError />
+ <img
+ alt="Quo quis molestiae"
+ src="Hello World"
+ />
+ <div
+ className="details"
+ >
+ <h2>
+ Viewing
+ Quo quis molestiae
+ </h2>
+ <p>
+ Omnis porro porro quos nihil omnis reiciendis velit. Culpa deleniti qui reprehenderit in nisi et qui. Odio dolore veritatis eligendi in.
+ </p>
+ <Link
+ href={
+ Object {
+ "pathname": "/admin/update",
+ "query": Object {
+ "id": "79c17dc9-5865-4045-9bad-f487a49d94a8",
+ },
+ }
+ }
+ >
+ <a
+ href="/admin/update?id=79c17dc9-5865-4045-9bad-f487a49d94a8"
+ onClick={[Function]}
+ >
+ Edit ✏️
+ </a>
+ </Link>
+ </div>
+ </div>,
+]
`;
diff --git a/frontend/__tests__/mockMang.js b/frontend/__tests__/mockMang.js
new file mode 100644
index 0000000..5a98c6a
--- /dev/null
+++ b/frontend/__tests__/mockMang.js
@@ -0,0 +1,39 @@
+import { importSchema } from 'graphql-import';
+import GraphQLMock from 'graphql-mock';
+import casual from 'casual';
+import PropTypes from 'prop-types';
+
+// seed it so we get consistent results
+casual.seed(123);
+
+const typeDefs = importSchema('../backend/src/schema.graphql');
+
+// By default graphql-mock will generate random numbers, IDs, and Strings of "Hello World"
+// We can overwrite any of those if we need to
+
+const mocks = {
+ ID: () => casual.uuid,
+ Item: () => ({
+ title: casual.title,
+ description: casual.description,
+ price: () => 50000,
+ }),
+ User: () => ({
+ email: casual.email,
+ name: casual.name,
+ }),
+};
+
+// Creates a mocked client
+const mocked = new GraphQLMock(typeDefs, mocks);
+
+const mountOptions = {
+ context: {
+ client: mocked.client,
+ },
+ childContextTypes: {
+ client: PropTypes.object,
+ },
+};
+
+export default mountOptions;

Want to contribute? Host your changes somewhere and send me the link: jan (at) sydanviita.fi. Also, check out my website.


forge.jan.systems — powered by cgit