如何使用Selenium Webdriver在iframe中的卡字段输入字段中输入16位数字

Question

这里我在iframe下有一个输入字段，我想在此输入字段中输入16位数字。但是我收到异常'NoSuchElementException'。

但是我在xpaths下面找到：

.//iframe[@id='braintree-hosted-field-number']

.//input[@id='credit-card-number']

在Dom中，两个Xpath都可用，但无法在其中输入值。

Answer 1

16位数字卡输入字段在<iframe>内，因此必须在元素上调用sendKeys()：

• 将WebDriverWait表示为所需的frameToBeAvailableAndSwitchToIt()。
• 将WebDriverWait表示为所需的elementToBeClickable()。

• 您可以使用以下Locator Strategies中的任何一个：

  • 使用CSS_SELECTOR：

    new WebDriverWait(driver, 10).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.cssSelector("iframe#braintree-hosted-field-number")));
    new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.cssSelector("button.nsg-button"))).sendKeys("1234567890987654");
    

  • 使用XPATH：

    new WebDriverWait(driver, 10).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.xpath("//iframe[@id='braintree-hosted-field-number']")))
    new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.xpath("//button[@class='nsg-button']"))).sendKeys("1234567890987654");
    

---

参考

您可以在以下位置找到相关的讨论：

• org.openqa.selenium.NoSuchElementException: Returned node (null) was not a DOM element when trying to locate card-fields-iframe by CssSelector

Answer 2

首先切换到相框

WebElement Frame = driver.findElement(By.xpath("//iframe[@id='braintree-hosted-field-number']"));
driver.switchTo().frame(Frame);
.
.
driver.findElement(By.xpath(".//input[@id='credit-card-number']"));
.
.
driver.switchTo().defaultContent() // Switch back to default window