OpenQA.Selenium.WebDriverException:未知错误:a.tagName.toUpperCase不是通过Selenium和C#具有reactJS元素的函数 [英] OpenQA.Selenium.WebDriverException : unknown error: a.tagName.toUpperCase is not a function with reactJS elements through Selenium and C#

问题描述

我有一个困扰自己的问题，我有一个方法可以查找并检查是否所有元素都在页面上，该方法的一部分检查是否启用了页面元素.

I have an issue that has stumped me, I have a method that finds and checks if all elements are on a page, part of that method checks if a page element is enabled.

if (Driver.Instance.FindElement(identifier).Enabled == false)
 {
    // do some stuff
 }

但是，If语句失败并出现以下错误:

However, the If statement is failing with the following error:

StackTrace:at OpenQA.Selenium.Remote.RemoteWebDriver.UnpackAndThrowOnError(Response errorResponse)
at OpenQA.Selenium.Remote.RemoteWebDriver.Execute(String driverCommandToExecute, Dictionary`2 parameters)
at OpenQA.Selenium.Remote.RemoteWebElement.Execute(String commandToExecute, Dictionary`2 parameters)
at OpenQA.Selenium.Remote.RemoteWebElement.get_Enabled()
...
OpenQA.Selenium.WebDriverException : unknown error: a.tagName.toUpperCase is not a function
(Session info: chrome=71.0.3578.98)
(Driver info: chromedriver=2.45.615291 (ec3682e3c9061c10f26ea9e5cdcf3c53f3f74387),platform=Windows NT 10.0.17134 x86_64)

此方法经常被调用，并且可以在类似的情况下与许多其他测试用例一起使用，没有问题，但是，当尝试与以下元素进行交互时，我得到了上面显示的错误:

This method is constantly called and works with numerous other test cases under similar circumstances, without issue, however, when trying to interact with the following element I get the error shown above:

<div class="sc-gGBfsJ lhiRYE" span="5">
   <svg aria-hidden="true" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11 sc-jnlKLf dmaYnw" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512" name="tag-create-modal__dismiss-cross">
  <path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"></path>
   </svg>
   <div class="sc-hdPSEv kfkXT" id="CreateTagPropSheet__container" name="undefined__container">
  <div class="sc-nrwXf egtFZS">
     <div class="sc-fKGOjr bfXSai sc-ekkqgF dATqpE">
        <h3 class="sc-cpHetk bdaBtw sc-crNyjn fXZflb" id="propertySheet__heading--undefined" name="propertySheet__heading--undefined">Create Tag</h3>
     </div>
  </div>
  <form name="create-Tag__form">
     <div class="sc-nrwXf egtFZS">
        <div class="sc-fKGOjr bfXSai sc-ekkqgF dATqpE">
           <div class="sc-hycgNl KoKFR"><label class="sc-jvEmr jErbdW sc-iBmynh kxfLCa">Tag Name</label></div>
           <div class="sc-chAAoq GJbAH" id="propertySheet__select--tagNameContainer" name="tagNameContainer">
              <div class="sc-dTLGrV dLLsoX"><input class="sc-ivVeuv fMqabh" color="normal" id="propertySheet__select--tagName" name="tagName" type="text" autocomplete="on" value=""></div>
           </div>
        </div>
     </div>
     <div class="sc-nrwXf egtFZS">
        <div class="sc-fKGOjr bfXSai sc-ekkqgF dATqpE">
           <div class="sc-hycgNl KoKFR"><label class="sc-jvEmr jErbdW sc-iBmynh kxfLCa">System Level Tag</label></div>
           <div class="sc-chPdSV Ekqp" id="isSystemLevelCheckContainer" name="isSystemLevelTagContainer">
              <input class="sc-kgoBCf fZucFc" type="checkbox" id="isSystemLevelCheck" name="isSystemLevelTag">
              <div class="sc-kGXeez clAVjW"></div>
           </div>
        </div>
     </div>
     <div class="sc-nrwXf egtFZS">
        <div class="sc-fKGOjr bfXSai sc-ekkqgF dATqpE"><button class="sc-bhlBdH gEVPJV" id="propertySheet__button--create-tag__Button" name="create-tag__Button" color="success">Create Tag</button></div>
     </div>
  </form>
   </div>
</div>

我想知道它是否与元素本身有关，并且上面的代码是使用react构建的我们网站的代码段，其中这些元素是有条件呈现的.

I'm wondering if it has something to do with the element itself, and the above code is a snippet for our website that is built using react, where these elements are conditionally rendered.

任何人对什么/将/可能导致此问题有任何想法，将不胜感激...

DOes anybody have any ideas on what is/would/could be causing this issue would be greatly appreciated...

推荐答案

Element.tagName

按照> Element.tagName > Element接口的tagName只读属性返回在其上被调用的元素的标签名称.例如，如果元素是<img>，则其tagName属性是"IMG"(对于HTML文档；对于XML/XHTML文档，情况可能会有所不同).

Element.tagName

As per Element.tagName the tagName read-only property of the Element interface returns the tag name of the element on which it's called. For example, if the element is an <img>, its tagName property is "IMG" (for HTML documents; it may be cased differently for XML/XHTML documents).

• 语法:

• Syntax:

elementName = Element.tagName;

值:指示元素标签名称的字符串.该字符串的大写字母取决于文档类型:

Value: A string indicating the element's tag name. This string's capitalization depends on the document type:

• 对于表示HTML文档的DOM树，返回的标签名称始终为规范的大写形式.例如，在<div>元素上调用的tagName返回"DIV".
• 在将XML DOM树中的元素的标记名称写入原始XML文件的相同情况下，将返回它们.如果XML文档包含标签"，则tagName属性的值为"SomeTag".

• For DOM trees which represent HTML documents, the returned tag name is always in the canonical upper-case form. For example, tagName called on a <div> element returns "DIV".
• The tag names of elements in an XML DOM tree are returned in the same case in which they're written in the original XML file. If an XML document includes a tag "", then the tagName property's value is "SomeTag".

进一步，根据 Document Object Model (Core) Level 1 :

请注意，与DOM的所有操作一样，这在XML中是保留大小写的.无论源HTML文档中的大小写如何，HTML DOM均以规范的大写形式返回HTML元素的tagName.

Note that this is case-preserving in XML, as are all of the operations of the DOM. The HTML DOM returns the tagName of an HTML element in the canonical uppercase form, regardless of the case in the source HTML document.

解决方案

您已经提到代码是使用react 的代码段，因此在启用检查元素之前，请诱导 WebDriverWait 以获得可见性所需的元素，如下所示:

Solution

As you have mentioned code is a snippet using react so before checking for the element is Enabled induce WebDriverWait for the visibility of the desired element as follows:

if (Driver.Instance.FindElement(identifier).Enabled == false)
if (new WebDriverWait(driver, TimeSpan.FromSeconds(10)).Until(ExpectedConditions.ElementIsVisible(By.XPath("element_xpath"))).Enabled == false)
 {
    // do some stuff
 }

这篇关于OpenQA.Selenium.WebDriverException:未知错误:a.tagName.toUpperCase不是通过Selenium和C#具有reactJS元素的函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！