Доступа родительских элементы Shadow DOM с помощью дочерних элементов структуры

Question

Тени Дома: В приведенной выше структуре теневого йота мы можем получить доступ к отдельным элементам, используя селен и JavaScript, как показано ниже в хроме:

В Firefox: // div [@ class = 'style-scope rock-tabs', а не (@hidden)] // div/span [содержит (текст(), '"+ AttrName +"')] /../ previous- sibling :: div/paper-icon-button [1]/iron-icon [1]

В Chrome: Мы являемся используя ниже, чтобы перейти к-иконкой железа

WebElement Attrbuttona1=Button2.findElement(By.id("contentViewManager")); 
     WebElement eAttrbutton1=expandRootElement(Attrbuttona1); 
     WebElement Attrbutton2=eAttrbutton1.findElement(By.id("contentViewManager")); 
     WebElement Attrbutton2a=Attrbutton2.findElement(By.xpath("rock-content-view[@name='entity-manage']")); 
     WebElement eAttrbutton2=expandRootElement(Attrbutton2a); 
     WebElement Attrbutton3=eAttrbutton2.findElement(By.id("content-view-container")); 
     WebElement Attrbuttona3=Attrbutton3.findElement(By.id("component")); 
     WebElement eAttrbutton3=expandRootElement(Attrbuttona3); 
     WebElement Attrbutton4=eAttrbutton3.findElement(By.className("content")); 
     WebElement AttrTagName2=Attrbutton4.findElement(By.tagName("rock-tabs")); 
     WebElement eaAttrbutton4=expandRootElement(AttrTagName2); 
WebElement Attrbutton5=eaAttrbutton4.findElement(By.id(attrType)); 
WebElement eAttr1=expandRootElement(Attrbutton5); 
      WebElement Attr2=eAttr1.findElement(By.className("group-container"));  
      WebElement Attr3=Attr2.findElement(By.tagName("rock-attribute")); 
      WebElement eAttr3=expandRootElement(Attr3); 
      WebElement Attri4=eAttr3.findElement(By.className("attribute-icons")); 
      WebElement Attr4=Attri4.findElement(By.tagName("paper-icon-button")); 
      WebElement eAttr4=expandRootElement(Attr4); 
      WebElement Attr5=eAttr4.findElement(By.tagName("iron-icon")); 

      ((JavascriptExecutor) driver).executeScript("arguments[0].click();",Attr5); 

public WebElement expandRootElement(WebElement element) { 
     WebElement ele = (WebElement) ((JavascriptExecutor) driver) 
       .executeScript("return arguments[0].shadowRoot",element); 
     return ele; 
    } 

Теперь я хочу, чтобы нажать на иконку железа для атрибута, где DIV/SPAN [текст() = «Имя продукта»] Принимая дочерний элемент в качестве основы и Мне нужно пройти назад к теневому элементу и получить значок, связанный только с этим конкретным атрибутом.

Как я могу перейти к щелчку элемента на основе другого элемента и вернуться назад, который должен поддерживаться во всех браузерах (хром и firefox)?

Answer 1

В JavaScript, если вы хотите, чтобы «пройти обратно» из элемента под названием element1:

• Чтобы получить родительский элемент, используйте его атрибут parentElement. Вы можете сделать это рекурсивно, если элемент, который вы хотите, выше в дереве.

  element1.parentElement

• Чтобы получить элемент Shadow DOM, вызвать getRootNode(), чтобы получить корень Shadow DOM и использовать его атрибут host, чтобы получить его хозяина элемента.

  element1.getRootNode().host

Примечание: Поскольку это JavaScript-код, он должен быть выполнен в executeScript() методе селена.