org.openqa.selenium.NoSuchElementException:尝试通过 CssSe-Java问题

org.openqa.selenium.NoSuchElementException: Returned node (null) was not a DOM element when trying to locate card-fields-iframe by CssSelector(org.openqa.selenium.NoSuchElementException:尝试通过 CssSelector 定位 card-fields-iframe 时返回的节点(null)不是 DOM 元素) - IT屋-程

本文介绍了org.openqa.selenium.NoSuchElementException:尝试通过 CssSelector 定位 card-fields-iframe 时返回的节点(null)不是 DOM 元素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试通过部分 id 定位 iframe.对于这种方法，我使用了:driver.switchTo().frame(driver.findElement(By.cssSelector("iframe[id*='card-fields-number']"))); 我也试过xpath.

 driver.switchTo().frame(driver.findElement(By.xpath("//iframe[contains(@id,'card-fields-number')]")));

但是，我仍然收到此异常:

org.openqa.selenium.NoSuchElementException: 返回的节点(null)不是 DOM 元素

我发现当我为 HtmlUnit 启用 javascript 时，它能够找到框架并切换到它.我宁愿不启用 javascript，因为它对我来说运行速度非常慢，并增加了不必要的延迟.

iFrame HTML 代码:

</pre><p>iFrame ID 是动态的，所以我使用部分 ID.</p><p>网站链接:</p><p>I am trying to locate an iframe by partial id. For this method, I used:
 <code>driver.switchTo().frame(driver.findElement(By.cssSelector("iframe[id*='card-fields-number']")));</code> I have also tried xpath. </p><pre><code class='language-java'> driver.switchTo().frame(driver.findElement(By.xpath("//iframe[contains(@id,'card-fields-number')]")));
</code></pre><p>However, I still receive this exception: </p>

<p><code>org.openqa.selenium.NoSuchElementException: Returned node (null) was not a DOM element</code></p>

<p>I found out that when I enable javascript for HtmlUnit, it is able to locate the frame, and switch to it. I would rather not enable javascript as it runs very slow for me, and adds unneeded delay. </p>

<p>iFrame HTML code:</p><pre><code class='language-java'>&lt;iframe class="card-fields-iframe" frameborder="0" id="card-fields-number-7pbvqg7azsf00000" name="card-fields-number-7pbvqg7azsf00000" scrolling="no" src="https://checkout.shopifycs.com/number?identifier=438599641d0ed8fe61c161d72e62b5f8&amp;amp;location=https%3A%2F%2Fshopnicekicks.com%2F2192362%2Fcheckouts%2F438599641d0ed8fe61c161d72e62b5f8&amp;amp;dir=ltr&amp;amp;fonts[]=Lato" title="Field container for: Card number" style="height: 43px;"&gt;&lt;/iframe&gt;
</code></pre><p>iFrame ID is dynamic, so that is why I resort to using partial ID.</p>

<p>Website link: https://shopnicekicks.com/checkout
You must fill everything out until you reach the last page, which is the credit card information page.</p>

