Selenium WebDriver에서 JavaScript를 사용하여 XPath로 요소를 가져오는 방법이 있습니까?

Selenium WebDriver에서 JavaScript를 사용하여 XPath로 요소를 가져오는 방법이 있습니까?

다음과 같은 것을 찾고 있습니다.

getElementByXpath(//html[1]/body[1]/div[1]).innerHTML

이너 좀 가져와야겠어JS를 사용하는 요소의 HTML(WebDriver는 그 자체를 찾을 수 없기 때문에 Selenium WebDriver/Java에서 그것을 사용하기 위해) 하지만 어떻게?

ID 속성을 사용할 수 있지만 모든 요소에 ID 속성이 있는 것은 아닙니다.

[고정]

자바에서 하기 위해 jsoup을 사용하고 있습니다.그건 제 필요에 딱 맞습니다.

하시면 됩니다.document.evaluate:

XPath 식 문자열을 평가하고 가능한 경우 지정된 유형의 결과를 반환합니다.

W3 규격으로 완전 문서화되어 있습니다.https://developer.mozilla.org/en-US/docs/Web/API/Document.evaluate

function getElementByXpath(path) {
  return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
}

console.log( getElementByXpath("//html[1]/body[1]/div[1]") );

<div>foo</div>

https://gist.github.com/yckart/6351935

또한 Mozilla 개발자 네트워크에 대한 훌륭한 소개가 있습니다.https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#document.evaluate

---

「」를 )XPathEvaluator:

function getElementByXPath(xpath) {
  return new XPathEvaluator()
    .createExpression(xpath)
    .evaluate(document, XPathResult.FIRST_ORDERED_NODE_TYPE)
    .singleNodeValue
}

console.log( getElementByXPath("//html[1]/body[1]/div[1]") );

<div>foo/bar</div>

Chrome Dev Tools에서 다음을 실행할 수 있습니다.

$x("some xpath")

chrome 명령줄 api의 $x와 같은 경우(여러 요소를 선택하려면) 다음을 시도해 보십시오.

var xpath = function(xpathToExecute){
  var result = [];
  var nodesSnapshot = document.evaluate(xpathToExecute, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
  for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ ){
    result.push( nodesSnapshot.snapshotItem(i) );
  }
  return result;
}

이 MDN 개요는 도움이 되었습니다.https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript

xpath 및 javascript를 사용하여 WebElement를 식별하려면 xpath 식을 평가하고 결과를 반환하는 메서드를 사용해야 합니다.

---

document.filengthttp()

document.evaluate()는 XPath 식 및 기타 지정된 파라미터를 기반으로 XPathResult를 반환합니다.

구문은 다음과 같습니다.

var xpathResult = document.evaluate(
  xpathExpression,
  contextNode,
  namespaceResolver,
  resultType,
  result
);

장소:

• xpathExpression: "XPath" 입니다.
• contextNode 이치노document콘텍스트노드로 지정합니다.
• namespaceResolver: 를 전달하고 URI를 이름 공간 접두사를 전달하고 해당 접두사에 연관된 이름 공간 URI를 나타내는 문자열을 반환해야 하는 함수.이 명령어는 XPath 자체 내에서 프레픽스를 해결하여 문서와 일치시킬 수 있도록 하기 위해 사용됩니다. null는 HTML 문서 또는 네임스페이스 접두사가 사용되지 않는 경우에 일반적입니다.
• resultType: 다음과 같은 이름 있는 상수 속성을 사용하여 반환되는 XPathResult 결과 유형에 해당하는 정수입니다.XPathResult.ANY_TYPEXPath Result 0 ~9 입니다.
• result: 결과에 사용할 기존 XPathResult. null가장 일반적이며 새로운 XPathResult를 만듭니다.

---

데모

예를 들어, 구글 홈 페이지의 검색 상자는 xpath를 사용하여 고유하게 식별할 수 있습니다.//*[@name='q'] 는 다음 명령어로 google-chrome-devtoolsConsole을 사용하여 식별할 수도 있습니다.

$x("//*[@name='q']")

스냅샷:

동일한 요소를 식별할 수도 있습니다.document.evaluate()및 xpath 표현은 다음과 같습니다.

