Javascript.confirm () и тест Angularjs Karma e2e

У меня есть приложение Angularjs, которое использует простое подтверждение javascript перед выполнением некоторых действий.

Контроллер:

function TokenController($scope) {
  $scope.token = 'sampleToken';

  $scope.newToken = function() {
    if (confirm("Are you sure you want to change the token?") == true) {
      $scope.token = 'modifiedToken';
    }
  };
}

Вид:

<div id="tokenDiv">
  Token:{{token}} <button ng-click="newToken()">New Token</button>
</div>

Теперь я хочу провести сквозной тест, чтобы проверить, правильно ли заменяется токен в представлении. Как я могу перехватить вызов javascript.confirm(), чтобы он не остановил выполнение теста?

Тестовое задание:

it('should be able to generate new token', function () {
   var oldValues = element('#tokenDiv').text();
   element('button[ng-click="newToken()"]').click(); // Here the javascript confirm box pops up.
   expect(element('#tokenDiv').text()).not.toBe(oldValues);
});

До сих пор я пытался переопределить функцию window.confirm, но затем фактический вызов жалуется, что она не определена.

Я также хотел настроить шпиона Жасмин на window.confirm, но при следующем синтаксисе spyOn(window, 'confirm'); это дает мне ошибку, говорящую, что вы не можете шпионить за null.

Как мне сделать такой тест?


person mrt    schedule 07.05.2013    source источник


Ответы (3)


E2E тестирование

Проконсультируйтесь с этим проектом: https://github.com/katranci/Angular-E2E-Window-Dialog-Commands

Модульное тестирование

Если вы создаете службу для диалоговых окон, вы можете имитировать эту службу в своем модульном тесте, чтобы сделать свой код тестируемым:

Контроллер

function TokenController($scope, modalDialog) {
  $scope.token = 'sampleToken';

  $scope.newToken = function() {
    if (modalDialog.confirm("Are you sure you want to change the token?") == true) {
      $scope.token = 'modifiedToken';
    }
  };
}

modalDialog сервис

yourApp.factory('modalDialog', ['$window', function($window) {
    return {
        confirm: function(message) {
            return $window.confirm(message);
        }
    }
}]);

modalDialogMock

function modalDialogMock() {
    this.confirmResult;

    this.confirm = function() {
        return this.confirmResult;
    }

    this.confirmTrue = function() {
        this.confirmResult = true;
    }

    this.confirmFalse = function() {
        this.confirmResult = false;
    }
}

Тестовое задание

var scope;
var modalDialog;

beforeEach(module('yourApp'));

beforeEach(inject(function($rootScope, $controller) {
    scope = $rootScope.$new();
    modalDialog = new modalDialogMock();
    var ctrl = $controller('TokenController', {$scope: scope, modalDialog: modalDialog});
}));

it('should be able to generate new token', function () {
   modalDialog.confirmTrue();

   scope.newToken();
   expect(scope.token).toBe('modifiedToken');
});
person katranci    schedule 08.05.2013

Другой вариант - напрямую создать шпиона и автоматически вернуть true:

//Jasmine 2.0
spyOn(window, 'confirm').and.callFake(function () {
     return true;
});

//Jasmine 1.3
spyOn(window, 'confirm').andCallFake(function () {
     return true;
});
person Andrei V    schedule 29.08.2014
comment
Этот ответ отлично работает, если вы не хотите обновлять свой код, чтобы обернуть window.confirm вызовы. - person yvesmancera; 27.01.2016

В модульных тестах вы можете имитировать объект $ window следующим образом:

Ваш тест:

beforeEach(function() {
    module('myAppName');

    inject(function($rootScope, $injector) {
        $controller = $injector.get('$controller');
        $scope = $rootScope.$new();
        var windowMock = { confirm: function(msg) { return true } }
        $controller('UsersCtrl', { $scope: $scope, $window: windowMock });
    });
});

Ваш контроллер:

myAppName.controller('UsersCtrl', function($scope, $window) {
    $scope.delete = function() {
        var answer = $window.confirm('Delete?');
        if (answer) {
             // doing something
        }
    }
});
person Eyal Rosen    schedule 27.09.2013