规划你的应用

优质

小牛编辑

128浏览

2023-12-01

为了展示如何搭建Ember应用程序，我们将搭建一个资产租赁的应用，叫Super Rentals。我们将开始于一个home页面，一个about页面和一个联系我们页面。应用程序的构成是：

在home页面上显示租赁清单
链接到关于公司的页面
链接到“联系我们”的页面
列出有效的租赁清单
按城市过滤租赁清单
显示一个选中租赁的详细信息

上面列出了6个路由，在下文的验收测试中提到“应用目标”，就是指将这6个路由分别测试一遍。如果再加上根路由/，则共有7个路由。

用We Go测试应用程序

验收测试与我们的应用程序进行交互，就像实际的人一样，但是是自动化的，有助于确保我们的应用程序在将来不会中断。
当我们使用Ember CLI创建一个新的Ember项目时，它使用 QUnit JavaScript 测试框架来定义和运行测试。
我们将首先使用Ember CLI生成新的验收测试：

$ ember g acceptance-test list-rentals
installing acceptance-test
  create tests/acceptance/list-rentals-test.js

可以打开生成的tests/acceptance/list-rentals-test.js的文件看看其内容。发现生成的测试代码的第一个测试是请求/list-rentals路由。这时我们的应用还没有定义任何路由，所以可以把文件中的三个/list-rentals都改成/来测试应用的基础URLhttp://c7302.ambari.apache.org:4200/。修改后的tests/acceptance/list-rentals-test.js如下：

import { test } from 'qunit';
import moduleForAcceptance from 'super-rentals/tests/helpers/module-for-acceptance';

moduleForAcceptance('Acceptance | list rentals');

test('visiting /', function(assert) {
  visit('/');

  andThen(function() {
    assert.equal(currentURL(), '/');
  });
});

对于这个简单测试，需要注意的几点是：

验收测试通过调用函数moduleForAcceptance来建立，此函数确保您的Ember应用程序在每次测试之间启动和关闭。
QUnit传到一个叫assert的对象到每个测试函数。assert含有函数，如equal()，允许检查测试环境中的条件。一个测试必须有一个通过断言才能成功。
Ember验收试验使用一组测试助手函数，如visit，andThen和上面使用的currentURL函数。我们将在本教程的后面更详细地讨论这些功能。

现在启动测试：

$ ember test --server --host c7302.ambari.apache.org

默认情况下，当执行上述命令时，Ember CLI 会运行 Testem test runner, 它会在Chrome和 PhantomJS 中运行Qunit。

按屏幕的提示，让用浏览器访问地址 http://c7302.ambari.apache.org:7357/。

浏览器上现在显示10次成功测试。如果取消选中Hide passed tests，应该看到我们的验收测试成功，以及9次通过的 ESLint 测试。

添加应用的完整目标到验收测试

虽然现在只有一个根路由/可以测试，但可以先创建完整的测试文件。编辑tests/acceptance/list-rentals-test.js，如下列内容：

import { test } from 'qunit';
import moduleForAcceptance from 'super-rentals/tests/helpers/module-for-acceptance';

moduleForAcceptance('Acceptance | list-rentals');

test('should show rentals as the home page', function (assert) {
});

test('should link to information about the company.', function (assert) {
});

test('should link to contact information.', function (assert) {
});

test('should list available rentals.', function (assert) {
});

test('should filter the list of rentals by city.', function (assert) {
});

test('should show details for a selected rental', function (assert) {
});

test('visiting /', function(assert) {
  visit('/');

  andThen(function() {
    assert.equal(currentURL(), '/');
  });
});

然后运行 ember test --server。则在linux屏幕上显示：

Chrome 61.0 
    1/7

而浏览器上显示：

7 tests completed in 18000 milliseconds, with 6 failed, 0 skipped, and 0 todo.
1 assertions of 7 passed, 6 failed.

这是因为除了根路由/，其它路由还没有创建，所以测试出错。共7个测试，通过1个，失败了6个。