基于Playwright自动化测试部署方案

方案概述

基于playwright框架，搭建了自动化测试项目，在服务器上使用Docker起容器跑镜像，镜像内容基于playwright的官方镜像，并向其中移入了host文件，以便切换测试用例运行所在的环境（测试/线上环境）。

引入测试用例的管理后台，方便测试用例与测试报告的管理。管理后台中可以使用Docker官方提供的远程api创建并运行容器来跑测试用例，也能在管理后台上能看到最终的测试报告。

整体流程图

镜像构建与容器启动

基于playwright的官方镜像，在容器启动前做一些前置动作（entry.sh）。

Dockerfile

FROM mcr.microsoft.com/playwright:v1.24.2-focal
# 设置时区
ENV TZ=Asia/Shanghai
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
WORKDIR /
USER root
ENTRYPOINT ["/shareDir/entry.sh"]
#第一个是分支名称，第二个是测试用例名称
CMD ["master", "share3d"]

entry.sh

#!/usr/bin/env bashecho"准备环境"cat /shareDir/hosts >> /etc/hosts
mkdir /root/.ssh
rm -f /root/.ssh/id_rsa /root/.ssh/id_rsa.pub
cp /shareDir/id_rsa /root/.ssh
cp /shareDir/id_rsa.pub /root/.ssh
cp /shareDir/known_hosts /root/.ssh
chmod 0600 /root/.ssh/id_rsa
chmod 0600 /root/.ssh/id_rsa.pub
chmod 0600 /root/.ssh/known_hosts

echo"克隆仓库"git clone -b $1<仓库地址>echo"当前分支"cd automationtestcase
git status

echo"安装依赖"npminstallecho"跑用例"npm run test:$2echo"传输结果"a="/automationtestcase/report@$(date"+%Y-%m-%d-%H:%M:%S")"mv /automationtestcase/playwright-report $ascp -r $a root@公网ip:/usr/www/tumax-automationtestcase-report/$2/

Docker配置远程API调用控制

1、修改配置

vi /lib/systemd/system/docker.service

2、找到 ExecStart 配置项，在其中插入监听选项：-H tcp://0.0.0.0:5678（如果是内网生产环境，请将 0.0.0.0 改为内网 IP），最后为：

ExecStart=/usr/bin/dockerd -H unix://var/run/docker.sock -H tcp://0.0.0.0:5678

3、重启docker后，查看5678端口

systemctl daemon-reload
systemctl restart docker

[root@localhost system]# netstat -nutlp | grep 5678
tcp6       00 :::5678                 :::*                    LISTEN      114226/dockerd

管理后台远程调用

官方文档

直接调用接口会出现跨域问题，需要在项目配置和nginx上配置代理（或者直接在nginx下做一层代理也可以，这里就不做代码展示了）

// vite.config.tsexportdefault()=>{...
  server:{...
    proxy:{...'^/dockerContainer/.*':{
        target:'http://公网ip:5678',
        changeOrigin:true,rewrite:(path)=> path.replace(/^\/dockerContainer/,''),},},},...}

# /usr/local/openresty/nginx/conf/vhost/tumaxautotest.conf
location /dockerContainer/ {
  proxy_pass http://公网ip:5678/;
}

需要注意的问题

1、启动测试用例后会占用比较多的资源，注意服务器负载情况，避免影响到其他的服务。

2、服务器性能不够，会导致测试用例卡死的情况，如果运行的是比较大型的web项目，需要提前注意一下。

结果展示