Selenium似乎看不见网页元素 [英] Webpage element seems to be invisible to Selenium

问题描述

我试图单击/发送键到网页上标有Browse的按钮，无论我如何尝试，Selenium都找不到它.

使用Selenium的IDE，我可以收集以下信息:

id=uploadField
name=uploadField
css=#uploadField
dom:name = document.uploadForm.uploadField
xpath:attributes = //input[@id='uploadField']
xpath:idRelative = //div[@id='browseBtnContainer']/form/input[4]
dom:index = document.uploadForm.elements[3]
xpath:position = //input[4]

我已经尝试了以下所有方法.序列，所有序列都抛出一个NoSuchElementException.只有一个iframe，我尝试切换到iframe，但是没有用.

WebElement browse = driver.findElement(By.id("uploadField"));
WebElement browse1 = driver.findElement(By.name("uploadField"));
WebElement browse2 = driver.findElement(By.cssSelector("#uploadField"));
WebElement browse3 = driver.findElement(By.cssSelector("uploadField")); // just in case
WebElement browse4 = driver.findElement(By.xpath("uploadField")); // attributes
WebElement browse5 = driver.findElement(By.xpath("//div[@id='browseBtnContainer']/form/input[4]")); // idrelative
WebElement browse6 = driver.findElement(By.xpath("//input[4]")); // position

代码的容器部分使我感到困惑.我不知道如何访问容器中的元素，我在Google上找到的任何内容都只是告诉我使用xpath，而我似乎找不到.

我不正确地使用By.xpath吗?如何生成网页上每个元素的列表? 以下是相关的HTML源代码:

   <div id="ext-comp-1022" class=" x-panel x-border-panel" style="left: 0px; top: 0px; width: 1077px;">
      <div id="ext-gen27" class="x-panel-bwrap">
         <div id="ext-gen28" class="x-panel-body x-panel-body-noheader"     style="overflow: auto; width: 1075px; height: 502px;">
            <div id="ext-comp-1023" class=" x-panel x-panel-noborder">
               <div id="stepOnePanel"/>
               <div id="stepTwoPanel"/>
               <div id="stepThreePanel"/>
               <div id="stepOnePanel" class="step-container" style="margin:20px 20px 20px 30px;">
                 <div class="step-title" style="background-color:transparent;background-repeat:no-repeat;background-position:top left;background-image:url(/assets/icons/medium/icon-1.png );padding:12px 0px 0px 50px;height:30px;font-weight:bold;">Start by selecting the ZIP file which contains your images (20MB max)</div>
                <div id="ext-gen71" style="padding-left:70px;overflow:auto;">
                      <div id="ext-comp-1024" class=" x-panel x-panel-noborder">
                         <div id="ext-gen74" class="x-panel-bwrap">
                            <div id="ext-gen75" class="x-panel-body x-panel-body-noheader x-panel-body-noborder">
                                <div style="padding-top:2px">
                                   <div id="browseBtnContainer" style="float:left;width:85px;margin-top:-2px">
                                     <table id="browseBtn" class="x-btn stepBtn x-btn-noicon x-btn-over" cellspacing="0" style="width: 79px;">
                                     <form enctype="multipart/form-data" target="hiddenUploadFrame" method="post" action="/uploader/upload?actingAsUserId=pleach&currentAccountId=bmwofreading&uploadAccountId=bmwofreading&ccmode=multiwindow" name="uploadForm">
                                         <input id="doNotResize" type="checkbox" style="display:none" value="true" name="doNotResize"/>
                                         <input id="pdfConvert" type="checkbox" style="display:none" value="true" name="pdfConvert"/>
                                         <input type="hidden" value="false" name="previewNeeded"/>
                                         <input id="uploadField" type="file" size="1" style="position: absolute; top: 0px; left: -19px; opacity: 0; cursor: pointer; height: 22px;" name="uploadField"/>

解决方案

您需要切换到frame才能与其中的元素进行交互

driver.switchTo.frame("id"); //using the frame id attribute
// or
driver.switchTo.frame("name"); //using the frame name attribute
// or
WebElement frame = driver.findElement(...);
driver.switchTo.frame(frame); //using the frame as WebElement

然后切换回

