如何分享pytest-html生成的HTML报告且避免CSS样式错乱？

这问题我之前帮同事踩过坑，太典型了！咱们一步步说清楚：

为什么分享后样式会错乱？ #

主要有两个核心原因：

• 样式文件未同步分享：默认情况下，pytest-html生成的HTML报告是通过相对路径引用同目录下assets文件夹里的style.css样式文件的。你本地打开时，浏览器能找到同目录的样式文件，但如果只把HTML文件发给经理，他那边没有配套的assets文件夹，自然加载不到样式，页面就乱了。
• 浏览器本地文件安全限制：有些浏览器（比如Chrome）出于安全考虑，会限制本地HTML文件加载同目录的其他资源，就算经理拿到了完整文件，直接双击打开也可能加载失败。

靠谱的解决方案 #

方案1：生成独立的内嵌样式报告（最推荐） #

直接用pytest-html的--self-contained-html参数，这个参数会把所有CSS、JS资源都内嵌到单个HTML文件里，变成一个完全独立的报告，分享时只发这一个文件就行，再也不会有样式丢失的问题。

执行命令：

pytest --html=test_report.html --self-contained-html

生成后你可以把这个HTML文件随便拷贝到任何地方打开，样式都是完整的。

方案2：完整打包所有报告文件 #

如果不想用内嵌方式，那分享时一定要把生成的HTML文件和同目录下的assets文件夹一起打包（比如压缩成ZIP），让经理把这两个文件放在同一个目录下再打开HTML，这样浏览器就能找到样式文件了。

方案3：临时解决浏览器安全限制（不推荐） #

如果是浏览器安全限制导致的，可以让经理用命令行启动浏览器并关闭本地文件访问限制：

• Windows系统（Chrome）：

  chrome.exe --allow-file-access-from-files
  

• Mac系统（Chrome）：

  open -a "Google Chrome" --args --allow-file-access-from-files
  

不过这个方法需要对方修改浏览器启动方式，通用性差，不如前两种方案省心。

内容的提问来源于stack exchange，提问作者manoj