Edite seus testes com o VSCode e automatize-os com o SeeTest.

Última atualização: 13 de setembro de 2020 — Continuous Testing Expert

 

Visão geral do VSCode

O VSCode é um editor de texto extremamente rápido oferecido pela Microsoft. É uma ferramenta completa que combina um editor de texto fácil de usar com um IDE avançado, permitindo editar, compilar e depurar projetos de teste facilmente a partir de um único painel. A ferramenta é compatível com as plataformas Windows, Linux e Mac. Embora o suporte para JavaScript, Node.js e TypeScript seja nativo, oferece extensões para outras linguagens de programação, como Java, Python, PHP, C++, C#, Go, etc. Também é compatível com ferramentas de tempo de execução como Unity e .NET.

História do VSCode

O VSCode não deve ser confundido com o Microsoft Visual Studio. O Visual Studio é um produto da Microsoft que existe há 20 anos e funciona em plataformas Windows e macOS. Ele não é de código aberto. Já o VSCode é baseado no Electron Framework. Ele foi criado pelo GitHub para o desenvolvimento de aplicações com interface gráfica usando Node.js. Anteriormente, era conhecido como Atom Shell. A Microsoft assumiu o produto e o lançou como código aberto em 2015.

O VSCode é um editor de texto leve. Ao mesmo tempo, oferece extensões que o transformam em uma IDE poderosa, permitindo que você trabalhe com sua linguagem de programação favorita. Além disso, não consome muitos recursos e não requer procedimentos de instalação complexos. Usando apenas este editor, você pode executar qualquer script de programação.

Ele é compatível com todas as principais plataformas, como Windows, Linux, macOS, etc. Além de ser leve, também é muito mais rápido que outras IDEs. Com a adição de extensões, você pode desfrutar de um editor de texto repleto de recursos. Ademais, é simples de instalar e usar. Instalar um recurso é tão fácil quanto clicar. E o melhor: é gratuito.

A ferramenta está em constante inovação. Oferece plugins e extensões úteis, além de suporte para depuração. O VSCode possui uma comunidade ativa e disposta a ajudar. Além disso, equipes dedicadas da Microsoft trabalham continuamente para aprimorá-la, algo que não se encontra em outras ferramentas de código aberto. Uma nova versão é lançada mensalmente e o produto é estável.

Instalação

O primeiro passo é instalar a ferramenta. Depois, você poderá adicionar a extensão de idioma de sua escolha.

Passo 1: Instale o VSCode

Assim como todos os outros softwares para Windows, o VSCode é fácil de instalar. Basta baixar o pacote e clicar duas vezes nele para concluir a instalação.

Para baixar a ferramenta, acesse o seguinte link: https://code.visualstudio.com/download

Selecione a versão da sua plataforma e faça o download da ferramenta.

instalação do vscode

Após a conclusão do download, clique duas vezes no arquivo para iniciar o procedimento de instalação. Na tela seguinte, aceite o contrato de licença.

instalação do vscode

Na tela seguinte, escolha a pasta de destino e as opções do menu Iniciar.

Configuração do VS Code

Em seguida, você pode personalizar algumas opções. Escolha "Adicionar ao caminho" para adicionar o caminho do VSCode às variáveis ​​de ambiente do sistema.

variáveis ​​do vscode

Clique em "Avançar" para concluir a instalação.

vscode completo

Clique em Concluir e a instalação estará completa. Agora, o VSCode está pronto para uso.

Início do VS Code

O bom dos produtos da Microsoft é o design intuitivo baseado em interface gráfica. Você pode trabalhar facilmente com a ferramenta mesmo com conhecimento mínimo.

Você pode simplesmente criar um arquivo HTML, adicionar o código e executar o arquivo.

Início do VS Code

Portanto, a ferramenta já está pronta para uso.

Etapa 2: Adicionar extensões de linguagem de programação

Para trabalhar com sua linguagem favorita, você deve adicionar extensões ao editor VSCode. Para fazer isso, abra o editor VSCode. Na barra de atividades à esquerda, clique no ícone de extensões.

extensão do vscode

