Node.js의 Selenium-webdriver에 E2E 시험 쓰기를 위한 Tips. 처음부터 알고 있으면 얼마나 잘 했는가.

Selenium의 공식 문서는 여기

찾아도 좀처럼 발견되지 않았다.
여기.
h tps : // 세이 니우 mhq. 기주 b. 이오/세이니우m/도cs/아피/그럼 sc리pt/그리고 x. HTML
공식 문서를 보는 것이 1번이므로, Qiita로 알게 된 신경이 쓰이는 사람은 이 링크처만 봐 두어.

Chrome의 개발자 도구에 Xpath를 만들어주세요.

계층이 깊은 DOMElement이거나, SPA로 여러가지 컴포넌트를 사용해 사이트를 만들고 있으면, 좀처럼 XPath를 생각한 대로 지정하는 것이 어렵다.
그럴 때는 생각을 멈추고 Chrome의 개발자 도구를 사용하여 Xpath를 얻으십시오.

하지만 @class @id 로 지정하는 편이 기술이 간결하게 되는 경우가 많다.
Chrome에 너무 의존하지 마라. 자신의 머리로 생각해라.

Chrome 개발자 도구에서 Xpath를 지정하여 요소를 가져옵니다.

기존의 테스트를 읽은 곳에서 지정된 Xpath가 어떤 요소를 지정하고 있는지 모른다. 그럴 때는 Chrome 개발자 도구를 사용하면 요소를 얻을 수 있다.
$x('xpath') 에 Xpath 를 건네주면 요소를 확인할 수 있다.

WebElement#clear() 움직이지 않아?

MaterialUI의 컴퍼넌트이기 때문인지 input 요소에 sendKeys() 그리고 텍스트를 보낼 수는 있어도, clear() 그리고 삭제할 수 없다. 이게 뭐야.

대안으로 BACK_SPACE 키를 보내 텍스트를 삭제합니다.

// e.g. sending back space.
import webdriver, { until, By, Key } from 'selenium-webdriver'

export const timeout = 15000
const drive = new webdriver.Builder()
  .forBrowser('chrome')
  .build()


driver
  .findElement(By.xpath('//*[contains(@id,"name_input")]'))
  .then(element => {
    element.sendKeys.apply(element, [Key.chord(Key.CONTROL, "e"), ...(new Array(30).fill(Key.BACK_SPACE))])
    element.sendKeys('new name')
  })

이 예에서는, 우선 Ctrl+e 를 송신해 커서 위치를 캐릭터 라인의 마지막으로 이동시키고 나서 BACK_SPACE 를 송신하고 있다. 또, 송신수도 30회로 하고 있지만, 이 근처는 환경에 의해 조정이 필요.

자세한 것은 문서 를 보라.