Web要素の Selenium：テキストBox、ボタン、sendkeys()、click()

替え： Krishna ルンタ Krishna ルンタ
Hours 更新中

Web要素の Selenium

フォームは、Web サイトの訪問者から情報を受け取るための基本的な Web 要素です。Web フォームには、テキスト ボックス、パスワード フィールド、チェックボックス、ラジオ ボタン、ドロップダウン、ファイル入力などのさまざまな GUI 要素があります。

これらのさまざまなフォーム要素にアクセスする方法を見ていきます。 Selenium ウェブドライバー Java. Selenium すべてのフォーム要素を WebElement のオブジェクトとしてカプセル化します。 要素を見つけて、テキスト ボックスにテキストを入力したり、ボタンをクリックするなどのアクションを実行するための API を提供します。各フォーム要素にアクセスするために使用できるメソッドを確認します。

WebElement、findElement()、findElements() の概要

Selenium Web ドライバーは、単純なフォーム要素をオブジェクトとしてカプセル化します。 WebElement。

WebDriver が ID、名前、クラス、XPath、タグ名、CSS セレクター、リンク テキストなどの Web 要素のさまざまなプロパティに基づいてフォーム要素を識別するさまざまな手法があります。

Web Driver は、要素を見つけるために次の 2 つの WebElement メソッドを提供します。

  • findElement() – 単一の Web 要素を検索し、WebElement として返します。 Selenium オブジェクト。
  • findElements() – ロケーター基準に一致する WebElement オブジェクトのリストを返します。

findElement() メソッドを使用して Web ページ内の単一要素 (テキスト フィールド) を WebElement のオブジェクトとして取得するコード スニペットを見てみましょう。 複数の要素を検索する findElements() メソッドについては、後続のチュートリアルで説明します。

ステップ1） Web 要素のオブジェクトを作成するには、このパッケージをインポートする必要があります

WebElement の概要 FindElement、FindElements

ステップ2） WebDriver クラスで使用できる findElement() メソッドを呼び出して、WebElement のオブジェクトを取得する必要があります。

その方法については、以下を参照してください。

関連記事

Selenium 入力テキスト

入力ボックスは、次の 2 つのタイプのいずれかを指します。

  1. テキストフィールド– Selenium 入力された値を受け入れ、そのまま表示する入力テキスト ボックス。
  2. パスワードフィールド– 入力された値を受け入れるが、機密値が表示されないように一連の特殊文字 (通常はドットとアスタリスク) としてマスクするテキスト ボックス。

    Selenium 入力テキスト

ロケーター

findElement() メソッドは、要素へのロケーターである XNUMX つのパラメーターを受け取ります。 By.id()、By.name()、By.xpath()、By.CSSSelector() などのさまざまなロケーターは、「」ID、名前、パスなどのプロパティを使用してページ内の要素を見つけます。

Fire path などのプラグインを使用すると、要素の ID や xpath などの取得に関するヘルプを得ることができます。

サンプルサイトの使用 https://demo.guru99.com/test/login.html 以下は、ID ロケータを使用して「電子メール アドレス」テキスト フィールドを見つけ、名前ロケータを使用して「パスワード」フィールドを見つけるコードです。

ロケーター

  1. メールテキストフィールドはIDによって配置されます
  2. パスワードフィールドは名前で検索されます

キーを送信します Selenium

sendkeys() で Selenium テスト実行中にテキスト フィールドとパスワード フィールドに編集可能なコンテンツを入力するために使用されるメソッドです。これらのフィールドは、名前、クラス、ID などのロケータを使用して識別されます。これは、Web 要素で使用できるメソッドです。type メソッドとは異なり、sendkeys() メソッドはテキスト ボックス内の既存のテキストを置き換えません。

テキストの入力方法 Selenium

テキスト フィールドとパスワード フィールドにテキストを入力するには、WebElement で使用できるメソッド sendKeys() を使用します。 Selenium.

同じ例を使用すると、 https://demo.guru99.com/test/login.html サイトでは、テキスト フィールドとパスワード フィールドを見つけてテキストを入力する方法を説明します。 Selenium.

