关于截图的一点总结

1. 去除滚动条
aau创建webform可以去掉滚动条,但测试的时候发现如果网页中对html设置了overflow-y:scroll;滚动条还是会显示出来,页面的doctype好象也可以影响滚动条的显示。最终使用代码将所以滚动条显示出来,在截图的时候裁掉滚动条。
计算滚动条代码:

var js = /**
    document.documentElement.style.overflowY='scroll';
**/
wb.doScript(js);

var scrollWidth = wb.document.documentElement.offsetWidth  - wb.body.clientWidth;

2. 触发layzload加载的图片
很多网站对图片使用了懒加载,图片显示不全,强制设置滚动条到底部可以解决大部份情况。
js添加一行
window.scrollTo(0, 100000);

3. 多用win.delay
最开始在使用setPos修改webform的宽度之后,因为我设置的宽度大于body的宽度截图出现头部居中主体内容未居中的情况,尝试在调用setPos以后调用win.delay(20)问题就解决了。在设置scroll的值触发图片懒加载以后也需要暂停一下让图片加载完成,不过要根据实际网页的情况去设置。

批量截图软件webmonitor

自己开发了一款批量截图软件,用来对一组url批量截图。当web项目修改后,运行软件,重新截图一遍,查看是否有样式错乱。使用aau开发(http://www.aau.cn),在此特别推荐一下aau,一款国人研发的开发语言。

webmonitor源码地址:git://gitcafe.com/lcc/WebMonitor.git
webmonitor项目页面:https://gitcafe.com/lcc/WebMonitor

说明:1. git获取项目源代码 2. 从www.aau.cn上下载aau开发工具,用开发工具打开项目点击“运行”试用程序,或者点击“发布”生成应用程序。

使用截图:

创建项目

添加url

截的图片