Digite Java na barra de pesquisa. Você verá uma lista de extensões Java. Selecione Pacote de Extensões Java.

Ao clicar em instalar, o pacote de extensões Java será instalado. Ele inclui seis componentes:

  1. Suporte a idiomas para Java
  2. Visual Studio IntelliCode
  3. Maven para Java
  4. Depurador para Java
  5. Executador de testes Java
  6. Gerente de Projetos para Java

Ao clicar em instalar, todos os seis componentes serão instalados.

desinstalar vscode

Após a instalação do pacote de extensões, abra o editor VSCode. Clique em Arquivo e abra a pasta do espaço de trabalho (ex: ExperitestProject).

espaço de trabalho do VS Code

Ao selecionar a pasta do espaço de trabalho, a pasta do seu projeto é carregada no espaço de trabalho do VSCode.

espaço de trabalho do VS Code

Agora, clique no ícone de novo arquivo ao lado da sua área de trabalho do projeto para criar um novo programa Java. Dê um nome ao arquivo (ex.: sample1.java) e pressione Enter.

Exemplo de VS Code

Agora, você pode ver o arquivo Java no lado direito do editor. Adicione seu código Java ali.

Aqui está um exemplo de código:

[java] /** * sample1 */ public class sample1 { public static void main(String[] args) { System.out.println(“Olá, usuários do Experitest”); } } [/java]

Ao clicar em Executar, o programa será executado.

executar vscode

O programa imprime o texto “Olá, usuários do Experitest”.

vscode java

Portanto, você adicionou a extensão Java com sucesso. Os programas Java estão sendo executados corretamente aqui.

Etapa 3: Configurar o ambiente de automação de testes

Para executar scripts de automação de testes, você precisa instalar uma ferramenta de compilação como o Maven ou o Gradle. Além disso, é necessário adicionar as dependências do Selenium, WebDriverManager e TestNG.

Ao adicionar o pacote de extensão Java, o Maven também é instalado. No menu inferior esquerdo, você verá "Projeto Maven". Clique na opção "Novo arquivo" ao lado.

arquétipo do vscode

Selecione um arquétipo. Escolha 'archetype-quickstart-jdk8'.

arquétipo do vscode

Selecione a versão.

versão do vscode

Na tela seguinte, escolha a pasta de destino e clique em OK. O processo de compilação será iniciado.

processo de compilação do vscode

Agora, o Maven solicitará alguns detalhes, como groupid, artifactid, etc. Forneça os detalhes e o Maven processará a compilação.

compilação do vscode

Após a compilação ser concluída com sucesso, você poderá visualizar a estrutura do projeto no explorador à esquerda. Clique em pom.xml.

vscode pom.xml

No arquivo pom.xml, você precisa adicionar as dependências do Selenium, do gerenciador de webdriver e do TestNG. Para isso, acesse o repositório Maven aqui:

https://mvnrepository.com/

Na barra de pesquisa, digite Selenium e clique em Pesquisar.

repositório maven

Abra o link do Selenium Java e clique na versão mais recente.

selenium java mais recente

Copie o código para que você possa colá-lo no arquivo pom.xml.

vscode selenium

Agora, acesse o arquivo pom.xml e cole o código na seção de dependências.

dependência

Da mesma forma, procure por 'webdrivermanager' e 'TestNG', copie o código de dependência no arquivo pom.xml e salve o arquivo. Você verá uma mensagem informando que a compilação foi bem-sucedida.

Executando seu primeiro script de automação de testes

Após atualizar o arquivo pom.xml, você poderá visualizar a estrutura do projeto no menu lateral esquerdo. Abaixo do nome do projeto, clique com o botão direito do mouse em srctestjava e escolha "Novo arquivo".

Dê um nome ao arquivo com a extensão .java (ex: experitest1.java)

Agora, adicione o seguinte código ao arquivo.

