Pythonを使ったWEBサイトの自動評価

# はじめに
WEBサイトの機能改善後に定期的に行うリグレッションテストをPythonを用いて自動化する方法を検討しました。
読んでいただいた方が少しでも参考になれば幸いです。

# こんな人に読んでほしい
* Pythonを使用して作業効率を向上させたい方
* WEBサイトを運営している方

# 前提条件
* PC上にPythonの実行環境が事前に構築されていること

# 自動化したいこと
* WEBサイトの自動表示
* スナップショット取得
* スナップショットをExcelに貼付け

その後、Excelを目視で確認します。
今回は、YahooのTopおよび知恵袋のページを開いてスナップショットを取得してみます。

なお、Pythonおよびライブラリは下記バージョンを使用しています。
* Python 3.11.5
* selenium 4.12.0・・・PythonからWebブラウザを操作するためのライブラリ
* openpyxl 3.1.2・・・PythonからExcelを操作するためのライブラリ

# Pythonコード
~~~php:main.py
import os
import time
import glob
import datetime as dt
from selenium import webdriver
from selenium.webdriver.common.by import By
import openpyxl
from openpyxl.utils import get_column_letter

def save_image(file_name):
    # ウィンドウサイズ設定
    w = driver.execute_script('return document.body.scrollWidth;')
    h = driver.execute_script('return document.body.scrollHeight;')
    driver.set_window_size(w,h)

    # スクショをPNG形式で保存
    driver.get_screenshot_as_file(folder_name + '\\' + file_name + '.png')

def make_excel():
    excel_file_name = folder_name + '\\output.xlsx'

    # Excel作成
    workbook = openpyxl.Workbook()

    # シート指定
    sheet    = workbook.active

    # 全imageファイル名取得
    files = glob.glob(folder_name + '\\*.png')
    # Excelの列指定
    column = 1

    # 全imageファイル分ループ
    for file in files:
        # imageファイル取得
        img_to_excel = openpyxl.drawing.image.Image(file)

        # 指定の位置に画像貼付け
        cell = sheet.cell(2,column)
        sheet.add_image(img_to_excel, f'{get_column_letter(column)}{2}')
        # 画像の大きさに合わせて列を移動
        column = column + 16

    # Excel保存
    workbook.save(excel_file_name)

#メイン処理
if __name__ == '__main__':

    #現在時刻を取得
    dt_now = dt.datetime.now()
 
    #フォルダ名用にyyyymmddの文字列を取得する
    folder_name = dt_now.strftime('%Y%m%d_%H%M%S')
 
    #対象フォルダが存在しない場合
    if(not (os.path.exists(folder_name))):
        #フォルダを作成
        os.mkdir(folder_name)

    #ヘッドレス実行　※全画面用
    options = webdriver.ChromeOptions()
    options.add_argument('--headless')

    driver = webdriver.Chrome(options=options)
    # Top画面表示
    driver.get('https://www.yahoo.co.jp/')
    time.sleep(2)
    # スクショ保存
    save_image('01_top')

    # 知恵袋のクリック
    element = driver.find_element(By.XPATH, '//*[@id="ToolList"]/ul/li[16]/div/a')
    
    element.click()
    time.sleep(2)
    # スクショ保存
    save_image('02_wisdom')

    driver.quit()

    #Excel出力
    make_excel()
~~~

# コード説明
スナップショットとExcelを保存するためのフォルダを作成します。
実施日がわかるようにフォルダ名は日時を付加した形にしています。

~~~
    #現在時刻を取得
    dt_now = dt.datetime.now()
 
    #フォルダ名用にyyyymmddの文字列を取得する
    folder_name = dt_now.strftime('%Y%m%d_%H%M%S')
 
    #対象フォルダが存在しない場合
    if(not (os.path.exists(folder_name))):
        #フォルダを作成
        os.mkdir(folder_name)
~~~
<hr>
WEBサイトの表示はseleniumを使用します。
以下はYahooのTopページを表示する例です。

~~~
    #ヘッドレス実行　※全画面用
    options = webdriver.ChromeOptions()
    options.add_argument('--headless')

    driver = webdriver.Chrome(options=options)
    # Top画面表示
    driver.get('https://www.yahoo.co.jp/')
~~~
<hr>
続いて知恵袋のelementをクリックして画面を表示させる例です。

~~~
    # 知恵袋のクリック
    element = driver.find_element(By.XPATH, '//*[@id="ToolList"]/ul/li[16]/div/a')
    
    element.click()
~~~
elementの取得方法は多々ありますが、この例はXPathで指定しています。
XPathはChromeデベロッパーツールで該当aタグを右クリックして取得します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3659381/09c2804e-7f1a-5568-5cf9-1cda28b7a09e.png)

<hr>

スナップショットをPNG形式で保存します。

~~~
    # ウィンドウサイズ設定
    w = driver.execute_script('return document.body.scrollWidth;')
    h = driver.execute_script('return document.body.scrollHeight;')
    driver.set_window_size(w,h)

    # スクショをPNG形式で保存
    driver.get_screenshot_as_file(folder_name + '\\' + file_name + '.png')
~~~
<hr>

Excel操作はopenpyxlを使用します。
取得したスナップショットをExcelに貼り付けます。

~~~
    excel_file_name = folder_name + '\\output.xlsx'

    # Excel作成
    workbook = openpyxl.Workbook()

    # シート指定
    sheet    = workbook.active

    # 全imageファイル名取得
    files = glob.glob(folder_name + '\\*.png')
    # Excelの列指定
    column = 1

    # 全imageファイル分ループ
    for file in files:
        # imageファイル取得
        img_to_excel = openpyxl.drawing.image.Image(file)

        # 指定の位置に画像貼付け
        cell = sheet.cell(2,column)
        sheet.add_image(img_to_excel, f'{get_column_letter(column)}{2}')
        # 画像の大きさに合わせて列を移動
        column = column + 16

    # Excel保存
    workbook.save(excel_file_name)
~~~
<hr>

# 実行結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3659381/385bbecc-890f-57f6-58c6-cdb87a136b6e.png)