Instantly share code, notes, and snippets.

Embed
What would you like to do?
react-apollo testing
import { Component } from "react";
import { print } from "graphql-tag/printer";
import { graphql } from "react-apollo";
import { MockedProvider } from "react-apollo/test-utils";
import { addTypenameToDocument } from "apollo-client/queries/queryTransform";
import { mount } from "enzyme";
import { withSavedPayments, SAVED_ACCTS_QUERY } from "../";
it("has a known query shape", () => {
expect(print(SAVED_ACCTS_QUERY)).toMatchSnapshot();
});
describe("graphql integration", () => {
// let calls;
// beforeEach(() => {
// calls = graphql.mock.calls[graphql.mock.calls.length - 1];
// });
// afterEach(() => {
// calls = undefined;
// });
// it("uses the known query", () => {
// expect(calls[0]).toEqual(SAVED_ACCTS_QUERY);
// });
// it("has a prop location of `savedPayments`", () => {
// expect(calls[1].name).toBe("savedPayments");
// });
// it("passes variables correctly", () => {
// const options = calls[1].options;
// const calculatedOptions = options();
// expect(calculatedOptions.variables).toEqual({
// cache: false,
// });
// });
// it("forceFetches on each load", () => {
// const options = calls[1].options;
// const calculatedOptions = options();
// expect(calculatedOptions.forceFetch).toBe(true);
// });
it("correctly delivers props to child component", (done) => {
const query = addTypenameToDocument(SAVED_ACCTS_QUERY);
const variables = { cache: false };
const mockedData = {
savedPayments: null,
};
class Foo extends Component {
componentWillReceiveProps({ savedPayments: { loading, savedPayments }}) {
expect(loading).toBe(false);
expect(savedPayments).toBe(null);
done();
}
render() {
return null;
}
}
const DummyComponent = withSavedPayments(Foo);
const wrapper = mount(
<MockedProvider mocks={[
{ request: { query, variables }, result: { data: mockedData } }
]}>
<DummyComponent />
</MockedProvider>
);
});
it("correctly delivers props to child component", (done) => {
const query = addTypenameToDocument(SAVED_ACCTS_QUERY);
const variables = { cache: false };
const mockedData = {
savedPayments: [],
};
class Foo extends Component {
componentWillReceiveProps({ savedPayments: { loading, savedPayments }}) {
expect(loading).toBe(false);
expect(savedPayments).toEqual(mockedData.savedPayments);
done();
}
render() {
return null;
}
}
const DummyComponent = withSavedPayments(Foo);
const wrapper = mount(
<MockedProvider mocks={[
{ request: { query, variables }, result: { data: mockedData } }
]}>
<DummyComponent />
</MockedProvider>
);
});
it("correctly delivers props to child component", (done) => {
const query = addTypenameToDocument(SAVED_ACCTS_QUERY);
const variables = { cache: false };
const mockedData = {
savedPayments: [
{
name: "Gold Card",
id: 10,
date: "date",
__typename: "SavedPayment",
payment: {
accountNumber: "4111111111111111",
paymentType: "Visa",
__typename: "Card"
}
}
],
};
class Foo extends Component {
componentWillReceiveProps({ savedPayments: { loading, savedPayments }}) {
expect(loading).toBe(false);
expect(savedPayments).toEqual(mockedData.savedPayments);
expect(savedPayments).toMatchSnapshot();
done();
}
render() {
return null;
}
}
const DummyComponent = withSavedPayments(Foo);
const wrapper = mount(
<MockedProvider mocks={[
{ request: { query, variables }, result: { data: mockedData } }
]}>
<DummyComponent />
</MockedProvider>
);
});
});
describe("redux implementation", () => {
it("only uses mapStateToProps");
it("correctly formats the shape to include authorized");
it("correctly formats the shape to include savedAccount");
});
describe("CheckoutButtons", () => {
it("has a default state");
describe("onClick", () => {
it("takes an event");
it("fires an onClick function if provided");
it("can stop execution if onClick tells it to");
it("dispatches setting transactionType");
it("stores savedPayment if it exists");
it("handles a logged in user when input isn't disabled");
it("handles a logged out user");
it("sets the nav to modal");
});
describe("giveAsGuest", () => {
it("returns early if disabled");
it("dispatches correct actions");
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment