Javascript UI组件和小部件的测试驱动开发

我正在构建一个相当大的JS应用程序，其中有许多UI小部件需要相互交互

因为我使用AngularJS作为核心，所以我想为每个控制器实现单元测试，以跟踪它们的正确行为

嗯

现在，我还想测试UI，我有一些手动执行的用例，并查看组件的反应

例如：

我有一个滑块，我在其中加载不同大小的图片，每次滑块重新加载和重新启动时，它必须包含4个，并且大小正确（根据屏幕分辨率）

我想到的是使用CasperJS并编写一个测试脚本来检查每次刷新时滑块的框大小，然后检查是否所有元素都在那里，检查它们的大小，单击它们等等

我知道这在很大程度上取决于浏览器/系统，但也许必须有一个最佳的方法来做到这一点

我的看起来有点像黑客，不优雅，我怎么能做得比这更好呢？以前有人遇到过这个问题吗？ 谢谢

这将是一个很好的工具-它将允许您编写脚本，直接通过浏览器测试您的UI，并且被广泛使用，因此应该有大量的帮助和建议可供使用。此外，它还有一个额外的好处，就是可以很容易地在多个浏览器上运行测试（例如，Firefox、Safari、Chrome都支持）

我个人发现它非常适合此类测试——当然，将测试放在一起需要付出相当大的努力，而且脚本通常不像人们希望的那样干净，但最终它会带来很多价值