document.evaluate("//*[@name='q']", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

스냅샷:

javascript의 document.evaluate를 사용하여 DOM 상에서 XPath 식을 실행할 수 있습니다.IE 6으로 돌아가는 브라우저에서는 어떤 식으로든 지원되고 있다고 생각합니다.

MDN: https://developer.mozilla.org/en-US/docs/Web/API/Document/evaluate

IE는 대신 selectNodes를 지원합니다.

MSDN: https://msdn.microsoft.com/en-us/library/ms754523(v=vs.85).aspx

많은 브라우저가$x(xPath)콘솔의 빌트인으로서 소개부터 JavaScript의 XPath 사용까지 스크립트에서 사용할 수 있는 유용한 스니펫을 정리한 것입니다.

스냅숏

그러면 xpath 결과 세트의 일회성 스냅샷이 제공됩니다.DOM 돌연변이 후 데이터가 오래될 수 있습니다.

const $x = xp => {
  const snapshot = document.evaluate(
    xp, document, null, 
    XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null
  );
  return [...Array(snapshot.snapshotLength)]
    .map((_, i) => snapshot.snapshotItem(i))
  ;
};

console.log($x('//h2[contains(., "foo")]'));

<h2>foo</h2>
<h2>foobar</h2>
<h2>bar</h2>

첫 번째 순서 노드

const $xOne = xp => 
  document.evaluate(
    xp, document, null,
    XPathResult.FIRST_ORDERED_NODE_TYPE, null
  ).singleNodeValue
;

console.log($xOne('//h2[contains(., "foo")]'));

<h2>foo</h2>
<h2>foobar</h2>
<h2>bar</h2>

반복기

단, 문서가 변환된 경우(문서 트리가 변경됨)는 반복이 무효가 되는 반복과invalidIteratorState의 특성XPathResult로 설정되어 있다.true, 및 aNS_ERROR_DOM_INVALID_STATE_ERR예외가 느려집니다.

function *$xIter(xp) {
  const iter = document.evaluate(
    xp, document, null, 
    XPathResult.ORDERED_NODE_ITERATOR_TYPE, null
  );

  for (;;) {
    const node = iter.iterateNext();
    
    if (!node) {
      break;
    }
    
    yield node;
  }
}

// dump to array
console.log([...$xIter('//h2[contains(., "foo")]')]);

// return next item from generator
const xpGen = $xIter('//h2[text()="foo"]');
console.log(xpGen.next().value);

<h2>foo</h2>
<h2>foobar</h2>
<h2>bar</h2>

포인트로 이동하려면 xapth를 쉽게 사용할 수 있습니다.아래 코드를 사용하여 이 작업을 수행하는 정확하고 간단한 방법입니다. 피드백을 제공해 주십시오.감사해요.

JavascriptExecutor js = (JavascriptExecutor) driver;

    //To click an element 
    WebElement element=driver.findElement(By.xpath(Xpath));
    js.executeScript(("arguments[0].click();", element);

    //To gettext

    String theTextIWant = (String) js.executeScript("return arguments[0].value;",driver.findElement(By.xpath("//input[@id='display-name']")));

추가 정보 - https://medium.com/@smeeheady/webdriver-script executor-with-discript-executor-with-and-open-and-discript-lash-get-url-bfa0f

스크린 맵에 대한 xpath 쿼리를 개발하고 테스트하는 것이 목표라고 가정합니다.그런 다음 Chrome의 개발자 도구를 사용합니다.이를 통해 xpath 쿼리를 실행하여 일치를 표시할 수 있습니다.또는 Firefox >9 에서는 Web Developer Tools 콘솔에서 동일한 작업을 수행할 수 있습니다.이전 버전에서는 x-path-finder 또는 Firebug를 사용합니다.

public class JSElementLocator {

    @Test
    public void locateElement() throws InterruptedException{
        WebDriver driver = WebDriverProducerFactory.getWebDriver("firefox");

        driver.get("https://www.google.co.in/");


        WebElement searchbox = null;

        Thread.sleep(1000);
        searchbox = (WebElement) (((JavascriptExecutor) driver).executeScript("return document.getElementById('lst-ib');", searchbox));
        searchbox.sendKeys("hello");
    }
}

올바른 로케이터를 사용하고 있는지 확인합니다.

**Different way to Find Element:**

IEDriver.findElement(By.id("id"));
IEDriver.findElement(By.linkText("linkText"));
IEDriver.findElement(By.xpath("xpath"));

IEDriver.findElement(By.xpath(".//*[@id='id']"));
IEDriver.findElement(By.xpath("//button[contains(.,'button name')]"));
IEDriver.findElement(By.xpath("//a[contains(.,'text name')]"));
IEDriver.findElement(By.xpath("//label[contains(.,'label name')]"));

IEDriver.findElement(By.xpath("//*[contains(text(), 'your text')]");

Check Case Sensitive:
IEDriver.findElement(By.xpath("//*[contains(lower-case(text()),'your text')]");

For exact match: 
IEDriver.findElement(By.xpath("//button[text()='your text']");

**Find NG-Element:**

Xpath == //td[contains(@ng-show,'childsegment.AddLocation')]
CssSelector == .sprite.icon-cancel

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

System.setProperty("webdriver.chrome.driver", "path of your chrome exe");
        WebDriver driver = new ChromeDriver();
        driver.manage().window().maximize();
        driver.get("https://www.google.com");

            driver.findElement(By.xpath(".//*[@id='UserName']")).clear();
            driver.findElement(By.xpath(".//*[@id='UserName']")).sendKeys(Email);

언급URL : https://stackoverflow.com/questions/10596417/is-there-a-way-to-get-element-by-xpath-using-javascript-in-selenium-webdriver