<p><strong>Update</strong>
The iFrame is inside of the parent frame. 
Parent Frame: </p><pre><code class='language-java'>&lt;iframe srcdoc="&lt;script&gt;!function(){var e=function(e){var t={exports:{}};return e.call(t.exports,t,t.exports),t.exports},t=function(){function e(e,t){for(var n=0;n&lt;t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,&amp;quot;value&amp;quot;in i&amp;amp;&amp;amp;(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&amp;amp;&amp;amp;e(t.prototype,n),i&amp;amp;&amp;amp;e(t,i),t}}(),n=function(e,t){if(!(e instanceof t))throw new TypeError(&amp;quot;Cannot call a class as a function&amp;quot;)},i=function(e){return e&amp;amp;&amp;amp;e.__esModule?e:{&amp;quot;default&amp;quot;:e}},o=e(function(e,i){&amp;quot;use strict&amp;quot;;Object.defineProperty(i,&amp;quot;__esModule&amp;quot;,{value:!0});var o=function(){function e(){var t=this;n(this,e),this.calls=[],window.ga=function(){for(var e=arguments.length,n=Array(e),i=0;i&lt;e;i++)n[i]=arguments[i];return t.gaCall(n)}}return t(e,[{key:&amp;quot;gaCall&amp;quot;,value:function(e){var t=this;this.calls.push(e),clearTimeout(this.timeout),this.timeout=setTimeout(function(){t.calls.length&gt;0&amp;amp;&amp;amp;t.sendMessage()},0)}},{key:&amp;quot;listen&amp;quot;,value:function(){var e=this;window.addEventListener(&amp;quot;message&amp;quot;,function(t){return e.receiveMessage(t)},!1)}},{key:&amp;quot;sendMessage&amp;quot;,value:function(){window.parent.postMessage({type:&amp;quot;analytics&amp;quot;,calls:this.calls},this.origin),this.calls=[]}},{key:&amp;quot;receiveMessage&amp;quot;,value:function(e){if(e.source===window.parent&amp;amp;&amp;amp;&amp;quot;checkout_context&amp;quot;===e.data.type){this.origin=e.origin,window.Shopify=e.data.Shopify,window.__st=e.data.__st;try{window.additionalScripts()}catch(e){console.error(&amp;quot;User script error: &amp;quot;,e)}}}}]),e}();i[&amp;quot;default&amp;quot;]=o});e(function(){&amp;quot;use strict&amp;quot;;var e=i(o);!function(){(new e[&amp;quot;default&amp;quot;]).listen()}()})}(&amp;quot;undefined&amp;quot;!=typeof global?global:&amp;quot;undefined&amp;quot;!=typeof window&amp;amp;&amp;amp;window); window.additionalScripts = function () {};&lt;/script&gt;" src="https://checkout.shopify.com/2192362/sandbox/google_analytics_iframe" onload="this.setAttribute('data-loaded', true)" sandbox="allow-scripts" id="google-analytics-sandbox" tabindex="-1" class="visually-hidden" style="display:none" aria-hidden="true" data-loaded="true"&gt;&lt;/iframe&gt;
</code></pre><p>
</p><div class="h2_lin"> 解决方案 </div><p>This error message...</p><pre><code class='language-java'>org.openqa.selenium.NoSuchElementException: Returned node (null) was not a DOM element
</code></pre><p>...implies that there was <em>no such element</em> found as the returned node was <strong>null</strong> or was not a DOM element.</p>

<p>This is still a open issue with <em>htmlunit-driver</em> team.</p>

<p>However there are certain things which you need to take care as follows:</p>

<ul>
<li>First and foremost, all the modern browsers come with built-in support for JavaScript.</li>
<li>HtmlUnitDriver is a <em>WebDriver</em> compatible driver for HtmlUnit headless browser. It has fairly good <em>JavaScript</em> support (which is constantly improving) and is able to work even with quite complex AJAX libraries, simulating <em>Chrome</em>, <em>Firefox</em> or <em>Internet Explorer</em> depending on the configuration used. So ideally while working with <em>HtmlUnitDriver</em>, <em>JavaScript</em> must be enabled, else <em>HtmlUnitDriver</em> may not ne able to detect the <em>JavaScript</em> based elements.

<ul>
<li>You can find a detailed discussion in HtmlUnitDriver does not load javascript when navigating a page from an url</li>
</ul></li>
<li>The element seems to be a <em>credit card field</em> and historically <em>Credit Card Number</em>, etc resides within <code>&lt;iframes&gt;</code>.

<ul>
<li>You can find a detailed discussion in Unable to locate element of credit card number using selenium python</li>
</ul></li>
<li>Whenever an <code>&lt;iframe&gt;</code> is in play <strong><code>src</code></strong> attribute of the <code>&lt;iframe&gt;</code> tag plays a vital role.

<ul>
<li>You can find a detailed discussion in Ways to deal with #document under iframe</li>
</ul></li>
<li>As per best practices while switching <code>&lt;iframe&gt;</code> you need to induce <em>WebDriverWait</em> for the desired frame to be available and switch to it.

<ul>
<li>We have discussed this aspect in your previous question Selenium can't locate iframe</li>
</ul></li>
</ul>

<p>So you can use either of the following solutions:</p>

<ul>
<li><p><em>cssSelector</em>:</p><pre><code class='language-java'>new WebDriverWait(driver, 10).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.cssSelector("iframe.card-fields-iframe[id^='card-fields-number-'][src*='shopifycs']")));
</code></pre><p></li>
<li><p><em>xpath</em>:</p><pre><code class='language-java'>new WebDriverWait(driver, 10).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.xpath("//iframe[@class='card-fields-iframe' and starts-with(@id,'card-fields-number-')][contains(@src, 'shopifycs')]")));
</code></pre><p></li>
</ul>

<h2>Update</h2>

<p>See the snapshot of the <code>CssSelector</code> which identifies the element perfecto as per the HTML you have provided:</p>

<p></p>

                        <p>这篇关于org.openqa.selenium.NoSuchElementException:尝试通过 CssSelector 定位 card-fields-iframe 时返回的节点(null)不是 DOM 元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！</p>

问题描述

基础教程推荐