driver.switchTo().defaultContent();

I'm trying to click/sendKeys to a button labelled Browse on a webpage, and no matter what I try, Selenium fails to find it.

Using Selenium's IDE, I can gather the following information:

id=uploadField
name=uploadField
css=#uploadField
dom:name = document.uploadForm.uploadField
xpath:attributes = //input[@id='uploadField']
xpath:idRelative = //div[@id='browseBtnContainer']/form/input[4]
dom:index = document.uploadForm.elements[3]
xpath:position = //input[4]

And I've tried all of the following By. sequences, all of which throw a NoSuchElementException. There is only one iframe and I tried to switch to iframe but it didn't work.

WebElement browse = driver.findElement(By.id("uploadField"));
WebElement browse1 = driver.findElement(By.name("uploadField"));
WebElement browse2 = driver.findElement(By.cssSelector("#uploadField"));
WebElement browse3 = driver.findElement(By.cssSelector("uploadField")); // just in case
WebElement browse4 = driver.findElement(By.xpath("uploadField")); // attributes
WebElement browse5 = driver.findElement(By.xpath("//div[@id='browseBtnContainer']/form/input[4]")); // idrelative
WebElement browse6 = driver.findElement(By.xpath("//input[4]")); // position

The container portion of the code confuses me. I don't know how to access the elements in a container, and anything I find on google just tells me to use the xpath, of which I can't seem to find.

Am I using the By.xpath incorrectly? How can I generate a list of every single element on the webpage? Here is the relevant HTML source code:

   <div id="ext-comp-1022" class=" x-panel x-border-panel" style="left: 0px; top: 0px; width: 1077px;">
      <div id="ext-gen27" class="x-panel-bwrap">
         <div id="ext-gen28" class="x-panel-body x-panel-body-noheader"     style="overflow: auto; width: 1075px; height: 502px;">
            <div id="ext-comp-1023" class=" x-panel x-panel-noborder">
               <div id="stepOnePanel"/>
               <div id="stepTwoPanel"/>
               <div id="stepThreePanel"/>
               <div id="stepOnePanel" class="step-container" style="margin:20px 20px 20px 30px;">
                 <div class="step-title" style="background-color:transparent;background-repeat:no-repeat;background-position:top left;background-image:url(/assets/icons/medium/icon-1.png );padding:12px 0px 0px 50px;height:30px;font-weight:bold;">Start by selecting the ZIP file which contains your images (20MB max)</div>
                <div id="ext-gen71" style="padding-left:70px;overflow:auto;">
                      <div id="ext-comp-1024" class=" x-panel x-panel-noborder">
                         <div id="ext-gen74" class="x-panel-bwrap">
                            <div id="ext-gen75" class="x-panel-body x-panel-body-noheader x-panel-body-noborder">
                                <div style="padding-top:2px">
                                   <div id="browseBtnContainer" style="float:left;width:85px;margin-top:-2px">
                                     <table id="browseBtn" class="x-btn stepBtn x-btn-noicon x-btn-over" cellspacing="0" style="width: 79px;">
                                     <form enctype="multipart/form-data" target="hiddenUploadFrame" method="post" action="/uploader/upload?actingAsUserId=pleach&currentAccountId=bmwofreading&uploadAccountId=bmwofreading&ccmode=multiwindow" name="uploadForm">
                                         <input id="doNotResize" type="checkbox" style="display:none" value="true" name="doNotResize"/>
                                         <input id="pdfConvert" type="checkbox" style="display:none" value="true" name="pdfConvert"/>
                                         <input type="hidden" value="false" name="previewNeeded"/>
                                         <input id="uploadField" type="file" size="1" style="position: absolute; top: 0px; left: -19px; opacity: 0; cursor: pointer; height: 22px;" name="uploadField"/>

解决方案

You need to switch to the frame in order to interact with the elements in it

driver.switchTo.frame("id"); //using the frame id attribute
// or
driver.switchTo.frame("name"); //using the frame name attribute
// or
WebElement frame = driver.findElement(...);
driver.switchTo.frame(frame); //using the frame as WebElement

And to switch back

driver.switchTo().defaultContent();

这篇关于Selenium似乎看不见网页元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！