Selenium VS Playwright

들어가며

안녕하세요, 노머스 QA팀 최우영입니다.

QA 업무를 하다 보면 같은 테스트를 반복하는 경우가 많습니다.

특히 기능이 많아질수록 기존 기능들이 정상적으로 동작하는지 확인하는 회귀 테스트에 시간이 많이 들고, 누락되는 부분도 발생하게 됩니다.

그래서 반복적인 테스트는 자동화에 맡기고, QA는 탐색적 테스트나 복잡한 시나리오에 집중하고자 했습니다.

이러한 배경에서 웹 테스트 자동화를 검토하게 되었고, 여러 도구를 비교한 끝에 Playwright를 선택했습니다.

이번 글에서는 Selenium과 Playwright를 비교하며 저희가 Playwright를 선택한 이유를 공유해 보려 합니다.

1. Selenium과 Playwright의 브라우저 제어 방식

• Selenium

  테스트 코드 → Selenium 클라이언트 → HTTP → 브라우저 드라이버 → 브라우저
                                                                    ↑ 매번 요청/응답 대기

• Playwright

  테스트 코드 → Playwright 드라이버 ←→ 브라우저
                                  ↑ 한 번 연결 후 계속 유지

WebDriver 방식(Selenium) 은 클릭, 입력 같은 명령을 보낼 때마다 HTTP 요청을 보내고 응답을 기다립니다.
반면 WebSocket 방식(Playwright) 은 브라우저와 한 번 연결한 후 계속 유지하며 양방향으로 통신하기 때문에 테스트 실행이 더 빠릅니다.

2. Selenium과 Playwright의 대기 처리 및 안정성

Selenium은 기본 자동 대기가 제한적이라(설정/유틸이 없으면) 요소가 보이는지 체크한 후 바로 액션을 수행합니다.
따라서 별도로 대기 설정을 하지 않으면 요소가 보이지 않을 때 즉시 에러가 발생합니다.

반면 Playwright는 액션 수행 전에 아래 예시처럼 필요한 조건들을 자동으로 검증하고,
충족될 때까지 자동 대기(Auto Wait) 합니다. 그래서 테스트가 더 안정적이고, Flaky한 테스트가 크게 줄어듭니다. 아래는 각 항목에 대한 설명입니다.

• Attached : DOM에 요소가 생성되었는가
• Visible : CSS 기준으로 보이는 상태인가 (display: none, width: 0, height: 0이 아닌지)
• Stable : 요소가 움직이거나 크기가 변하지 않는 안정적인 상태인가
• Receiving events : 다른 요소(예: 모달 오버레이)가 해당 지점의 이벤트를 막고 있지 않은지
• Enabled : 요소가 활성화된 상태인가 (disabled가 아닌지)

대기 처리 코드 비교

Selenium V1 - time.sleep() 사용
가장 단순하지만, 무조건 n초를 기다리기 때문에 비효율적이고 불안정하며 n초 안에 표시되지 않으면 실패합니다.

def test_login():  
    # 프롬 스토어 접속  
    driver = webdriver.Chrome()  
    driver.get("https://store.frommyarti.com/arti")
  
    # 더보기 메뉴 클릭  
    menu = driver.find_element(By.CSS_SELECTOR, 'img[alt="Main Menu"]')  
    menu.click()
    
    # 요소가 보일 때까지 대기 
    # 만약 네트워크 상태에 따라서 요소가 늦게 표시된다면 테스트는 실패하게 됩니다. 
    time.sleep(n)
    
    # "로그인 후 이용해주세요." 문구 클릭   
    log_in = driver.find_element(By.CSS_SELECTOR, 'a[href="/signin"]')  
    log_in.click()

Selenium V2 - WebDriverWait 사용
요소가 보일 때까지 대기하는 함수를 추가했습니다.

# 요소가 보일 때까지 대기
def wait_and_find(driver, by, locator:str, *, timeout:int=10):
    # timeout 동안 요소가 보일 때까지 기다림  
    return WebDriverWait(driver, timeout).until(  
        EC.visibility_of_element_located((by, locator))  
    )  
  
def test_login():  
    # 프롬 스토어 접속  
    driver = webdriver.Chrome()  
    driver.get("https://store.frommyarti.com/arti")
  
    # 더보기 메뉴 클릭  
    menu = wait_and_find(driver,By.CSS_SELECTOR, 'img[alt="Main Menu"]')  
    menu.click()  
  
    # "로그인 후 이용해주세요." 문구 클릭  
    log_in = wait_and_find(driver,By.CSS_SELECTOR, 'a[href="/signin"]')  
    log_in.click()

Selenium V3 - 완전한 대기 처리
존재 → 가시성 → 클릭 가능 여부까지 모두 체크합니다. 안정적이지만 사용하는 모든 액션에 대해 만들고 유지보수하기 힘듭니다.

