Elementos difíceis
Cada bloco tem um data-testid e ids estáveis. Leia o "O que treinar", escreva o teste e confira o resultado na própria página.
1. Elemento que aparece com atraso
O que treinar: esperas explícitas (aguardar visibilidade) em vez de sleep fixo. O atraso varia de 1 a 4 s.
2. Botão que muda de posição
O que treinar: localizar pelo texto, não por coordenadas; lidar com elemento que se move entre ações. A cada clique o botão pula para outro lugar.
Cliques:
3. Alerta, confirmação e prompt nativos
O que treinar: registrar o tratador do diálogo antes do clique, aceitar, recusar e digitar no prompt (ex.: page.on('dialog'), cy.on('window:confirm')).
Resultado:
4. Nova aba e nova janela
O que treinar: capturar a nova página (ex.: context.waitForEvent('page')), trocar de contexto e voltar. O Cypress não controla abas: remova o target ou teste o href.
5. Upload de arquivo
O que treinar: setInputFiles / selectFile, múltiplos arquivos, tipo e tamanho inválidos. O arquivo não sai do navegador.
6. Download de arquivo
O que treinar: esperar o evento de download, conferir nome e conteúdo do arquivo baixado.
7. Arrastar e soltar
O que treinar: dragTo / eventos HTML5 de drag and drop. Para teclado, cada cartão tem um botão "Mover".
A fazer
Concluído
Concluídos:
8. Menu ao passar o mouse
O que treinar: hover() antes de clicar no submenu; o submenu também abre com foco do teclado.
Escolhido:
9. Tabela com ordenação e paginação
O que treinar: ler células, validar ordenação (clique no cabeçalho) e percorrer páginas até achar um registro.
10. Seletor de data
O que treinar: navegar meses num calendário próprio e comparar com o input type="date" nativo (que aceita fill('2030-01-15')).
Selecionado:
11. Select dinâmico (dependente)
O que treinar: esperar as opções do segundo select carregarem (atraso de 0,8 s) depois de escolher o primeiro.
Escolha:
12. Toast que some
O que treinar: verificar uma mensagem que desaparece em 3 s (asserção rápida e depois que sumiu).
13. Elemento dentro de iframe aninhado
O que treinar: entrar em dois níveis de frame (ex.: frameLocator('#frame-externo').frameLocator('#frame-interno')) e ler o resultado no frame interno.
14. Shadow DOM aninhado
O que treinar: atravessar dois shadow roots abertos (Playwright atravessa sozinho; no Cypress use includeShadowDom ou .shadow()).
15. Spinner de carregamento
O que treinar: esperar o spinner sumir ou a requisição terminar (chama GET /http/delay/2 da API do Lab).
16. Conteúdo com rolagem infinita
O que treinar: rolar um contêiner até carregar o item desejado (10 por vez, até 50).
17. Campos com máscara
O que treinar: digitar só números e conferir o valor formatado; use apenas dados fictícios (ex.: CPF 123.456.789-09 é um exemplo de formato).
Somente dígitos:
18. Tooltip
O que treinar: passar o mouse ou focar para revelar o texto e validar o role="tooltip".
19. Modal
O que treinar: interagir só dentro do modal, fechar com botão ou Esc e checar que o foco volta ao botão que abriu.
Resultado:
20. Abas
O que treinar: trocar de aba com clique e com as setas do teclado; verificar aria-selected e o painel visível.
21. Acordeão
O que treinar: expandir e recolher seções, validar aria-expanded e o conteúdo exibido.