My goal is to setup Apollo for some tests using jest.
In the debugger, the $apollo property has all its properties equal to undefined or are empty objects. provider and client included.
For the sake of simplicity I reuse currently the setup of the documentation. So I have a simple config in a ts file
import VueApollo from 'vue-apollo';
import { ApolloClient } from 'apollo-client';
import { createHttpLink } from 'apollo-link-http';
import { InMemoryCache } from 'apollo-cache-inmemory';
const httpLink = createHttpLink({
uri: 'http://localhost:3020/graphql' // will change later
});
const cache = new InMemoryCache();
const apolloClient = new ApolloClient({
link: httpLink,
cache
});
const fakeApolloProvider = new VueApollo({
defaultClient: apolloClient
});
export default fakeApolloProvider;
Then inside the test file I do
import VueApollo from 'vue-apollo';
import fakeApolloProvider from './mockApolloForAutocompleteInput';
import AutocompleteInput from '../AutocompleteInput.vue';
const localVue = createLocalVue();
localVue.use(VueApollo);
wrapper = shallowMount(AutocompleteInput, {
localVue,
mocks: {
fakeApolloProvider
}
});
The component mount properly.
And in the component :
const { AIProviders } = require('@/graphql/AutocompleteInput.graphql');
@Component {
apollo: {
client: 'provider'
query: AIProviders,
manual: true,
deep: true,
// more setup variable(), skip(), result()
}
}
export default class AutocompleteInput extends Vue {
// component definition
}
Thanks for help
Aucun commentaire:
Enregistrer un commentaire