[java] package Experifact.src.test.java.Experipackage; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; public class experitest1 { public static void main(String[] args) throws InterruptedException { System.setProperty(“webdriver.chrome.driver”,”C:\chromedriver_win32\chromedriver.exe”); WebDriver driver=new ChromeDriver(); driver.get(“http://www.experitest.com”); Thread.sleep(3000); driver.quit(); } } [/java]

Ao executar este código, o navegador Chrome será aberto e o site da Experitest será carregado.

pronto para vscode

Portanto, o VSCode está pronto para a automação de testes baseada em Selenium.

Automação de testes na nuvem Experitest

A plataforma SeeTest da Experitest é uma plataforma abrangente de automação de testes que permite aos desenvolvedores testar seus aplicativos em diversos navegadores, dispositivos, plataformas, etc. Ela também oferece uma ferramenta de geração de relatórios intuitiva que permite entender como cada teste foi executado.

  • Para executar scripts de teste na nuvem SeeTest, abra o VSCode e acesse o explorador de projetos.
  • No projeto Java (Experitestproject), clique com o botão direito do mouse em srctestjavaExperipackage.
  • Clique em Criar novo arquivo
  • Dê um nome ao arquivo com a extensão .java (ex: ExperitestCloud.java)
  • Agora, adicione o seguinte código ao arquivo:

[java] package Experipackage; import org.openqa.selenium.*; import org.openqa.selenium.remote.BrowserType; import org.openqa.selenium.remote.CapabilityType; import org.openqa.selenium.remote.DesiredCapabilities; import org.openqa.selenium.remote.RemoteWebDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; import org.testng.annotations.AfterMethod; import org.testng.annotations.BeforeMethod; import org.testng.annotations.Test; import java.net.URL; public class ExperitestCloud { private static final String ACCESS_KEY = “Digite sua chave de acesso aqui.”; private RemoteWebDriver driver; private URL url; private DesiredCapabilities dc = new DesiredCapabilities(); @BeforeMethod public void setUp() throws Exception { url = new URL(“https://cloud.seetest.io/wd/hub”); dc.setCapability(CapabilityType.BROWSER_NAME, BrowserType.CHROME); dc.setCapability(CapabilityType.PLATFORM, Platform.ANY); dc.setCapability(“accessKey”, ACCESS_KEY); dc.setCapability(“testName”, “Quick Start Chrome Browser Demo”); driver = new RemoteWebDriver(url, dc); } @Test public void browserTestGoogleSearch() { driver.get(“https://www.google.com”); new WebDriverWait(driver, 10).until(ExpectedConditions.presenceOfElementLocated(By.name(“q”))); WebElement searchBar = driver.findElement(By.name(“q”)); searchBar.click(); searchBar.sendKeys(“Experitest”); searchBar.sendKeys(Keys.ENTER); } @AfterMethod public void tearDown() { System.out.println(“URL do relatório: “+ driver.getCapabilities().getCapability(“reportUrl”)); driver.quit(); } } [/java]

Agora, execute o teste. Ele fará login no SeeTest Cloud, abrirá o navegador Chrome, abrirá o site do Google e pesquisará a palavra-chave 'Experitest'.

execute o teste

Ao clicar no Relatório de Teste Java, você poderá ver que o teste foi aprovado.

Uma das funcionalidades mais marcantes do SeeTest Cloud é o recurso de geração de relatórios.

repórter de teste

Ao abrir a funcionalidade de relatórios na nuvem SeeTest, você poderá visualizar um relatório detalhado do teste.

demonstração do navegador

Juntamente com o relatório, é fornecida uma gravação do teste. Você pode ver a gravação no lado direito do relatório. Assim, você pode entender facilmente como os testes foram realizados.

Resumo

O VSCode é um editor de texto e IDE leve para sua linguagem de programação favorita. Usando esta ferramenta simples e gratuita, você pode executar seus projetos de automação de testes com facilidade. Embora ofereça uma interface rica em recursos com todas as extensões necessárias, ele não consome muitos recursos do sistema. Além disso, carrega rapidamente e executa testes com bastante agilidade. Ele também oferece ambientes gerenciados chamados Codespaces, que você pode usar para gerenciar seus projetos. pode leia sobre aqui.

Quando você combina o O poder da nuvem SeeTest Com o VSCode, você não pode pedir nada melhor.

Guy Arieli – Diretor de Tecnologia

Também recomendamos