Atualizar Propriedades

// Isto é um exemplo de como atualizar as propriedades de um componente desenhado.
// A ideia básica é simplesmente chamar `render` novamente e fornecer o mesmo contentor
// que a tua primeira chama criou para ti.

import React, {useRef} from 'react'
import {render, screen} from '@testing-library/react'

let idCounter = 1

const NumberDisplay = ({number}) => {
  const id = useRef(idCounter++) // para garantir que não remontamos um instância diferente

  return (
    <div>
      <span data-testid="number-display">{number}</span>
      <span data-testid="instance-id">{id.current}</span>
    </div>
  )
}

test('calling render with the same component on the same container does not remount', () => {
  const {rerender} = render(<NumberDisplay number={1} />)
  expect(screen.getByTestId('number-display')).toHaveTextContent('1')

  // redesenhar o mesmo componente com propriedades diferentes
  rerender(<NumberDisplay number={2} />)
  expect(screen.getByTestId('number-display')).toHaveTextContent('2')

  expect(screen.getByTestId('instance-id')).toHaveTextContent('1')
})