Tengo un componente de reacción que se comporta como un control deslizante. Quiero probar si uno de los elementos que está oculto por el desbordamiento es visible o no.

Lo que tengo hasta ahora es

 const prevBtn = screen.getByRole('button', { name: /prev slide/i }) const juneTwentySix = await screen.findByTestId('Sun 26 Jun') const juneThird = await screen.findByTestId('Sun 30 Jun') expect(prevBtn).toBeDisabled() expect(juneTwentySix).toBeVisible() <-- ok expect(juneThird).toBeInTheDocument() <-- it's in the DOM, so it's ok to be in the document expect(juneThird).not.toBeVisible() <-- this is where I want to check if the element is visible or not.

Cómo se construye este control deslizante: el componente principal tiene un ancho fijo: es decir, 300 px, y lo que hace que el componente secundario (el que contiene las fechas) sea transform: translateX(-${currentSlide * 100}%)