问题标签 [phantomcss]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
1223 浏览

javascript - 测试 phantomCSS 找不到 ResembleJs 容器

我正在尝试将视觉比较测试添加到我的布局中,但似乎我没有正确配置我的测试环境。

我在用着:

这是我的测试 JS 文件:

当我运行casperjs test tests/layout.js测试开始时,创建屏幕截图并引发错误:

我检查了resemblejscontainer.html文件的位置,它正好在抛出的错误中列出的位置。

我哪里错了?

0 投票
1 回答
1246 浏览

javascript - 使用 CasperJS 单击网页上的每个链接

我一直在使用PhantomCSS为网站编写带有屏幕截图的视觉回归测试。我想在页面上的每个元素上模拟CasperJS的点击。a我能够检索每个 href 并使用它open来访问每个链接,但我想模拟一个click事件以进行 JavaScript 交互等。由于某种原因,我无法找到一种方法来做到这一点。

我可以通过以下方式获取页面上的所有链接:

但是casper.click()接收一个选择器作为参数,我在这个站点上有非常通用的链接。似乎是一项非常微不足道的任务,但由于某种原因,我还没有找到一种方法来做到这一点。

0 投票
3 回答
626 浏览

javascript - test.success 中的 PhantomCSS 未定义对象

我正在使用 PhantomCSS 编写测试脚本,但遇到了错误。我已经运行了一次我的脚本并创建了基线屏幕截图。现在,当我尝试再次运行它时,它会创建 .diff.png 图像,但随后会引发错误:

我注释掉了我的大部分 phantomcss.init() 代码,但这是我留下的:

编辑:phantomcss.js的第 426 行是:

0 投票
1 回答
781 浏览

javascript - 在 CasperJS 中拆分测试文件——与它的逻辑斗争

正如 Stack 的许多其他人正在努力解决的问题一样,我正在尝试将我的 CasperJS 测试拆分到多个文件中。我花了三天时间阅读文档并在这里浏览答案,但似乎找不到任何有帮助的东西。

我使用 --pre、--post 和 --include 命令包含了三个脚本(设置、函数、清理)。当我单独运行每个测试文件时,效果很好:

...产生...

但是,当我尝试在整个目录上运行 CapserJS 时,它并没有完全失败——它只是不起作用,从 --pre 步骤跳到 --post 步骤,而没有遍历目录中的任何文件目录:

没有通过,没有失败。只是。我完全不知所措。调试输出中没有任何内容。我在下面包含了脚本输出。如果有人知道接下来要尝试什么,我很想听听!


phantomcss-functions.js

phantomcss-setup.js

phantomcss-cleanup.js

tables.js(测试文件示例)

0 投票
2 回答
4904 浏览

javascript - While 循环设置 CasperJS “then()” 步骤

我正在尝试测试一些按钮的视觉状态——悬停、单击、聚焦——并且正在寻找一种方法来不casper.then()一遍又一遍地复制基本相同的命令。我想我应该能够在一个简单的循环中做到这一点。

我制作了一个由(当前)5 个按钮组成的小数组,并循环遍历它们,为我想要记录的每个状态添加 CasperJS 步骤。不幸的是,实际上只执行了最后一个步骤。

我已经阅读了许多关于循环的帖子,但它们似乎都涉及点击页面上的链接或其他一些似乎与我正在寻找的内容不匹配的场景。

也许我只是很密集?下面的代码...

0 投票
1 回答
280 浏览

node.js - 在 Windows 上安装 grunt-phantomcss

我正在尝试将 grunt-phantomcss 安装到我的应用程序,但出现以下错误:

有谁知道我能做些什么来解决这个问题?我试图清理 bower 和 npm 缓存,但我得到了同样的错误。

0 投票
1 回答
1048 浏览

node.js - 离线 Node.JS 包

如何在离线机器上安装节点包?

例如,我正在尝试将 PhantomCSS 安装到没有互联网连接的机器上。

0 投票
1 回答
283 浏览

phantomjs - PhantomCSS 不适用于此网站

我正在尝试进行此测试,但 PhantomCSS 似乎无法截取此特定网站的屏幕截图。

我收到这些错误消息:

同样的测试在其他网站上也能正常工作。

感谢帮助 !

0 投票
1 回答
238 浏览

jquery - PhantomCSS - Javascript 没有被执行

我正在尝试使用 phantomCSS 对 HTML 页面中的不同组件进行单元测试。我的测试 HTML 页面包含下拉元素。在这个 HTML 上,我加载了一个 javascript 文件,它将这些元素转换为(通过使用 jquery)。

因此,在我的 testSuite 中,我试图找到选择器“div.selected”并捕获该元素的屏幕截图。这里的问题是,PhantomCSS 根本没有找到那个选择器元素。

经过更多分析,我们发现页面中包含的脚本没有被执行。请看下面的代码。请注意,我们使用 gulp-phantomcss 运行测试,而不是通过命令行。

一旦加载了 toolkit.js,上面的 HTML 将被转换如下。

下面是我的 testSuite.js 文件(现在,我只是想看看我是否得到了我正在寻找的元素的屏幕截图)。

我在运行 testSuite 时收到以下消息。

我们在这里遗漏了什么吗?请帮助我们。

我稍微更改了 testSuite 以在错误消息上添加侦听器并得到以下错误。

加载页面时,我在 toolkit.js 中收到此错误。但是当我在浏览器中打开这个 HTML 时,不会抛出同样的错误。不确定这是否是因为无头浏览器中的行为。任何帮助,将不胜感激。

0 投票
1 回答
113 浏览

javascript - PhantomCSS/CasperJS - 使广告图像变灰

大家好,只是使用grunt-phantomcss插件(它本质上是 PhantomJS 和 CasperJS 的包装器)测试我们的页面。

我们的网站上有一些动态进入的内容(用户的随机个人资料图片和随机广告),所以从技术上讲,每次加载页面时页面看起来都不一样,这意味着构建失败。我们希望能够加入并使用良好的 DOM API 技术并“灰显”/使这些图像不透明,以便 Casper/Phantom 看不到它们并通过构建。


我们已经看过了pageSettings.loadImages = false,虽然这在技术上是可行的,但它也会删除每张图片,这意味着即使是我们的非广告、非个人资料图片也会被过滤掉。


这是一个非常基本的示例测试脚本(不起作用):

很想知道其他人是如何解决这个问题的,因为我确信这不是一个奇怪的用例(因为很多人在他们的网站上都有动态广告)。