Durante todo o curso, vimos apenas 3 tipos de elementos usados, o input, a e Button. Mas a maioria dos sistemas utilizam muitos outros elementos que não acessamos com o cypress através do "cy.get('').type()" ou ".click()". Como eu acesso um select? faço um upload de arquivo? Arrasto e solto? Radio e Checkbox? Nesta gestão tão simples, o curso acabou sendo muito pobre.
Olá, Rafael! Tudo bem?
Entendo o seu ponto, mas não se preocupe, o Cypress é uma ferramenta bastante versátil e pode lidar com vários tipos de elementos HTML além dos que você mencionou. Vamos abordar algumas das suas dúvidas:
Select (dropdown): Para interagir com um elemento <select>, você pode usar o comando cy.get() para selecionar o elemento e, em seguida, usar o .select() para escolher uma opção. Por exemplo:
cy.get('select').select('OptionValue');
Upload de arquivo: Para fazer upload de arquivos, você pode usar o plugin cypress-file-upload. Primeiro, instale o plugin e, em seguida, use o comando .attachFile():
cy.get('input[type="file"]').attachFile('caminho/do/arquivo');
Arrastar e soltar (drag and drop): Existem plugins como cypress-drag-drop que facilitam essa tarefa. Após instalar o plugin, você pode usá-lo assim:
cy.get('#source-element').drag('#target-element');
Radio buttons e checkboxes: Para interagir com esses elementos, você pode usar o .check() para marcar e .uncheck() para desmarcar (no caso de checkboxes):
cy.get('input[type="radio"]').check('valorRadio');
cy.get('input[type="checkbox"]').check();
Esses exemplos devem ajudar você a começar a trabalhar com diferentes elementos HTML usando o Cypress. Lembre-se de que a documentação oficial do Cypress também é uma excelente fonte de informações e exemplos.
Espero ter ajudado e bons estudos!