¿Cómo resolver este error? cuando ejecuto la yarn test recibo este error:
Infracción invariable: no se pudo encontrar "cliente" en el contexto o se pasó como una opción. Envuelva el componente raíz en un , o pase una instancia de ApolloClientApolloClient a través de opciones.
gql
export const GETLOCATIONNAME = gql` query FindLocationByAddress($placeSearch: InputEsriGeoCode!) { findLocationByAddress(placeSearch: $placeSearch) { name address { street1 street2 city state zipCode country } geoCode { longitude latitude } } } `;ubicación.test.js
it('should render location', async () => { const location = { request: { query: GETLOCATIONNAME, variables: { placeSearch: { address: inputString, }, }, }, result: { data: {"data":{"findLocationByAddress":[{"name":"Manila, First District NCR, National Capital Region, PHL","address":{"street1":"","street2":"","city":"Manila","state":"National Capital Region","zipCode":"","country":"PHL"},"geoCode":{"longitude":14.604870000000062,"latitude":120.9862700000001}}]}} }, }; const component = TestRenderer.create( <MockedProvider mocks={[location]} addTypename={false}> <LocationSearch name="Manila, First District NCR, National Capital Region, PHL" /> </MockedProvider>, ); await new Promise(resolve => setTimeout(resolve, 0)); const p = component.root.findByType('p'); expect(p.children.join('')).toContain('Location'); });recursos https://www.apollographql.com/docs/react/development-testing/testing/
Resultado previsto:
Probar un componente graphql con MockedProvider
Resultado real:
La primera prueba con Loading funciona. El segundo donde el resultado debería ser <h1>hello world<h1> no lo es.
Cómo reproducir el problema:
Crear-reaccionar-aplicación habitual con la siguiente prueba en broma
import React from 'react' import { mount } from 'enzyme' import { MockedProvider } from 'react-apollo/test-utils' import gql from 'graphql-tag' import { graphql } from 'react-apollo' const query = gql` query hello{ hello } ` const TestComp = props => { const { loading, hello } = props.data if (loading) { return <h1>Loading</h1> } return <h1>Hello {hello}</h1> } const TestCompHoc = graphql(query)(TestComp) it('will render loading', () => { const mocks = [{ request: { query } }] const wrapper = mount( <MockedProvider mocks={mocks}> <TestCompHoc /> </MockedProvider> ) expect(wrapper).toContainReact(<h1>Loading</h1>) }) it('will render data', async () => { const mocks = [ { request: { query }, result: { data: { hello: 'world' } } } ] const wrapper = mount( <MockedProvider mocks={mocks}> <TestCompHoc /> </MockedProvider> ) await new Promise(resolve => setTimeout(resolve)) wrapper.update() expect(wrapper).toContainReact(<h1>Hello world</h1>) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>Para más información haga clic aquí