[실습] Selenium 사용자의 브라우저 이벤트 가져오기 #2

Topic. 1편에 이어 에서 페이지가 이동하는 경우 이벤트리스너 처리 방법에 대해 알아봅니다.

---

1. 개요

지난편에서 페이지 하나에서 이벤트리스너를 등록하고 사용자의 입력을 파이썬 변수에 저장하는 것 까지 해보았습니다.

하지만 SPA(Single Page Application)가 아닌, JSP나 PHP 기반의 어플리케이션은 링크 변경시 화면 전체가 렌더링되며 자바스크립트도 모두 초기화됩니다. 이런경우는 화면이 바뀔때마다 document에 이벤트리스너를 계속 등록해주어야 합니다.

---

2. 실습

1. SPA 가 아닌경우

기존 이벤트리스너 등록 스크립트를 변수에 저장하는것으로 수정합니다.

event_regist_script = """
    window.eventList = []
    document.addEventListener('click', (e)=>{
        window.eventList.push(e.target)
        console.log("eventList :",window.eventList);
    })
"""
before_current_url = "data:,"
driver.execute_script(event_regist_script)

 

URL 변경을 감지하기 위해 before_current_url 이라는 변수를 하나 선언했습니다.

초기값인 "data:, "  는 크롬 브라우저의 빈 페이지 주소 입니다.

 

[주의] 이벤트는 페이지가 변경되면 이벤트리스너 주입 스크립트가 딱 한번만 실행되어야 합니다. 여러번 실행하면 이벤트가 중첩되어 한번만 클릭해도 여러개의 이벤트가 동시에 감지가 되기 때문입니다.

 

주의사항을 고려하여 while 문 상단에 아래와 같이 작성합니다.

while True :
    current_url = driver.current_url
    if current_url != before_current_url :
	print(f''' URL 변경 : {before_current_url} -> {current_url}''')
        driver.execute_script(event_regist_script)
        before_current_url = current_url
    .
    .
    .

 

프로그램 실행 후 페이지를 이동하면 감지하여 이벤트리스너를 다시 넣어줄 수 있습니다.

 

 

---

2. SPA 의경우 (아닌경우에도 사용가능)

SPA의 경우 리액트라우터를 이용하여 주소를 변경하는경우 페이지 전체가 렌더링되지 않고 일부만 렌더링이 되어 셀레니움 드라이브의 current_url 변수로는 완벽하게 페이지 이동을 감지할 수 없습니다.

따라서 위의 방법보다는 이 방법을 사용해봅시다.

 

드라이브에 주입할 스크립트 소스 안에 window 객체에 flag 변수를 하나 선언하여 분기합니다.

event_regist_script = """
    if(window.event_listener_flag){ // Flag 분기
        console.log("event recording...")
    }else{
        window.eventList = []
        document.addEventListener('click', (e)=>{
            window.eventList.push(e.target)
            console.log("eventList :",window.eventList);
        })
        window.event_listener_flag = 'registed' // Flag 등록
        console.log("event registed...")
    }
"""

 

* 그리고 바깥에 있던 스크립트를 주입하는 구문을 반복문 안으로 넣습니다.

while True :
    driver.execute_script(event_regist_script) # 스크립트 주입
    .
    .
    .

 

이제 이벤트리스너 등록 기준이 URL 변경시점이 아닌 자바스크립트가 초기화되는 시점으로 바뀌었습니다.

 

다음시간에는 input 이벤트를 감지하여 파이썬 변수로 가져오는 방법을 알아보겠습니다.