Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

167
Vistas
Error de mecanografiado de consulta personalizada de la biblioteca de prueba

En un proyecto actual que usa react con jest y @testing-library/react , estoy implementando consultas personalizadas para consultar el contenido de texto de los componentes.

La consulta personalizada (creada con el método buildQueries de testing-library) que quiero usar recibe dos parámetros (uno es opcional). Cuando quiero agregar un segundo parámetro, Typescript me dice que solo se puede pasar un argumento.

 const queryAllByTextContent = ( container: HTMLElement, text: string | RegExp, options?: QueryParameterOptions ): HTMLElement[] => { const { exact = false } = options ?? { }; return queryAllByText(container, (content, node): boolean => { if (!node) { return false; } const nodeHasSearchText = nodeContainsSearchText({ searchText: text, exact, node }); // eslint-disable-next-line unicorn/prefer-spread const childNodesDontHaveSearchText = Array.from(node.children).every( (childNode): boolean => !nodeContainsSearchText({ searchText: text, exact, node: childNode }) ); return nodeHasSearchText && childNodesDontHaveSearchText; }); }; const getMultipleError = ( container: Element | null, text: string | RegExp ): string => `Found multiple elements with the text: ${text}`; const getMissingError = ( container: Element | null, text: string | RegExp ): string => `Unable to find an element with the text: ${text}`; const [ queryByTextContent, getAllByTextContent, getByTextContent, findAllByTextContent, findByTextContent ] = buildQueries(queryAllByTextContent, getMultipleError, getMissingError);

Creé un repositorio de Github con un ejemplo de trabajo:

https://github.com/desudo/ejemplo-broma-con-react-testing-library

Los archivos más importantes son:

/test/helpers/textContentQueries.ts -> queryAllByTextContent /test/component/Price.test.tsx

Lo que descubrí :

El primer parámetro de la consulta personalizada tiene que ser de tipo string | RegExp . Cuando configuro el tipo en solo una cadena, todo funciona según lo previsto.

IMPORTANTE

Las pruebas de ejemplo son solo pruebas ficticias para mostrar el error de mecanografiado.


¡Gracias por cualquier pista o solución!

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Una forma de solucionar este problema es agregar las options?: QueryParameterOptions a getMultipleError y getMissingError .

Esto se debe al tipo que se define bajo el capó de buildQueries .

Ciertamente no me gusta esta solución porque no estamos usando el parámetro de opciones en ninguno de estos dos métodos.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda