Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Rerender with a wrapper

Abierto
  • ¿Algo no está bien?
#1,156 1 comentario 5 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 4 días

@eps1lon ya está trabajando en esto.

Desde el 8/10/2022.

Evaluación

Este issue todavía no se ha evaluado.

Descripción

  • @testing-library/react version: 13.4.0
  • Testing Framework and version: jest @ 29.0.3
  • DOM Environment: jsdom @ 20.0.0
Relevant code or config:
// in test utils
const customRender = (
  ui: ReactElement,
  apolloMocks?: ApolloMocks,
  options?: Omit<RenderOptions, 'wrapper'>
) =>
  render(ui, {
    wrapper: () => ui, // this would include our providers wrapped around ui but this demonstrates the issue in a cleaner way
    ...options,
  });

// in test file

const Comp = ({ number }: { number: number }) => <p>{number}</p>;

it('check render', () => {
    const { rerender } = customRender(<Comp number={1} />);
    rerender(<Comp number={2} />);
    expect(screen.getByText('2')).toBeInTheDocument();
  });
What you did:

Rerendering a component that was originally rendered out with the wrapper option, combining two different guides in the docs.

What happened:

No props are updated. The component does rerender, however it does so with the "old" props. (So in the example above, the test fails because 1 is present instead of 2.)

Reproduction:

Happy to add this if necessary.

Problem description:

We can't actually re-render stuff :) The workaround we're using is to put the wrapper directly into the test but that sort of defeats having any wrapper to begin with.

Suggested solution:

Not sure how the internals work and why the wrapper would interfere with the props. I imagine we'd need to see why the props aren't being passed correctly and fix it on that level.

Lenguaje dominante
JavaScript
Estrellas
479
Forks
738
Merge medio
5 d 1 h
PR fusionados (30 d)
2

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de testing-library/testing-library-docs

Todos los issues de testing-library/testing-library-docs

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.