Teste entre navegadores usando Selenium webdriver

Por que precisamos de testes entre navegadores?

Os aplicativos baseados na web são muito diferentes dos aplicativos nativos para desktop. Um aplicativo web pode ser aberto em qualquer navegador pelo usuário final. Por exemplo, algumas pessoas preferem abrir https://twitter.com in Firefoxenquanto outros usam Chrome, Safári, ou Microsoft Edge.

No diagrama abaixo, você pode observar que, em navegadores mais antigos, a caixa de login do Twitter não renderiza os cantos arredondados corretamente, enquanto o Chrome moderno renderiza os cantos conforme o esperado.

Portanto, precisamos garantir que o aplicativo web funcione conforme o esperado em todos os navegadores populares, para que mais pessoas possam acessá-lo e utilizá-lo.

Esse objetivo pode ser alcançado com a compatibilidade entre navegadores. Testes do produto em todos os navegadores abrangidos.

Motivos para problemas de compatibilidade entre navegadores

1. Incompatibilidade de tamanho de fonte em diferentes navegadores.
2. JavaAs implementações do mecanismo de script diferem no Chrome (V8), Firefox (Macaco-aranha), Safari (JavaScriptCore) e Edge.
3. Diferenças na validação de CSS e HTML, incluindo o tratamento de prefixos de fornecedores.
4. Suporte inconsistente ou parcial aos recursos HTML5 e ECMAScript em versões mais antigas do navegador.
5. Alinhamento de página, dimensionamento de divs e variações de renderização em flexbox ou grid.
6. Diferenças na orientação da imagem e no perfil de cores.
7. Incompatibilidade do navegador com o sistema operacional subjacente, incluindo peculiaridades do WebView em dispositivos móveis. Android e iOS.

Como fazer testes entre navegadores

Se estivermos usando Selenium Com o WebDriver, podemos automatizar casos de teste no Chrome. Firefox, Microsoft Edgee navegadores Safari.

Para executar casos de teste com diferentes navegadores na mesma máquina ao mesmo tempo, podemos integrar o TestNG quadro com Selenium WebDriver. Para uma cobertura mais ampla de sistemas operacionais e versões, o mesmo conjunto de ferramentas pode ser direcionado para plataformas de nuvem como Sauce Labs, BrowserStack ou LambdaTest por meio de um endpoint WebDriver remoto.

Seu arquivo testing.xml ficará assim:

Este testing.xml será mapeado com o Caso de teste que se parece com isto:

Porque o arquivo testing.xml possui várias tags Test ('ChromeTest', 'FirefoxTeste', 'EdgeTest'), este caso de teste será executado uma vez para cada navegador.

O primeiro teste, 'ChromeTest', passará o valor do parâmetro 'browser' como 'chrome', portanto o ChromeDriver será executado. Este caso de teste será executado no navegador Chrome.

O segundo teste 'FirefoxTest' passará o valor do parâmetro 'browser' como 'Firefox', então FirefoxO driver será executado. Este caso de teste será executado no Firefox navegador. Adicionar um teste no Edge ou no Safari segue o mesmo padrão.

Guru99CrossBrowserScript.java

Automação Code:

package parallelTest;

import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.edge.EdgeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.safari.SafariDriver;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Parameters;
import org.testng.annotations.Test;

public class CrossBrowserScript {

	WebDriver driver;

	/**
	 * This function will execute before each Test tag in testng.xml
	 * @param browser
	 * @throws Exception
	 */
	@BeforeTest
	@Parameters("browser")
	public void setup(String browser) throws Exception{
		//Check if parameter passed from TestNG is 'firefox'
		if(browser.equalsIgnoreCase("firefox")){
		//create firefox instance
			System.setProperty("webdriver.gecko.driver", ".\\geckodriver.exe");
			driver = new FirefoxDriver();
		}
		//Check if parameter passed as 'chrome'
		else if(browser.equalsIgnoreCase("chrome")){
			//set path to chromedriver.exe
			System.setProperty("webdriver.chrome.driver",".\\chromedriver.exe");
			//create chrome instance
			driver = new ChromeDriver();
		}
		//Check if parameter passed as 'Edge'
		else if(browser.equalsIgnoreCase("Edge")){
			//set path to msedgedriver.exe
			System.setProperty("webdriver.edge.driver",".\\msedgedriver.exe");
			//create Edge instance
			driver = new EdgeDriver();
		}
		//Check if parameter passed as 'Safari'
		else if(browser.equalsIgnoreCase("Safari")){
			//SafariDriver ships with macOS, no driver path needed
			driver = new SafariDriver();
		}
		else{
			//If no browser passed throw exception
			throw new Exception("Browser is not correct");
		}
		driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	}

	@Test
	public void testParameterWithXML() throws InterruptedException{
		driver.get("https://demo.guru99.com/V4/");
		//Find user name
		WebElement userName = driver.findElement(By.name("uid"));
		//Fill user name
		userName.sendKeys("guru99");
		//Find password
		WebElement password = driver.findElement(By.name("password"));
		//Fill password
		password.sendKeys("guru99");
	}
}

testando.xml

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">

<suite name="TestSuite" thread-count="3" parallel="tests" >

<test name="ChromeTest">

<parameter name="browser" value="Chrome" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

<test name="FirefoxTest">

<parameter name="browser" value="Firefox" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

<test name="EdgeTest">

<parameter name="browser" value="Edge" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

</suite>

OBSERVAÇÃO: Para executar o teste, clique com o botão direito do mouse em testando.xmlSelecione "Executar como" e clique em TestNG Suite.

Escalando com grades de navegadores na nuvem

Corrida Selenium O WebDriver abrange localmente dois ou três navegadores, mas usuários reais acessam sites a partir de centenas de combinações de sistemas operacionais e navegadores. Laboratórios em nuvem, como... Laboratórios de molho, BrowserStack e LambdaTest Exponha um endpoint WebDriver remoto. Aponte para o mesmo. Selenium Os testes na grade garantem as funcionalidades desejadas para o navegador, versão, sistema operacional e resolução, e o conjunto de testes é escalável horizontalmente sem a necessidade de gerenciar drivers locais.

As grades modernas também apresentam recursos assistidos por IA, como comparação visual de regressão, localizadores de elementos com autorreparação e pontuação de instabilidade, o que reduz a sobrecarga de manutenção em conjuntos de testes de compatibilidade entre navegadores de longa duração.

Observação: O programa em questão foi desenvolvido e testado em Selenium 4, Chrome, Firefox e Microsoft EdgeSe os programas apresentarem um erro, atualize os binários do driver para corresponder à versão do navegador instalada ou use Selenium Gerenciador que resolve problemas de drivers automaticamente.

Faça o download do Selenium Arquivos de projeto para demonstração neste tutorial

Perguntas Frequentes