Selenium Webdriver で iFrame を処理する方法: switchTo()

Selenium Webdriver の iFrame

Selenium Webdriver の iFrame 別の Web ページに埋め込まれた Web ページまたはインライン フレーム、または別の HTML ドキュメント内に埋め込まれた HTML ドキュメントです。 iframe は、広告などの他のソースからのコンテンツを Web ページに追加するためによく使用されます。 iframe は次のように定義されます。IFRAME>タグ。

iFrame を識別する方法

ページを見たり Firebug を調べたりするだけではフレームを検出できません。

下の画像に注目してください。表示されている広告は Iframe です。Firebug を使用して検査するだけでは、それを特定したり認識したりすることはできません。 問題は、iframe をどのように識別できるかということです。

Iframe を特定する
Selenium WebDriver を使用して iframe を識別する方法

以下の方法を使用して Selenium のフレームを識別できます。

  • 要素を右クリックし、「このフレーム」のようなオプションが見つかったら、それは iframe です。(上の図を参照してください)。
  • ページ上で右クリックし、「ページのソースを表示」をクリックして「iframe」で検索し、「iframe」を含むタグ名が見つかった場合は、そのページが iframe で構成されているということになります。

上の図では、「このフレーム' オプションは右クリックすると使用できるため、これが iframe であることがわかります。

以下のスニペットを使用して、iframe の総数を特定することもできます。

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

WebDriver コマンドを使用して Selenium でフレームを処理する方法

基本的に、Selenium では 3 つの方法を使用して要素を切り替え、フレームを処理できます。

  • インデックス別
  • 名前または ID による
  • Web要素別

方法 1: インデックスによるフレームへの切り替え

インデックスは、Selenium でのフレーム処理の属性の XNUMX つであり、これを介してそれに切り替えることができます。

iframe のインデックスは「0」から始まります。

ページ内に 100 個のフレームがある場合、インデックスを使用して Selenium のフレームに切り替えることができるとします。

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

方法 2: 名前または ID でフレームに切り替える

Name と ID は、Selenium でフレームを処理するための属性であり、これを介して iframe に切り替えることができます。

  • driver.switchTo().frame("iframe1");
  • driver.switchTo().frame("id of the element");

ID を介して iframe に切り替える例:

Web要素でフレームに

以下の URL を通じてこの iframe にアクセスできます。 https://demo.guru99.com/test/guru99home/

WebDriver コマンドを使用して Selenium でフレームを処理する

iframe を直接クリックすることはできません XPath iframeなので。 まずフレームに切り替える必要があり、それから xpath を使用してクリックできます。

ステップ1)

WebDriver driver = new FirefoxDriver();

driver.get("https://demo.guru99.com/test/guru99home/");

driver.manage().window().maximize();

  • を初期化します Firefox ドライバ。
  • iframeを構成する「guru99」サイトに移動します。
  • ウィンドウを最大化しました。

ステップ2)

driver.switchTo().frame("a077aa5e");
  • このステップでは、Firebug を介して検査して iframe の ID を見つける必要があります。
  • 次に、ID を介して iframe に切り替えます。

ステップ3)

driver.findElement(By.xpath("html/body/a/img")).click();
  • ここでは、クリックされる要素の xpath を調べる必要があります。
  • 上記の Web ドライバー コマンドを使用して要素をクリックします。

完全なコードは次のとおりです。

public class SwitchToFrame_ID {
public static void main(String[] args) {

		WebDriver driver = new FirefoxDriver(); //navigates to the Browser
	    driver.get("https://demo.guru99.com/test/guru99home/"); 
	       // navigates to the page consisting an iframe

	       driver.manage().window().maximize();
	       driver.switchTo().frame("a077aa5e"); //switching the frame by ID

			System.out.println("********We are switch to the iframe*******");
     		driver.findElement(By.xpath("html/body/a/img")).click();
  		    //Clicks the iframe
       
  			System.out.println("*********We are done***************");
      }
}		

出力:

ブラウザは上記の iframe で構成されるページに移動し、iframe をクリックします。

方法3: Web要素でフレームに切り替える

web 要素を使用して iframe に切り替えることもできます。

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

メインフレームに戻す方法

iframe から出なければなりません。

親フレームに戻るには、switchTo().parentFrame() を使用できます。メイン (またはほとんどの親) フレームに戻りたい場合は、switchTo().defaultContent() を使用できます。

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

ID または Web 要素を使用してフレームを切り替えることができない場合のフレームの切り替え方法:

ページに 100 個のフレームがあり、使用可能な ID がない場合、この場合、どの iframe から必須要素がロードされているかがわかりません (フレームのインデックスがわからない場合がこれにあたります)また)。

上記の問題の解決策は、要素がロードされる iframe のインデックスを見つけて、そのインデックスを介して iframe に切り替える必要があることです。

以下のスニペットを使用して、要素がロードされているフレームのインデックスを見つける手順は次のとおりです。

ステップ1)

WebDriver driver = new FirefoxDriver();
driver.get("https://demo.guru99.com/test/guru99home/");
driver.manage().window().maximize();
  • を初期化します Firefox ドライバ。
  • iframe を構成する「guru99」サイトに移動します。
  • ウィンドウを最大化しました。

ステップ2)

int size = driver.findElements(By.tagName("iframe")).size();
  • 上記のコードは、タグ名「iframe」を使用して、ページ内に存在する iframe の合計数を見つけます。

ステップ3)