# 요소가 보일 때까지 대기
def safe_click(driver, locator, *, timeout:int=10):  
    wait_driver = WebDriverWait(driver, timeout)
    # timeout 동안 요소가 존재하는지 기다림  
    wait_driver.until(EC.presence_of_element_located(locator))  
    # timeout 동안 요소가 보일 때까지 기다림
    wait_driver.until(EC.visibility_of_element_located(locator))  
    # timeout 동안 요소가 클릭 가능할 때까지 기다림
    element = wait_driver.until(EC.element_to_be_clickable(locator))  
    element.click()  
  
def test_login():  
    # 프롬 스토어 접속  
    driver = webdriver.Chrome()  
    driver.get("https://store.frommyarti.com/arti")
  
    # 더보기 메뉴 클릭  
    safe_click(driver,(By.CSS_SELECTOR, 'img[alt="Main Menu"]'))  
  
    # "로그인 후 이용해주세요." 문구 클릭  
    safe_click(driver,(By.CSS_SELECTOR, 'a[href="/signin"]'))

Playwright - 자동 대기 내장
별도의 유틸 함수 없이도 자동으로 대기 처리가 됩니다.

def test_login(page: Page):  
    # 프롬 스토어 접속  
    page.goto("https://store.frommyarti.com/arti")  
  
    # 더보기 메뉴 클릭  
    menu=page.locator('img[alt="Main Menu"]')  
    menu.click()  
  
    # "로그인 후 이용해주세요." 문구 클릭  
    log_in=page.locator('a[href="/signin"]')  
    log_in.click()

Selenium도 V3처럼 유틸 함수를 만들면 안정적인 테스트가 가능합니다. 다만 click 외에도 fill, hover, select 등 모든 액션에 대해 이런 함수를 만들고 유지보수하려면 많은 시간과 노력이 필요합니다.

하지만 Playwright는 이런 처리가 기본으로 내장되어 있어서, 별도 코드 없이도 동일한 안정성을 얻을 수 있습니다.

각 액션별로 어떤 항목을 검사하는지 자세한 내용은 Playwright Actionability 문서를 참고 부탁드립니다.

3. Selenium과 Playwright의 실행 속도 비교

아래는 Playwright 공식 홈페이지에 접속해서 페이지 타이틀에 “Playwright”가 포함되어 있는지 확인하는 동일한 테스트입니다.

Selenium - 1.14초

"""Selenium"""
def test_has_title():  
	driver = webdriver.Chrome()  
	driver.get("https://playwright.dev/")  
	assert re.search(r"Playwright", driver.title)
	#	  test_example.py::test_has_title PASSED [100%] Selenium
	#     ============= 1 passed in 1.14s ==============

Playwright - 0.73초

"""Playwright"""
def test_has_title(page: Page):  
	page.goto("https://playwright.dev/")  
	expect(page).to_have_title(re.compile("Playwright"))
	#     test_example.py::test_has_title[chromium] PASSED [100%] Playwright
	#     ============= 1 passed in 0.73s ==============

같은 테스트인데 Playwright가 약 36% 더 빠릅니다. 테스트 케이스가 많아질수록 이 차이는 더 커집니다.
(실행 환경/네트워크에 따라 수치는 달라질 수 있습니다.)

Playwright 사용 시 참고사항

Playwright는 브라우저 조작 시 코드를 자동으로 생성해주는 codegen 기능을 제공합니다.
다만 codegen은 접근성 트리 기반으로 getByRole, getByText 같은 로케이터를 생성해주는데,
이 방식은 UI 텍스트가 변경되면 테스트가 깨질 수 있습니다.

    # "로그인" → "Sign In" 변경 시 실패 
    page.get_by_role("button", name="로그인") 
    # 더 안정적인 방식 - id나 data-testid 사용 
    page.locator('#login-btn') 
    page.get_by_test_id("login-button")

따라서 codegen 사용 시 수립하신 Locator 전략에 맞게 수정해서 사용하시면 좋을 것 같습니다.

Playwright Locators 문서에서는 test id 방식이 가장 안정적이라고 명시되어 있습니다.

“Testing by test ids is the most resilient way of testing as even if your text or role of the attribute changes, the test will still pass.”

마무리하며

	Selenium	Playwright
브라우저 제어	WebDriver (HTTP)	WebSocket (양방향)
대기 처리	직접 구현 필요	기본 내장
실행 속도	1.14초	0.73초 (36% 빠름)

Selenium이 나쁜 도구는 아닙니다. 레퍼런스도 많고, IE 같은 레거시 브라우저를 지원해야 한다면 여전히 좋은 선택입니다.
하지만 편하고 안정적인 테스트가 필요하다면 Playwright를 추천드립니다!


읽어주셔서 감사합니다.