テキストイン Selenium

  1. ID ロケーターを使用して「電子メール アドレス」テキスト フィールドを見つけます。
  2. 名前ロケーターを使用して「パスワード」フィールドを見つけます。
  3. 「メールアドレス」にテキストを入力します。 Selenium sendkeys メソッド。
  4. sendKeys() メソッドを使用して、「パスワード」フィールドにパスワードを入力します。

入力値の削除 Boxes

この 晴れ（） メソッドは入力ボックス内のテキストを削除するために使用されます。 このメソッドにはパラメータは必要ありません以下のコードスニペットは、メールまたはパスワードフィールドからテキストをクリアします。

入力値の削除 Boxes

Selenium クリックボタン

この Selenium クリックボタンには click() メソッドを使用してアクセスできます。

上記の例では

  1. サインインするボタンを見つけます
  2. サイトのログインページにある「サインイン」ボタンをクリックして、サイトにログインします。

Selenium クリックボタン

Selenium 送信ボタン

送信ボタンは、フォーム全体をサーバーに送信するために使用されます。 上記のように通常のボタンと同様に Web 要素で click () メソッドを使用することも、フォーム内の Web 要素または送信ボタン自体で submit () メソッドを使用することもできます。

Selenium 送信ボタン

submit() が使用されると、WebDriver は DOM を検索して要素がどのフォームに属しているかを確認し、その submit 関数をトリガーします。

完全なコード

完全に動作するコードは次のとおりです

import org.openqa.selenium.By;		
import org.openqa.selenium.WebDriver;		
import org.openqa.selenium.chrome.ChromeDriver;		
import org.openqa.selenium.*;		

public class Form {				
    public static void main(String[] args) {									
    		
    	// declaration and instantiation of objects/variables		
        System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");					
        WebDriver driver = new ChromeDriver();					
        		
        String baseUrl = "https://demo.guru99.com/test/login.html";					
        driver.get(baseUrl);					

        // Get the WebElement corresponding to the Email Address(TextField)		
        WebElement email = driver.findElement(By.id("email"));							

        // Get the WebElement corresponding to the Password Field		
        WebElement password = driver.findElement(By.name("passwd"));							

        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        System.out.println("Text Field Set");					
         
        // Deleting values in the text box		
        email.clear();			
        password.clear();			
        System.out.println("Text Field Cleared");					

        // Find the submit button		
        WebElement login = driver.findElement(By.id("SubmitLogin"));							
                    		
        // Using click method to submit form		
        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        login.click();			
        System.out.println("Login Done with Click");					
        		
        //using submit method to submit the form. Submit used on password field		
        driver.get(baseUrl);					
        driver.findElement(By.id("email")).sendKeys("abcd@gmail.com");							
        driver.findElement(By.name("passwd")).sendKeys("abcdefghlkjl");							
        driver.findElement(By.id("SubmitLogin")).submit();					
        System.out.println("Login Done with Submit");					
         
		//driver.close();		
        		
    }		
}

トラブルシューティング

要素の検索中に NoSuchElementException() が発生した場合は、Web ドライバーがページにアクセスした時点でその要素がページ内に見つからなかったことを意味します。

  1. Chrome の Firepath または Inspect Element を使用してロケーターを再度確認します。
  2. コードで使用した値が Firepath の要素の値と異なるかどうかを確認してください。
  3. いくつかのプロパティは、いくつかの要素に対して動的です。値が異なり、動的に変化していることがわかった場合は、より信頼性が高く複雑な方法である By.xpath() または By.cssSelector() の使用を検討してください。
  4. 場合によっては、待機の問題である可能性もあります。つまり、ページが完全に読み込まれる前に Web ドライバーがコードを実行した場合などです。
  5. 暗黙的または明示的な待機を使用して、findElement() の前に待機を追加します。

まとめ

  • 以下の表は、上で説明した各タイプの要素にアクセスするためのコマンドをまとめたものです。
素子 Command 説明
入力 Box sendKeys（） テキストボックスに値を入力するために使用されます
晴れ（） テキストボックスの現在の値をクリアするために使用されます
リンク クリック（） リンクをクリックし、ページの読み込みが完了するまで待ってから次のコマンドに進むために使用されます。
送信ボタン 送信（）
  • WebDriver では、複数の SELECT 要素で複数のオプションを選択できます。
  • submit() メソッドは、フォーム内の任意の要素で使用できます。 WebDriver は、その要素が属するフォームの送信関数を自動的にトリガーします。

よろしければ：