Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

Selenium으로 JavaScript가 포함된 복잡한 페이지의 로딩 완료까지 기다리는 방법

Selenium을 활용하면 JavaScript로 동작하는 복잡한 페이지도 완전히 로드될 때까지 기다린 뒤 자동화 작업을 진행할 수 있습니다. 핵심 원리는 간단합니다. 페이지 로드 후 JavaScript 메서드인 document.readyState를 실행하고, 반환값이 complete가 될 때까지 확인하는 것입니다.

문법

JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("return document.readyState").toString().equals("complete");

페이지가 로드되었다고 해서 곧바로 요소 조작이 가능한 것은 아니므로, 실제로 사용자 동작을 수행할 준비가 되었는지 추가로 검증하는 것이 좋습니다. 이때 동기화(synchronization) 기법 중 하나인 명시적 대기(explicit wait)를 사용합니다. ExpectedConditions의 presenceOfElementLocated 조건으로 특정 요소가 DOM에 나타날 때까지 기다리고, 전체 검증 로직은 try-catch 블록 안에서 처리합니다.

참고로 document.readyState는 세 가지 상태 값을 가집니다. 문서를 읽고 있는 중인 loading, 문서 해석은 끝났지만 이미지 등 하위 리소스를 아직 불러오는 중인 interactive, 그리고 모든 리소스 로딩이 완료된 complete입니다. 자동화 스크립트에서는 일반적으로 complete 상태를 기준으로 삼습니다.

예제

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import org.openqa.selenium.JavascriptExecutor;
public class PageLoadWt{
    public static void main(String[] args) {
        System.setProperty("webdriver.chrome.driver",
        "C:\\Users\\ghs6kor\\Desktop\\Java\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
        driver.get("https://www.tutorialspoint.com/index.htm");
        // Javascript Executor로 페이지 준비 상태 확인
        JavascriptExecutor j = (JavascriptExecutor)driver;
        if (j.executeScript
        ("return document.readyState").toString().equals("complete")){
            System.out.println("Page loaded properly.");
        }
        // expected condition presenceOfElementLocated 적용
        WebDriverWait wt = new WebDriverWait(driver,3);
        try {
            wt.until(ExpectedConditions
            .presenceOfElementLocated
            (By.id("gsc-i-id1")));
            // 요소 식별
            driver.findElement
            (By.id("gsc-i-id1")).sendKeys("Selenium");
        }
        catch(Exception e) {
            System.out.println("Element not located");
        }
        driver.quit();
    }
}

실행 결과

Selenium으로 JavaScript가 포함된 복잡한 페이지의 로딩 완료까지 기다리는 방법

코드를 실행하면 먼저 document.readyState가 complete인지 확인되어 콘솔에 Page loaded properly.라는 메시지가 출력됩니다. 이후 명시적 대기가 설정한 최대 3초 안에 id가 gsc-i-id1인 검색 입력창을 찾으면 해당 요소에 Selenium이라는 텍스트가 자동으로 입력됩니다. 반대로 제한 시간 내에 요소를 찾지 못하면 catch 블록이 실행되어 Element not located가 출력되고, 마지막에는 driver.quit()로 브라우저 세션이 종료됩니다.