目的 このステップでは、iframe のインデックスを見つけます。

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

上記の「forloop」はページ内のすべての iframe を反復し、必要な iframe が見つかった場合は「1」を出力し、それ以外の場合は「0」を返します。

ステップ 3 までの完全なコードは次のとおりです。

public class IndexOfIframe {
public static void main(String[] args) {
	    WebDriver driver = new FirefoxDriver();
	    driver.get("https://demo.guru99.com/test/guru99home/");  
	    driver.manage().window().maximize();
	    //driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS);
	    int size = driver.findElements(By.tagName("iframe")).size();

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

このプログラムを実行すると、出力は次のようになります。

出力:

1
0
0
0	
0
0

出力を確認すると、0 と 1 が連続していることがわかります。

  • 出力内で「1」が見つかった場合、それは要素がロードされているフレームのインデックスです。
  • iframeのインデックスは「0」から始まるので、1の中に1があればst配置した場合、インデックスは 0 になります。
  • 1 分の 3 を見つけたらrd 場所、インデックスは 2 です。

インデックスが見つかったら、for ループをコメントアウトできます。

ステップ4)

driver.switchTo().frame(0);
  • 要素のインデックスが見つかったら、上記のコマンドを使用してフレームを切り替えることができます。
  • driver.switchTo().frame(ステップ 3 で見つかったインデックス);

ステップ5)

driver.findElement(By.xpath("html/body/a/img")).click();
  • 上記のコードは、iframe または iframe 内の要素をクリックします。

したがって、完全なコードは次のようになります。

public class SwitchToframe   {
public static void main(String[] args) throws NoSuchElementException{
	    WebDriver driver = new FirefoxDriver();
	    driver.get("https://demo.guru99.com/test/guru99home/");  
	    driver.manage().window().maximize();
	    //int size = driver.findElements(By.tagName("iframe")).size();
	
	/*for(int i=0; i<=size; i++){
	    driver.switchTo().frame(i);
	    int total=driver.findElements(By.xpath("html/body/a/img")).size();
		System.out.println(total);
	    driver.switchTo().defaultContent(); //switching back from the iframe
	 }*/
	            
		//Commented the code for finding the index of the element
	    driver.switchTo().frame(0); //Switching to the frame
		System.out.println("********We are switched to the iframe*******");
		driver.findElement(By.xpath("html/body/a/img")).click();
		
		//Clicking the element in line with Advertisement
	    System.out.println("*********We are done***************");
	        }
	    }

出力:

ブラウザは上記の iframe で構成されるページに移動し、iframe をクリックします。

Selenium のネストされたフレームの概念

以下の画像に示すように、内側に他のフレームが XNUMX つあり、要件として外側のフレームと内側のフレームにテキストを印刷するとします。

ネストされたフレームの場合、

  • まず、iframe の Index または ID によって外側のフレームに切り替える必要があります。
  • 外側のフレームに切り替えると、外側のフレーム内の iframe の総数がわかります。
  • 既知の方法のいずれかを使用して、内側のフレームに切り替えることができます。

枠の外から出るときは、内枠から外枠に入ったときと同じ順番で外に出なければなりません。

Selenium のネストされたフレームの概念
Selenium WebDriver のネストされた iFrame

上記のネストされたフレームの HTML コードは次のとおりです。

Selenium のネストされたフレームの概念

上記の HTML コードは、別の iframe タグ内の iframe タグ (緑色で強調表示されている) を明確に説明しており、ネストされた iframe の存在を示しています。

外枠に切り替えて外枠に文字を印刷する手順は以下のとおりです。

ステップ1)

	WebDriver driver=new 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 Frames --" + size);
	    
		// prints the total number of frames 
		driver.switchTo().frame(0); // Switching the Outer Frame    		
	    System.out.println (driver.findElement(By.xpath("xpath of the outer element ")).getText());
  • 外枠に切り替えます。
  • 外枠に文字を印刷します。

外枠に切り替えたら、外枠の内側に内枠が存在するかどうかを知る必要があります。

ステップ2)

size = driver.findElements(By.tagName("iframe")).size();
    // prints the total number of frames inside outer frame           
    System.out.println("Total Frames --" + size);
  • 外側のフレーム内の iframe の総数を求めます。
  • サイズが「0」と見つかった場合は、フレーム内に内部フレームがありません。

ステップ3)

driver.switchTo().frame(0); // Switching to innerframe
System.out.println(driver.findElement(By.xpath("xpath of the inner element ")).getText());
  • 内枠に切り替えます
  • 内枠に文字を印刷します。

完全なコードは次のとおりです。

public class FramesInsideFrames {
public static void main(String[] args) {
WebDriver driver=new 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 Frames --" + size);
               
		// prints the total number of frames 
		driver.switchTo().frame(0); // Switching the Outer Frame    		
	    System.out.println (driver.findElement(By.xpath("xpath of the outer element ")).getText());

		//Printing the text in outer frame
		size = driver.findElements(By.tagName("iframe")).size();
	    // prints the total number of frames inside outer frame           
                                                                                                          
	    System.out.println("Total Frames --" + size);
	    driver.switchTo().frame(0); // Switching to innerframe
	    System.out.println(driver.findElement(By.xpath("xpath of the inner element ")).getText());
		
		//Printing the text in inner frame
		driver.switchTo().defaultContent();
	}
}

出力:

上記のコードの出力では、内枠と外枠にテキストが印刷されます。