Obrigado a todos que participaram, mesmo que um grupo mais enxuto que o último (rs)

Obrigado a todos que participaram, mesmo que um grupo mais enxuto que o último (rs)

Resposta padrão!

Aqui segue a resposta padrão com o Selenium IDE.
O desafio era poder simular o drag and drop feito manualmente para colocar os produtos no carrinho de compras...
Este não era tão difícil assim, porém alguns tiveram dúvidas sobre qual o comando certo em utilizar.
Existem dois comandos: dragAndDrop e dragAndDropToObject
Um problema comum enfrentado por alguns é utilizar o dragAndDrop com apenas uma posição. Ex:
dragAndDrop | objeto | +50

Isso causa uma parada no browser e um tempo muito grande de espera até que o browser volte a responder. O correto seria:
dragAndDrop | objeto | +50, +300

Para este desfio utilizei o comando dragAndDropToObject, pois o outro é dependente de posição e pode gerar muita manutenção no script de teste. O que é preciso para este desafio é o uso do Firebug para descobrir os objetos que utilizaremos. Esta que se torna uma prática comum para encontrar objetos e acessá-los através de XPath. Essa foi a solução que eu queria que vocês chegassem. Outros colaboradores chegaram a soluções muito parecidas, e já vamos visualizá-las mais abaixo.

Download do script (clique com o botão direito e selecione 'Salvar como...')
Vídeo Explicativo

Soluções de outros colaboradores


O código abaixo foi escrito em Java utilizando o JUnit como suporte ao assertEquals

Os imports foram ignorados. Visualize o código completo neste link (clique com o botão direito e selecione 'Salvar como...')

					  		driver.get("http://eliasnogueira.com/arquivos_blog/selenium/desafio/3desafio/drag_and_drop/demo.php");
		
							// necessario maximizar a pagina para o drap and drop dos itens
							driver.manage().window().maximize();
							
							// localiza os elementos
							WebElement iPhone = driver.findElement(By.cssSelector("img[alt='iPhone']"));
							WebElement iPodShuffle = driver.findElement(By.cssSelector("img[alt='iPod Shuffle']"));
							WebElement appleTV = driver.findElement(By.cssSelector("img[alt='Apple TV']"));
							WebElement carrinho = driver.findElement(By.cssSelector(".content.drop-here.ui-droppable"));
							
							// adiciona, via drag and drop, os itens no carrinho
							Actions action = new Actions(driver);
							Action dragAndDrop = null;
							
							dragAndDrop = action.clickAndHold(iPhone).moveToElement(carrinho).release().build();
							dragAndDrop.perform();
							
							dragAndDrop = action.clickAndHold(iPodShuffle).moveToElement(carrinho).release().build();
							dragAndDrop.perform();
							
							dragAndDrop = action.clickAndHold(appleTV).moveToElement(carrinho).release().build();
							dragAndDrop.perform();
							
							// espera os elementos serem adicionados ao carrinho
							WebDriverWait wait = new WebDriverWait(driver, 10);
							wait.until(ExpectedConditions.visibilityOfAllElementsLocatedBy(By.cssSelector("#table_3 > tbody > tr > td")));
							wait.until(ExpectedConditions.visibilityOfAllElementsLocatedBy(By.cssSelector("#table_4 > tbody > tr > td")));
							wait.until(ExpectedConditions.visibilityOfAllElementsLocatedBy(By.cssSelector("#table_6 > tbody > tr > td")));
							
							// checkout
							driver.findElement(By.cssSelector(".button")).click();
							
							// validacoes
							assertEquals("1 x iPhone", driver.findElement(By.xpath("//h2[1]")).getText());
							assertEquals("1 x iPod Shuffle", driver.findElement(By.xpath("//h2[2]")).getText());
							assertEquals("1 x Apple TV", driver.findElement(By.xpath("//h2[3]")).getText());
							assertEquals("Total: R$ 749", driver.findElement(By.xpath("//h1[2]")).getText());
					  	

O script do Lucas utilizou o comando dragAndDrop que usa a posição do elemento que receberá o objeto que está sendo arrastado.

Apesar de eu não aconselhar o uso deste comando é interessante visualizar como é o script. Também não é recomendado a utilização do comando pause. Muito obrigado Lucas pela tua colaboração!

Download do script (clique com o botão direito e selecione 'Salvar como...')

New Test
open /arquivos_blog/selenium/desafio/drag_and_drop/demo.php
dragAndDrop //img[@alt='iPod'] 25,410
pause 500
dragAndDrop //img[@alt='iPod Shuffle'] 25,410
pause 500
dragAndDrop //img[@alt='Apple TV'] -10,410
pause 500
assertText //table[@id='table_1']/tbody/tr/td[2] R$ 200
assertText //table[@id='table_4']/tbody/tr/td[2] R$ 49
assertText //table[@id='table_6']/tbody/tr/td[2] R$ 300
assertText total exact:total: $549
clickAndWait link=Checkout
assertTextPresent iPod
assertTextPresent iPod Shuffle
assertTextPresent Apple TV
assertTextPresent 549



O Camilo utilzou o comando dragAndDropToObject. A primeira linha do script com o comando refreshAndWait está suponto que em toda execução do script a página apresentada seja a do desafio.

A diferença do script do desafio é que o Camilo guardou todas as informações necessárias com o comando storeText para utilizar as mesmas informações posteriormente e garantir que as informações iniciais são as mesmas apresentadas no checkout.
Muito obrigado Camilo pela tua colaboração!

Download do script (clique com o botão direito e selecione 'Salvar como...')

desafio03
refreshAndWait
dragAndDropToObject //img[@alt='iPhone'] //img[@alt='shopping cart']
dragAndDropToObject //img[@alt='iPod Shuffle'] //img[@alt='shopping cart']
dragAndDropToObject //img[@alt='Apple TV'] //img[@alt='shopping cart']
waitForElementPresent //table[@id='table_6']/tbody/tr/td[2]
storeText //table[@id='table_3']/tbody/tr/td[2] valorItem1
storeText //table[@id='table_4']/tbody/tr/td[2] valorItem2
storeText //table[@id='table_6']/tbody/tr/td[2] valorItem3
storeEval '${valorItem1}'.replace("R$ ", "") valor1
storeEval '${valorItem2}'.replace("R$ ", "") valor2
storeEval '${valorItem3}'.replace("R$ ", "") valor3
storeEval ${valor1} + ${valor2} + ${valor3} resposta
storeText total total
storeEval '${total}'.replace("total: $", "") totalTratado
assertEval ${resposta}==${totalTratado} true