[Python] 怎么把HTML的报告转换为图片，利用无头浏览器

How to convert HTML Report to picture format in Email? So that we can see the automation report also at home or on mobile phone anywhere.

We tried to use phantomJs to get the full-page screenshot of HTML, it doesn't work well on some computers, then we found that the newest Chrome doesn't support it anymore, and Chrome has use its Headless mode to replace phantomJs.

Version 1 : phantomJs

# -*- coding: utf-8 -*-
import time
import os

from selenium import webdriver 
jenkinsJobName=os.getenv("JOB_NAME")
url="http://10.2.3.3/testAgent/AutoAnaylsisReport.html"
print url
save_fn="buildNumResult.PNG"
driver = webdriver.PhantomJS()
driver.maximize_window()
driver.get(url) # Load page
time.sleep(30) 
driver.save_screenshot(save_fn)
driver.close()
time.sleep(5) 
os.system("taskkill /F /IM phantomjs.exe")

Version 2: Chrome Headless

# -*- coding: utf-8 -*-
import time
import os

from selenium import webdriver
from selenium.webdriver.common.keys import Keys


url="http://10.2.4.1/testAgent/BillingAnaylisisReport.html"
print url
save_fn="buildNumResult.PNG"

option = webdriver.ChromeOptions()
option.add_argument('--headless')
option.add_argument('--disable-gpu')
option.add_argument("--window-size=1280,1024")
option.add_argument("--hide-scrollbars")

driver = webdriver.Chrome(chrome_options=option)

driver.get(url)
print(driver.title)

scroll_width = driver.execute_script('return document.body.parentNode.scrollWidth')
scroll_height = driver.execute_script('return document.body.parentNode.scrollHeight')
driver.set_window_size(scroll_width, scroll_height)
driver.save_screenshot(save_fn)
driver.quit()

Version 3 , 为了把截图放在邮件里直接展示，需要把图片截小一点。然后在邮件内容的HTML中加上一行：${FILE,path="report.html"}

# -*- coding: utf-8 -*-
import time,os
from PIL import Image
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
time.sleep(10)
url="http://10.249.4.17/testRailAgent/BillingAnaylisisReport.html?jenkinsJobName=Billing_Office_Live&projectUATName=Billing_Office_UAT&type=1"
print url
save_fn="buildNumResult.PNG"

option = webdriver.ChromeOptions()
option.add_argument('--headless')
option.add_argument('--disable-gpu')
option.add_argument("--window-size=1280,1024")
option.add_argument("--hide-scrollbars")

driver = webdriver.Chrome(chrome_options=option)

driver.get(url)
time.sleep(30)

scroll_width = driver.execute_script('return document.body.parentNode.scrollWidth')
scroll_height = driver.execute_script('return document.body.parentNode.scrollHeight')
driver.set_window_size(scroll_width, scroll_height)
driver.save_screenshot(save_fn)
time.sleep(5)
driver.quit()
im = Image.open(save_fn)
w,h  = im.size
imgCount = h/2000+1
size=h/imgCount
left = 0  
shang = 0  
index = 0  
for i in range(imgCount):
    i=i+1
    shang += 1   
    a = size * left 
    b = size *(i-1) 
    c = w  
    d = size * i 
    region = im.crop((a, b, c, d))
    region.save("report%s.png" %i)


fp = open("report.html","w+b") #打开一个文本文件
for i in range(1,imgCount+1):
	fp.write('<img src="report'+str(i)+'.png"></img>') #写入数据
fp.close() #关闭文件