As of now when using Apollo in app, the spec fails, complaining for something along the lines of:
Error: Client has not been defined yet. I think it would be useful to have an internal mock available simply by importing it as a module in test e.g.:
imports: [
ApolloMockModule
]
Any suggestions as to how this feature might be implemented are more than welcome as well. Thank you.
Note: I've noticed in the Apollo.spec.ts file, there is an apolloMock function: https://github.com/apollographql/apollo-angular/blob/master/packages/apollo-angular/tests/Apollo.spec.ts
Perhaps making this function available as an export, in the mocks folder(https://github.com/apollographql/apollo-angular/tree/master/packages/apollo-angular/tests/mocks) with the appropriate documentation, would solve this feature request.
Here is what i did for my Angular app, i re-used apollo-angular/packages/apollo-angular/tests/mocks/mockLinks.ts then for Apolllo i use a mock version, so mockApollo looks like:
import { Apollo } from 'apollo-angular';
import { ApolloLink } from 'apollo-link';
import { InMemoryCache, NormalizedCache } from 'apollo-cache-inmemory';
export function mockApollo(link: ApolloLink, options?: any) {
const apollo = new Apollo();
apollo.create({
link,
cache: new InMemoryCache(),
...options,
});
return apollo;
}
Then I imported these in my spec file:
import { Apollo, mockSingleLink, mockApollo, gql } from '../../../mocks/apollo';
I start my testbed with the default Apollo:
beforeEach(() => {
TestBed.configureTestingModule({
providers: [Apollo],
});
});
Then the testing can begin by consuming the mockApollo for the service. First i test if my schema is as agreed upon (so i test some parts of apollo too), later on im just interested in the response for my tests and i just return the promise:
it('getProjectJira() should call apollo.query', (done) => {
// This setup is also testing if apollo works as expected
const query = gql`
query getProjectJira($key: String) {
project(key: $key) {
jira {
key
homepage
description
lead {
displayName
email
active
__typename
}
__typename
}
__typename
}
}
`;
const variables = { key: 'AAAAAAZ' };
const link = mockSingleLink(
{
request: { query, variables },
result: {
data: {
project: {
jira: {
key: 'AAAAAAZ',
homepage: 'foo.bar',
description: 'foo bar',
lead: {
displayName: 'xxx',
email: 'xxx',
active: true,
__typename: 'User'
},
__typename: 'Jira'
},
__typename: 'Project'
}
}
}
}
);
const apollo = mockApollo(link);
const service = new JiraService(apollo);
service
.getProjectJira('AAAAAAZ')
.first()
.subscribe((res) => {
// testing apollo :(
expect(res.data.project.jira.key).toBe('AAAAAAZ');
done();
});
});
it('getProjectJira() should call apollo.query and catched', (done) => {
const apollo = mockApollo(mockSingleLink());
const client = apollo.getClient();
client.query = () => Promise.reject('error');
const service = new JiraService(apollo);
service
.getProjectJira('AAAAAAZ')
.first()
.subscribe((res) => {
expect(res).toBe(null);
done();
});
});
it('deleteJiraProject() should mutate', (done) => {
const result = {
data: {
deleteJiraProject: {
key: 'AAAAAAZ',
__typename: 'Jira'
}
}
};
const apollo = mockApollo(mockSingleLink());
const client = apollo.getClient();
client.mutate = () => Promise.resolve(result);
const service = new JiraService(apollo);
service
.deleteJiraProject('AAAAAAZ')
.first()
.subscribe((res) => {
expect(res.data.deleteJiraProject.key).toBe('AAAAAAZ');
done();
});
});
@maapteh I commend you for the above. It definitely helps, and I will use to compare how I similarly pulled out mockLinks.ts into my project. However, I would like to gently suggest, I think this proves a point. If we have a mockLinks.ts file, that requires every dev who uses apollo in an Angular setting, to create their own mock, then we might as well create one that is universally available by simply importing as apolloMock. I myself will try to fork and implement when have time. Thank you.
I think most of the things are already there, for example https://github.com/apollographql/apollo-link/blob/master/packages/apollo-link-schema/README.md and the best place will be https://github.com/apollographql/apollo-test-utils
I expected to have something like ApolloTestingModule similar as we have HttpClientTestingModule by the Angular team, but unfortunately, I didn't find anything. So, yeah this common testing module is highly needed.
v1.1.0 is going to have apollo-angular/testing, same experience as in @angular/common/http/testing
Most helpful comment
v1.1.0 is going to have
apollo-angular/testing, same experience as in@angular/common/http/testing