手札:如何将自动化测试的截图自动的整理生成一个html展示出来
2016-05-12 11:31
417 查看
需求:cest
截图命名规则先在case中规定好,
1.我的规则是 case所在的文件名_case的function名字_$step_message
$step我直接写成++$step
这样的话 一个截图的命名规则就是 case所在的文件名【固定的】_case的function名字【固定的】_$step【自增的】_message【自定义】
有了一个规范的 命名规则,case跑完,截图截完 就很好处理了
2.现在来处理一大堆的截图,怎么美好的展示出来
现在截图好的一堆图片
效果图
思路。html的头尾打印好,中间处理的部分思路:文件夹名字一个for循环,嵌套file一个for循环,再嵌套functional,然后按step分别打印到html里面
echo BuildNo: ${BUILD_NUMBER} Screenshot>> $INDEX_HTML
function echo_folderOrCestHtml(){
echo '<li>'$1 >> $INDEX_HTML
echo '<ul>' >> $INDEX_HTML
}
function echo_end_ul_li(){
echo '</ul>' >> $INDEX_HTML
echo '</li>'>> $INDEX_HTML
}
function echo_caseHtml(){
if [ $3 = 'fail' ];then
IMGPATH=${RELATIVE_OUT_PATH}/$1
else
IMGPATH=${RELATIVE_OUT_PATH}/debug/$1
fi
str=$1
str1=${str#*$2}
IMGNAME=${str1%.png*}
echo path ${IMGPATH}
echo name ${IMGNAME}
SIGN="'"
echo '<li><a href="javascript:void(0);" class="click-before" onClick="showPicture(this,'${SIGN}${IMGPATH}${SIGN}');">'${IMGNAME}'</a></li>' >> $INDEX_HTML
}
function echo_bodyend(){
echo '</div>'>> $INDEX_HTML
echo '<div style="overflow-y:hidden;height:98%;width:auto;clear:both;margin-left:500px;position:absolute;margin-top:0px;">'>> $INDEX_HTML
echo '<span id="showPictures" class="show" style="background-size: 100% auto;width:1200px;height:900px;background-image: url('');background-repeat:no-repeat;display:inline-block;border:1px solid #ddd"></span>'>> $INDEX_HTML
echo '</div>'>> $INDEX_HTML
echo '</body>'>> $INDEX_HTML
echo '</html>'>> $INDEX_HTML
}
#echo_caseHtml 'testme'
#echo_folderOrCestHtml "folder"
arrFolder=(`ls -l --time-style=long-iso $FXTARCHIVE_PATH |grep ^d |grep -v steps |awk '{print $8}'`)
for folder in ${arrFolder[@]}
do
echo folder ${folder}
echo_folderOrCestHtml $folder
arrCest=(`ls -l --time-style=long-iso $FXTARCHIVE_PATH/$folder | awk '{print $8}'`)
for cest in ${arrCest[@]}
do
echo cest ${cest}
echo $FXTARCHIVE_PATH/$folder
cd $FXTARCHIVE_PATH/$folder
if [ $folder = "_11steps" ];then #not need steps. disable it
subCeststr=${cest%Steps.php*}
arrFun=(`ls |xargs grep 'public function' |awk -F '(' '{print $1}'|awk '{print $NF}'`)
else
subCeststr=${cest%Cest.php*}
arrFun=(`ls |xargs grep 'public function test' |awk -F '(' '{print $1}'|awk '{print $NF}'`)
fi
# subCeststr=${cest%Cest.php*}
echo_folderOrCestHtml $subCeststr
# flag=(`ls |xargs grep 'public function test' |awk '{print $1}'|awk 'NR==1'`)
echo arrFun ${arrFun[0]}
for funname in ${arrFun[@]}
do
echo funname ${funname}
# echo ${casename}
arrImg=(`ls -l --time-style=long-iso $OUTPUT_PATH/debug |grep $folder-$subCeststr-$funname| awk '{print $8}'`)
if [ ${#arrImg[@]} -eq 0 ];then
continue
else
echo_folderOrCestHtml $funname
for img in ${arrImg[@]}
do
echo $img
echo sizeof ${#arrImg[@]}
echo $folder-$subCeststr-$funname-
echo_caseHtml $img $folder-$subCeststr-$funname- case
done
# echo_end_ul_li
echo ====================
fi
echo_end_ul_li 'function'
done
echo_end_ul_li 'cest'
done
echo_end_ul_li 'folder'
done
执行的时候sh generateHtml.sh ${BUILD_NUMBER}_date:${BUILD_ID}_commit:${CMMIT_ID}即可
截图命名规则先在case中规定好,
1.我的规则是 case所在的文件名_case的function名字_$step_message
$step我直接写成++$step
这样的话 一个截图的命名规则就是 case所在的文件名【固定的】_case的function名字【固定的】_$step【自增的】_message【自定义】
有了一个规范的 命名规则,case跑完,截图截完 就很好处理了
2.现在来处理一大堆的截图,怎么美好的展示出来
现在截图好的一堆图片
效果图
思路。html的头尾打印好,中间处理的部分思路:文件夹名字一个for循环,嵌套file一个for循环,再嵌套functional,然后按step分别打印到html里面
echo BuildNo: ${BUILD_NUMBER} Screenshot>> $INDEX_HTML
function echo_folderOrCestHtml(){
echo '<li>'$1 >> $INDEX_HTML
echo '<ul>' >> $INDEX_HTML
}
function echo_end_ul_li(){
echo '</ul>' >> $INDEX_HTML
echo '</li>'>> $INDEX_HTML
}
function echo_caseHtml(){
if [ $3 = 'fail' ];then
IMGPATH=${RELATIVE_OUT_PATH}/$1
else
IMGPATH=${RELATIVE_OUT_PATH}/debug/$1
fi
str=$1
str1=${str#*$2}
IMGNAME=${str1%.png*}
echo path ${IMGPATH}
echo name ${IMGNAME}
SIGN="'"
echo '<li><a href="javascript:void(0);" class="click-before" onClick="showPicture(this,'${SIGN}${IMGPATH}${SIGN}');">'${IMGNAME}'</a></li>' >> $INDEX_HTML
}
function echo_bodyend(){
echo '</div>'>> $INDEX_HTML
echo '<div style="overflow-y:hidden;height:98%;width:auto;clear:both;margin-left:500px;position:absolute;margin-top:0px;">'>> $INDEX_HTML
echo '<span id="showPictures" class="show" style="background-size: 100% auto;width:1200px;height:900px;background-image: url('');background-repeat:no-repeat;display:inline-block;border:1px solid #ddd"></span>'>> $INDEX_HTML
echo '</div>'>> $INDEX_HTML
echo '</body>'>> $INDEX_HTML
echo '</html>'>> $INDEX_HTML
}
#echo_caseHtml 'testme'
#echo_folderOrCestHtml "folder"
arrFolder=(`ls -l --time-style=long-iso $FXTARCHIVE_PATH |grep ^d |grep -v steps |awk '{print $8}'`)
for folder in ${arrFolder[@]}
do
echo folder ${folder}
echo_folderOrCestHtml $folder
arrCest=(`ls -l --time-style=long-iso $FXTARCHIVE_PATH/$folder | awk '{print $8}'`)
for cest in ${arrCest[@]}
do
echo cest ${cest}
echo $FXTARCHIVE_PATH/$folder
cd $FXTARCHIVE_PATH/$folder
if [ $folder = "_11steps" ];then #not need steps. disable it
subCeststr=${cest%Steps.php*}
arrFun=(`ls |xargs grep 'public function' |awk -F '(' '{print $1}'|awk '{print $NF}'`)
else
subCeststr=${cest%Cest.php*}
arrFun=(`ls |xargs grep 'public function test' |awk -F '(' '{print $1}'|awk '{print $NF}'`)
fi
# subCeststr=${cest%Cest.php*}
echo_folderOrCestHtml $subCeststr
# flag=(`ls |xargs grep 'public function test' |awk '{print $1}'|awk 'NR==1'`)
echo arrFun ${arrFun[0]}
for funname in ${arrFun[@]}
do
echo funname ${funname}
# echo ${casename}
arrImg=(`ls -l --time-style=long-iso $OUTPUT_PATH/debug |grep $folder-$subCeststr-$funname| awk '{print $8}'`)
if [ ${#arrImg[@]} -eq 0 ];then
continue
else
echo_folderOrCestHtml $funname
for img in ${arrImg[@]}
do
echo $img
echo sizeof ${#arrImg[@]}
echo $folder-$subCeststr-$funname-
echo_caseHtml $img $folder-$subCeststr-$funname- case
done
# echo_end_ul_li
echo ====================
fi
echo_end_ul_li 'function'
done
echo_end_ul_li 'cest'
done
echo_end_ul_li 'folder'
done
执行的时候sh generateHtml.sh ${BUILD_NUMBER}_date:${BUILD_ID}_commit:${CMMIT_ID}即可
相关文章推荐
- 控制html元素中空格:white-space属性详解
- Html 5 新语义标签
- html页面颜色对应代码
- html hack 列表
- innerHTML/outerHTML; innerText/outerText; textContent
- html 语义化 资料
- HTML 5 placeHolder
- 如何解决div里面img图片下方有空白的问题?
- C#实现企业邮件发送,支持HTML格式
- 7-visual-studio-extension.html
- 107@365&nbsp;&nbsp;Html网页设计…
- HTML&nbsp;开发规范
- HTML
- 请求 ajax 基础配置
- [dhtmlxGantt(甘特图)开发手册]第三篇——语言设置、导出PDF/PNG、导出Excel/iCal等
- .NET MVC3中扩展一个HtmlHelper方法CheckBoxList
- 用innerHTML创建元素
- html中META标签的作用及SEO关键字优化办法
- HTML 空格符
- 本地ie版本大于7.0,MsHtml中get_userAgent获取UA为MSIE7