手札：如何将自动化测试的截图自动的整理生成一个html展示出来

需求：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