How to capture full screen when headless mode using Selenium

Dahun Yoo·2021년 7월 7일

Introduce to Selenium with Java

목록 보기

23/35

Headless mode일때 풀스크린 캡쳐는 어떻게 찍을까요?

Headless mode

What is a headless browser?
A headless browser is a term used to define browser simulation programs that do not have a GUI. These programs execute like any other browser but do not display any UI. In headless browsers, when Selenium tests run, they execute in the background. Almost all modern browsers provide the capabilities to run them in a headless mode.

https://www.toolsqa.com/selenium-webdriver/selenium-headless-browser-testing/

headless 모드는 Chrome이나 firefox를 직접 실행시키긴 하지만, GUI를 표시하진 않고, PC의 백그라운드의 메모리상에서만 실행시키는 방식입니다.
직접 GUI를 표시하지 않기 때문에 performance 상에서 좀 더 좋은 것으로 알려져 있습니다. 서버 상에서 실행시키면 굳이 GUI를 보지도 않는데 표시할 이유는 없겠죠.

headless를 설정하는 방법은, Java기준으로 아래와 같습니다.

       chromeOptions.setHeadless(true);
       chromeOptions.addArguments("--headless");

두 방법 다 동작하는 방식은 같습니다.

Capture on Selenium

Selenium으로 테스트를 실행하다가, 실패하게 되면 캡쳐가 필요할 때가 있습니다. 테스트는 자동화되어있지만 만일 실패하게 되면 왜 실패했는지, 어느 부분에서 실패했는지를 로그와 함께 비교한다면 좀 더 알기 쉽기 때문이죠.
근데 문제는 headless 상태라면 제대로 된 Full-Screen capture가 안된다는 점입니다.

네이버의 경우 이렇게 스크롤이 발생하게 되며, 부분적으로만 찍힙니다.

how to maximize window

브라우저를 최대화 할 수 있는 방법은 몇가지가 있습니다.

driver.manage().window().maximize()

이 방법은 브라우저를 최대화 시켜주나, headless에서는 동작하지 않습니다.
눈에 보이는 윈도우를 최대화 시켜줍니다.

driver.manage().window().fullscreen();

이 방법 역시 브라우저를 풀스크린으로 바꾸어주나, 눈에 보이는 화면 자체를 바꾸어 줍니다.

ChromeOptions.addArguments()

ChromeOptions 를 이용해, chrome driver자체의 설정을 바꾸어주는 것입니다.
(Chrome이 아니더라도 다른 브라우저 드라이버도 마찬가지로 해당 드라이버에 맞는 Options를 사용하면 됩니다.)

chromeOptions.addArguments("--start-maximized");
chromeOptions.addArguments("--start-fullscreen");

최대화를 한 다음, 전체화면 설정을 합니다. 그러나 이것으로도 안됩니다... 이 것도 어디까지나 브라우저의 외관을 변경시키는 방법이기 때문입니다.

Change window size (resolution)

해당 브라우저의 해상도를 직접 지정하여 변경하는 방법입니다.

chromeOptions.addArguments("--window-size=1920,1080");

가로세로 사이즈를 억지로 지정시킨다면, 전체화면을 한 것과 같은 효과를 얻을 수 있습니다.

여기서 스크롤이 필요한 화면으로 이동해서 스크린샷을 찍고자 한다면, 직접 JavascriptExecutor 를 이용해서 이동시켜주시면 됩니다.

  JavascriptExecutor js = (JavascriptExecutor) driver;
   js.executeScript("window.scrollBy(0,1080)", "");
   js.executeScript("window.scrollBy(0,document.body.scrollHeight)", "");