[도서 입력 프로그램] 3-4. Selenium 캘린더 제어

[도서 정보 자동 입력 프로그램] 3-4. Selenium 캘린더 제어

 

오랜만의 포스팅이다. 1~2일에 하나씩은 꾸준히 올리고 싶은데 잘 되지 않는다. 요즘엔 머신러닝/딥러닝 쪽에 꽂혀서 틈날때마다 공부중이기도 하고, 하다보니 프론트엔드 쪽에도 관심이 생겨서 자바스크립트와 Node.js를 배워볼까 생각중이다. 아무튼 시간이 잘 나지 않는다.

그래도 모든 내용을 다 정리하기까지 열심히 달려보겠다.

 

이번에 연구해볼 주제는 웹페이지에서 날짜를 선택할때 나오는 캘린더를 제어하는 법이다.

Yes24로 도서 정보를 등록할때 기존 등록 DB에 없는 도서를 등록하려면 발행일자를 입력해야한다.

이 발행일자를 단순히 타이핑하는 형태가 아니라 캘린더에서 연도/월/일을 선택하는 구조라서 고려해야할 부분들이 많다.

 

Yes24 발행일 입력 창

발행일자 선택은 아래 세가지 순서로 진행된다.

• 연도(그림에서 2024 부분)는 up&down 버튼을 누르거나 텍스트를 입력해서 수정이 가능하다.
• 월(그림에서 5월 볼드체 부분)은 연도처럼 텍스트 입력이 불가하고 양 옆 '<' 나 '>' 버튼을 클릭해서 수정해야한다.
• 일(그림에서 30 숫자 부분)은 월에따라 변경되는 날짜에 맞춰 해당하는 숫자를 클릭해서 선택하면 된다.

행여나 캘린더를 XPATH로 선택하는 과정이 동적 웹페이지라 문제가 있을까 걱정했는데 다행히 class 기준으로 XPATH를 선택하니 문제없이 잘 선택되었다. (단, '일'의 경우 '월'이 바뀜에 따라 위치도 바뀌기 때문에 '월'을 먼저 선택하고 난뒤 클릭해야 한다.)

 

알라딘에서 크롤링한 발행일은 'YYYY-MM-DD' 형식으로 되어있다. 그래서 파이썬 슬라이싱 기능으로 'YYYY', 'MM', 'DD' 형태로 각각 pyear, pmonth, pdate 형태로 변수 지정을 해두었다.

 

이제 연도, 월, 일 순서대로 입력하는 코드를 작성해보자.

우선 제일 단순한 연도이다. 1) 연도 입력창을 선택, 2) 기존 입력된 연도 삭제, 3) 출판연도(pyear) 입력 순이다.

# 발행연도창 선택
input_year = driver.find_element(By.XPATH, '//input[@class="numInput cur-year" and @aria-label="Year"]')

# 기존 연도 삭제(clear)
input_year.clear()

# 등록할 발행연도 입력
input_year.send_keys(pyear)

 

다음은 발행 월이다. 기본값 월이 이미 선택되어있고 그 선택월에 따라 '<' 또는 '>'를 클릭할 숫자가 바뀌어야 하므로 if문을 사용해서 작성했다.

1) Yes24 등록창에 현재 기본값 월 선택하여 변수로 받음

2) 크롤링한 발행월과 현재 기본값 월을 비교하여 0보다 큰지 작은지 판단

  2-1) 발행월이 기본값 월보다 작은(더 빠른) 경우, '<' 버튼을 발행월과 기본값 월의 차이만큼 클릭

  2-2) 발행월이 기본값 월보다 큰(더 늦은) 경우, '>'버튼을 발행월과 기본값 월의 차이만큼 클릭

#curmonth = 기본값 현재 월
curmonth = int(driver.find_element(By.XPATH, '//span[@class="cur-month"]').text[:-1])
count = int(pmonth) - curmonth #count = 발행월 - 기본값 월 (버튼 클릭할 횟수)
if count < 0:
	prev_month = driver.find_element(By.XPATH, '//span[@class="flatpickr-prev-month"]')
    for _ in range(abs(count)):
    	prev_month.click()
        time.sleep(0.5)
    elif count > 0:
        next_month = driver.find_element(By.XPATH, '//span[@class="flatpickr-next-month"]')
        for _ in range(count):
            next_month.click()
            time.sleep(0.5)
    else:
        pass

 

마지막 발행 일이다. 제일 쉽고 간단하게 해당하는 일을 선택하여 클릭하면 된다. f스트링으로 pdate변수값에 따라 해당 숫자를 선택한 후 클릭하도록 코드를 작성했다.

driver.find_element(By.XPATH, f'//span[@class="flatpickr-day" and text()="{int(pdate)}"]').click()

 

이것으로 기본값에 관계없이 발행일자를 캘린더를 제어하여 입력하는데 성공했다.

 

첨언하자면, Selenium으로 웹페이지 제어를 할때 항상 신경써야하는 부분으로, Selenium은 실제 웹브라우저를 작동하여 웹페이지를 제어하기 때문에 웹페이지의 로딩 속도를 감안해서 중간마다 time 모듈로 sleep을 걸어두는 것이 좋다. 특히 로딩속도는 컴퓨터나 인터넷 환경에 따라 달라질 수 있어 보수적으로 시간을 여유있게 잡는 것을 추천한다.

 

이번 포스팅은 여기까지 😎

 

다음은 이미지 업로드창을 파이썬 코드로 제어하는 방법을 알아보도록 하겠다.

 

이전글: [도서 입력 프로그램] 3-3. Selenium 드롭다운 제어

[도서 입력 프로그램] 3-3. Selenium 드롭다운 제어

 

다음글: