고기

학습일지를 달력에 표기하고 있으나 자주 업데이트 하지 않고 있다.

2022년 1월 19일 (수)

• 공부:고기님 개요까지

2022년 1월 20일 (목)

2022년 1월 21일 (금)

• 공부:고기님 파이썬 100 변수까지 완료
• 공부:고기님 파이썬 튜토리얼 3, 4, 5 완료

2022년 1월 22일 (토)

• 공부:고기님 파이썬 튜토리얼 모듈 읽기, 파이썬 100 part1 완료

2022년 1월 26일 (화)

wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, 'a[rel=next]')))
elNext = driver.find_element(By.CSS_SELECTOR, 'a[rel=next]')
elNext.click()

위 코드는 페이지네이션의 next 버튼을 클릭하는 코드로 처음 구현 시 잘 작동을 했으나 selenium의 browser 크기를 줄이거나 headless로 변경하면 "Element is not clickable at point" 에러를 발생시킨다. SO에서는 이런 문제에 대해 js click을 제시하고 있다. 모든 사이트가 이런 것은 아닐테고 마침 타겟 크롤링 페이지가 내가 만든 페이지이므로 원인을 찾아보기로 했다.

Selenium은 click 명령을 내리면 클릭하려는 해당 엘리먼트가 브라우저에 보여지는 상태로 스크롤바를 이동하고 click을 수행한다. 그리고 스크롤 되기까지 smooth 애니메이션이 적용되는 것을 알게 됐다. 여기서 click 명령 시 스크롤 애니메이션이 작동하고 스크롤이 완료되기 전에 click을 하므로 에러가 발생하는 것이 아닐까 생각하게 됐다.

html {
    scroll-behavior: auto !important;
}

Smooth 스크롤링은 브라우저 기본 속성은 아니고 bootstrap 5를 사용했기 때문에 적용된 것이다. html의 scroll-behavior에 적용된 smooth를 제거하기 위해 위와 같은 코드를 html에 추가하니 에러가 사라졌다. Python에서 js로 click하는 코드를 사용하지 않고 ele.click만으로도 잘 작동한다.

문제는 해결됐으나 서버사이드를 고치는 것은 좋은 방법은 아니다. 실제 Bootstrap 5로 만들어진 scroll-behavior: smooth를 사용하는 사이트를 크롤링하게 된다면 같은 문제가 발생할 것이고 이 때 남의 서버 코드를 바꿀 수는 없는 것이다.

driver.execute_script("document.querySelector('html').style.scrollBehavior = 'auto'")

위 코드를 호출하여 selenium에서 scroll behavior를 바꿔봤다. 애니메이션 없이 한 번에 스크롤 점프가 됐고 headless 모드에서도 크롤러가 에러 없이 잘 작동하였다.