Como lidar com iFrames no Selenium Webdriver: switchTo ()

Índice:

Anonim

iFrame no Selenium Webdriver

iFrame no Selenium Webdriver é uma página da web ou um quadro embutido que está embutido em outra página da web ou um documento HTML embutido em outro documento HTML. O iframe é freqüentemente usado para adicionar conteúdo de outras fontes, como um anúncio, em uma página da web. O iframe é definido com a tag < iframe >.

Neste tutorial, você aprenderá -

  1. Como identificar o iframe:
  2. Como alternar os elementos em iframes usando comandos do driver da Web:
  3. Conceito de frames aninhados (frames dentro de frames):

Como identificar o iframe:

Não podemos detectar os frames apenas vendo a página ou inspecionando o Firebug.

Observe a imagem abaixo, o anúncio que está sendo exibido é um Iframe, não podemos localizar ou reconhecer isso apenas inspecionando usando Firebug. Portanto, a questão é como você pode identificar o iframe?

Como identificar o iframe usando Selenium WebDriver

Podemos identificar os frames no Selenium usando os métodos abaixo:

  • Clique com o botão direito no elemento, se você encontrar a opção como 'Este quadro', então é um iframe. (Consulte o diagrama acima)
  • Clique com o botão direito na página e clique em 'Exibir código-fonte da página' e pesquise com o 'iframe'. Se você encontrar qualquer nome de tag com o 'iframe', isso significa que a página consiste em um iframe.

No diagrama acima, você pode ver que a opção ' Este quadro ' está disponível ao clicar com o botão direito, então agora temos certeza de que é um iframe.

Podemos até identificar o número total de iframes usando o snippet abaixo.

Int size = driver.findElements (By.tagName ("iframe")). Size ();

Como alternar os elementos em iframes usando comandos do driver da Web:

Basicamente, podemos alternar os elementos e manipular frames no Selenium de 3 maneiras.

  • Por índice
  • Por nome ou id
  • Por elemento da web

Mudar para o quadro por índice:

O índice é um dos atributos para tratamento de quadros no Selenium por meio do qual podemos alternar para ele.

O índice do iframe começa com '0'.

Suponha que se houver 100 quadros na página, podemos alternar para o quadro no Selenium usando o índice.

  • driver.switchTo (). frame (0);
  • driver.switchTo (). frame (1);

Mude para o quadro por Nome ou ID:

Nome e ID são atributos para lidar com frames no Selenium por meio dos quais podemos alternar para o iframe.

  • driver.switchTo (). frame ("iframe1");
  • driver.switchTo (). frame ("id do elemento");

Exemplo de mudança para iframe por meio de ID:

Vamos dar um exemplo para alternar o quadro no Selenium exibido na imagem abaixo. Nosso requisito é clicar no iframe.

Podemos acessar esse iframe por meio do URL abaixo: http: //demo.guru99.com/test/guru99home/

É impossível clicar em iframe diretamente através do XPath, pois é um iframe. Primeiro temos que mudar para o quadro e então podemos clicar usando o xpath.

Passo 1)

Driver WebDriver = novo FirefoxDriver ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maximize ();
  • Inicializamos o driver do Firefox.
  • Navegue até o site "guru99" que consiste no iframe.
  • Maximizou a janela.

Passo 2)

driver.switchTo (). frame ("a077aa5e");
  • Nesta etapa, precisamos descobrir o id do iframe inspecionando por meio do Firebug.
  • Em seguida, mude para o iframe por meio de ID.

Etapa 3)

driver.findElement (By.xpath ("html / body / a / img")). click ();
  • Aqui, precisamos descobrir o xpath do elemento a ser clicado.
  • Clique no elemento usando o comando do driver da web mostrado acima.

Aqui está o código completo:

public class SwitchToFrame_ID {public static void main (String [] args) {Driver WebDriver = novo FirefoxDriver (); // navega para o navegadordriver.get ("http://demo.guru99.com/test/guru99home/");// navega para a página que consiste em um iframedriver.manage (). window (). maximize ();driver.switchTo (). frame ("a077aa5e"); // trocando o quadro por IDSystem.out.println ("******** Estamos mudando para o iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Clica no iframeSystem.out.println ("********* Terminamos ***************");}}

Resultado:

O navegador navega para a página que consiste no iframe acima e clica no iframe.

Mudar para o frame por Web Element:

Podemos até mudar para o iframe usando o elemento da web.

  • driver.switchTo (). frame (WebElement);

Como voltar para o quadro principal

Precisamos sair do iframe.

Para voltar ao quadro pai, você pode usar switchTo (). ParentFrame () ou, se quiser voltar ao quadro principal (ou a maioria dos pais), pode usar switchTo (). DefaultContent ();

driver.switchTo (). parentFrame ();driver.switchTo (). defaultContent ();

Como alternar o quadro, se NÃO PODEMOS alternar usando ID ou Web Element:

Suponha que se houver 100 frames na página e não houver ID disponível, neste caso, simplesmente não sabemos de qual iframe o elemento requerido está sendo carregado (É o caso quando não sabemos o índice do frame Além disso).

A solução para a preocupação acima é encontrar o índice do iframe por meio do qual o elemento está sendo carregado e, em seguida, alternar para o iframe por meio do índice.

Abaixo estão as etapas para encontrar o índice do Quadro pelo qual o elemento está sendo carregado usando o trecho abaixo

Passo 1)

Driver WebDriver = novo FirefoxDriver ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maximize ();
  • Inicialize o driver do Firefox.
  • Navegue até o site "guru99" que consiste no iframe.
  • Maximizou a janela.

Passo 2)

int size = driver.findElements (By.tagName ("iframe")). size ();
  • O código acima encontra o número total de iframes presentes dentro da página usando o tagname 'iframe'.

Etapa 3)

O objetivo desta etapa seria descobrir o índice do iframe.

para (int i = 0; i <= tamanho; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent ();}

Acima "forloop" itera todos os iframes na página e imprime '1' se nosso iframe obrigatório foi encontrado, senão retorna '0'.

Aqui está o código completo até a etapa 3:

public class IndexOfIframe {public static void main (String [] args) {Driver WebDriver = novo FirefoxDriver ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maximize ();//driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();para (int i = 0; i <= tamanho; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent ();}}}

Execute este programa e o resultado seria o seguinte:

Resultado:

100000
Verifique a saída, você pode encontrar a série de 0 e 1.
  • Sempre que você encontrar o '1' na saída, é o índice do Quadro pelo qual o elemento está sendo carregado.
  • Desde o índice do iframe começa com '0' se você encontrar a 1 na 1 st lugar, então o índice é 0.
  • Se você encontrar 1 no 3º lugar, o índice é 2.
Podemos comentar o loop for, uma vez que encontramos o índice. Passo 4) 
driver.switchTo (). frame (0);
  • Depois de encontrar o índice do elemento, você pode alternar o quadro usando o comando acima.
  • driver.switchTo (). frame (índice encontrado na Etapa 3);
Etapa 5) 
driver.findElement (By.xpath ("html / body / a / img")). click ();
  • O código acima clica no iframe ou elemento no iframe.
Portanto, o código completo seria como abaixo: 
public class SwitchToframe {public static void main (String [] args) throws NoSuchElementException {Driver WebDriver = novo FirefoxDriver ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maximize ();// int size = driver.findElements (By.tagName ("iframe")). size ();/ * para (int i = 0; i <= tamanho; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent (); // voltando do iframe} * /// Comentou o código para encontrar o índice do elementodriver.switchTo (). frame (0); // Mudando para o quadroSystem.out.println ("******** Mudamos para o iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Clicar no elemento alinhado com o AnúncioSystem.out.println ("********* Terminamos ***************");}}
Saída: o navegador navega para a página que consiste no iframe acima e clica no iframe.

Conceito de frames aninhados (frames dentro de frames):

Vamos supor que existam dois quadros um dentro do outro como mostrado na imagem abaixo e nosso requisito é imprimir o texto no quadro externo e interno. No caso de frames aninhados,
  • Primeiro, devemos mudar para o quadro externo por Índice ou ID do iframe
  • Assim que mudarmos para o quadro externo, podemos encontrar o número total de iframes dentro do quadro externo, e
  • Podemos mudar para o quadro interno por qualquer um dos métodos conhecidos.
Ao sair do quadro, devemos sair na mesma ordem em que entramos primeiro no quadro interno e, em seguida, no quadro externo.
Iframes aninhados no Selenium WebDriver

O código Html para o quadro aninhado acima é mostrado abaixo.

O código HTML acima explica claramente a tag iframe (destacada em verde) dentro de outra tag iframe, indicando a presença de iframes aninhados.

Abaixo estão as etapas para mudar para quadro externo e imprimir o texto em quadros externos: Etapa 1)

Driver WebDriver = novo FirefoxDriver ();driver.get ("Url");driver.manage (). window (). maximize ();driver.manage (). timeouts (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Total de frames -" + tamanho);// imprime o número total de quadrosdriver.switchTo (). frame (0); // Trocando o Quadro ExternoSystem.out.println (driver.findElement (By.xpath ("xpath do elemento externo")). GetText ());
  • Mude para o quadro externo.
  • Imprime o texto no quadro externo.

Assim que mudarmos para a moldura externa, devemos saber se alguma moldura interna está presente dentro da moldura externa

Passo 2)

size = driver.findElements (By.tagName ("iframe")). size ();// imprime o número total de quadros dentro do quadro externoSystem.out.println ("Total de frames -" + tamanho);
  • Encontra o número total de iframes dentro do quadro externo.
  • Se o tamanho for '0', então não há quadro interno dentro do quadro.
Etapa 3) 
driver.switchTo (). frame (0); // Switching to innerframeSystem.out.println (driver.findElement (By.xpath ("xpath do elemento interno")). GetText ());
  • Mudar para o quadro interno
  • Imprime o texto no quadro interno.
Aqui está o código completo: 
public class FramesInsideFrames {public static void main (String [] args) {Driver WebDriver = novo FirefoxDriver ();driver.get ("Url");driver.manage (). window (). maximize ();driver.manage (). timeouts (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Total de frames -" + tamanho);// imprime o número total de quadrosdriver.switchTo (). frame (0); // Trocando o Quadro ExternoSystem.out.println (driver.findElement (By.xpath ("xpath do elemento externo")). GetText ());// Imprimindo o texto no quadro externosize = driver.findElements (By.tagName ("iframe")). size ();// imprime o número total de quadros dentro do quadro externoSystem.out.println ("Total de frames -" + tamanho);driver.switchTo (). frame (0); // Switching to innerframeSystem.out.println (driver.findElement (By.xpath ("xpath do elemento interno")). GetText ());// Imprimindo o texto no quadro internodriver.switchTo (). defaultContent ();}}
Saída : A saída do código acima imprimiria o texto no quadro interno e no quadro externo.