首页 > 解决方案 > 快照网站上的所有 CSS

问题描述

我正在尝试编写一个在浏览器中运行的工具(在 Javascript 中),并且可以在单个时间点获取网站状态的“快照”。它去除脚本标签,将图像和字体内联到数据 url,并内联 CSS。不过,CSS 部分在某些网站上给我带来了麻烦。

我首先假设 document.styleSheets 有一个页面当前样式的权威列表。似乎只是按顺序选择这些规则并不能让我获得页面上的所有活动样式。

此外,由于跨域内容,document.styleSheets 中的某些工作表似乎无法访问。

有没有办法“走 CSSOM”页面?理想情况下,我无需编写浏览器扩展就可以做到这一点。最终目标是在长时间运行的 e2e 测试失败时提供可检查的快照。谢谢你的帮助!

标签: javascripthtmlcssautomated-testscssom

解决方案


我不知道我是否正确理解了您的目标,但是有一些很好的工具可以进行 css 单元测试。

https://github.com/jamesshore/quixote

也许这符合您的需要,您可以通过单元测试解决您的问题。


推荐阅读