Question

我有以下控制器：

export default function($scope, $state, $http) {
    $scope.login = () => {
        $scope.loginFailed = false;

        const postReq: object = {
            method: 'POST',
            url: `/login`,
            data: {},
        }

        try {
            console.log('$scope.login');

            const response = await $http(postReq);

            console.log('login done');

            console.log('$state.go');

            $state.go('dashboard');

            return true;
        } catch(err) {
            console.error(err);
            $scope.loginFailed = true;

            return false;
        }
    };
}

我正在尝试用茉莉花测试这种方法

it('change state to dashboard', async (done) => {
    $httpBackend.expectPOST('/login', undefined).respond(201, { rmId: 123123 });

    await $scope.login();
    expect($state.current.name).toBe('dashboard');
});

我的测试结果如下：

日志：“ $ scope.login” PhantomJS 2.1.1（Mac OS X 0.0.0）$ scope.login将状态更改为仪表板失败

现在看来，茉莉花并没有在等待$http通话完成。（当我在浏览器中手动测试它时，效果很好）

有没有更好的方法来正确测试异步方法？

Answer 1

您不需要等待。您只需要在期望测试之前刷新后端模拟您的登录功能必须像这样更改：

$scope.login = () => {
       return new Promise((resolve, reject) => {
          $scope.loginFailed = false;

        const postReq = {
            method: 'POST',
            url: `/login`,
            data: {},
        }

        const response = $http(postReq).then(
          (success) => {
              $state.go('dashboard');
              resolve(true);
            },
            (error) => {
               $scope.loginFailed = true;

            reject(false);
            });
       });
    };

您的测试如：

it('change state to dashboard', async (done) => {
    const  backendMock = $httpBackend;
    backendMock.expectPOST('/login').respond(201, { rmId: 123123 });
    $scope.login().then((response) => {
      expect($state.current.name).toBe('dashboard');
      done();
    });
    backendMock.flush();

});

Answer 2

在编写断言之前，您需要使用$httpBackend.flush();。在您的expect语句之前添加此行。应该可以。

Karma + Jasmine测试异步方法

2 个答案: