' }} />
SCRIPT_DO_SEU_TESTEAB
```
2. O seu script deve ficar dessa forma abaixo e já está tudo certo para rodar o seu teste
```
' }} />
```
# Deixando sua página sincronizada com o vídeo
* Importe o useEffect e o useState
```
import { useState, useEffect } from 'react';
```
* Crie um estado para definir se os elementos estão visíveis ou não:
```
const [isVisible, setIsVisible] = useState(false);
```
* Adicione o código de delay abaixo e altere o tempo em segundos em que deseja que o estado `isVisible` fique como `true`:
Dessa forma, você pode mostrar os elementos que deseja apenas quando esse estado estiver como
```
true
```
e esconder quando estiver como
```
false
```
.
```
useEffect(() => { /* ALTERE O VALOR 10 PARA OS SEGUNDOS EM QUE AS SEÇÕES VÃO APARECER */ const SECONDS_TO_DISPLAY = 10; /* DAQUI PARA BAIXO NAO PRECISA ALTERAR */ let attempts = 0; let elsDisplayed = false; const alreadyDisplayedKey =`alreadyElsDisplayed${SECONDS_TO_DISPLAY}` const alreadyElsDisplayed = localStorage.getItem(alreadyDisplayedKey); const showHiddenElements = function () { elsDisplayed = true; setIsVisible(true); localStorage.setItem(alreadyDisplayedKey, true) } const startWatchVideoProgress = function () { if (typeof smartplayer === 'undefined' || !(smartplayer.instances && smartplayer.instances.length)) { if (attempts >= 10) return; attempts += 1; return setTimeout(function () { startWatchVideoProgress() }, 1000); } smartplayer.instances[0].on('timeupdate', () => { if (elsDisplayed || smartplayer.instances[0].smartAutoPlay) return; if (smartplayer.instances[0].video.currentTime < SECONDS_TO_DISPLAY) return; showHiddenElements(); }) } if (alreadyElsDisplayed === 'true') { setTimeout(function () { showHiddenElements(); }, 100); } else { startWatchVideoProgress() } }, [])
```
**Prontinho! Os elementos vão ficar sincronizados com o tempo do vídeo em que definiu em segundos. **
Exemplo de condição para aparecer apenas quando chegar no tempo definido:
```
{isVisible &&
DELAY TEST
}
```
**Não esqueça de adicionar seu(s) domínio(s) na aba de [Segurança](https://help.vturb.com/pt-br/article/seguranca-14b0lwn/), garantindo proteção extra aos seus VSLs.**
###### Saiba mais sobre o assunto em:
[Saiba como usar o VTurb com os principais construtores de página!](https://help.vturb.com/pt-br/category/construtores-de-pagina-15iwcsj/)
[Diferença entre o Iframe e o código JS](https://help.vturb.com/pt-br/article/diferenca-entre-o-iframe-e-o-codigo-js-mbliqq/)