使用Browserify捆绑CasperJS + SlimerJS的代码?

时间:2016-04-20 19:00:59

标签: javascript node.js browserify casperjs slimerjs

TLDR;我的问题是:有没有办法使浏览器不使用自己的实现覆盖require,而是让它使用不同的方法名称(例如browserifyRequire)来满足其内部需求。要了解我需要这样做的原因,请继续阅读...

场景

我正在尝试使用CasperJS编写一些自动化测试并在SlimerJS中运行它们 - 而不是默认的PhantomJS(尽管我知道,我会遇到与PhantomJS相同的以下问题)。

真的想要弄清楚如何在CoffeeScript中编写这些内容。事实证明,现在CasperJS或SlimerJS在使用CoffeeScript方面表现不佳。文档的建议是在运行casper之前编译为JS。好的......不是很方便,但我可以处理它。事实上,我也发现require在这些工具中解析路径的方式并不像在Node中那样简单,因此在运行之前进行捆绑也应该有帮助。

但是现在我在尝试运行捆绑代码时遇到了一系列新问题。我正在使用Browserify。

问题

在我的测试代码中,我需要require('casper')。 CasperJS世界的标准做法。因此,我必须通过将"browser": { "casper": false }放入我的package.json来告诉browserify不要捆绑CasperJS。到目前为止没有probs。但接下来的问题是:

Browserify会覆盖内置的require函数,提供自己的require实现,它可以完成使浏览器工作的所有功能。在遇到require('casper')指令之前,CasperJS很好。这是CasperJS有一次必须进行require,而不是浏览器化。那就失败了。

不完整的解决方案

我很确定CasperJS无法处理Browserify覆盖require的事实,因为CasperJS实现了自己的require方式。为了测试该假设,我手动编辑了生成的包,将require的每个出现重命名为browserifyRequire - 包括browserify对require的实现。我保持不变的唯一require是对require('casper')的调用,因为这是我需要CasperJS来处理require的时间。事实上,这使事情按预期发挥作用。

问题

同样,有没有办法让浏览器为其内部require使用不同的名称?我想我可以编写一个脚本来在捆绑后进行此更改,但我更愿意通过配置找出如何做到这一点。

替代问题

也许代替Browserify,还有另一种在CasperJS中捆绑和运行CoffeeScript的解决方案?我还没找到一个......

1 个答案:

答案 0 :(得分:0)

找到一个合理的解决方案 - 可以作为npm脚本运行,例如npm run build-test-bundle添加到package.json

"scripts": {
  "build-test-bundle": "browserify -t coffeeify casper-coffee-test.coffee | derequire | sed 's/_dereq_..casper../require(\"casper\")/g' > casper-coffee-test.compiled.js"
},

这一系列命令执行以下操作:

  1. browserify -t coffeeify casper-coffee-test.coffee构建捆绑包
  2. | derequire将浏览器输出传递给derequirenpm将所有require函数重命名为_dereq_
  3. | sed 's/_dereq_..casper../require(\"casper\")/g'将之前的输出通过sed命令,将替换为正常需要所有出现的_dereq_("casper")