Protractor PageObject 实现后函数停止工作

Question

我在执行多个测试时遇到问题（我这里有两个）。似乎函数 deleteOneTask() 停止工作，我的测试开始相互失败。在我开始使用 PageObject 之前一切正常。

Stacktrace:
     TypeError: Cannot read property 'click' of undefined
    at c:\Users\Денис\WebstormProjects\ProtractorTest\pages\angular.page.js:29:30

指的是这一行：this.deleteButton.click();

这是我的spec.js

'use strict';

var todoAppPage = require('../pages/angular.page');

describe('angularjs todo list', function () {

    var page;

    beforeEach(function () {
        page = new todoAppPage();
        page.get();
    });

    it('should add a todo task', function () {
        page.addNewTask('my first task');

        expect(page.todoList.count()).toEqual(1);
        expect(page.todoList.get(0).getText()).toEqual('my first task');
        page.deleteOneTask(); //here it won't work
    });

    it('should show correct number of undone tasks', function () {
        page.addNewTask('my first task');

        expect((page.counter).getText()).toEqual('1'); 
        page.deleteOneTask(); //here it won't work
    });

    it('should show correct number of undone tasks2', function () {
        var deleteButton = element.all(by.className('destroy')).get(0);
        var viewArea = element(by.model('todo.completed'));

        page.addNewTask('my first task');
        expect((page.counter).getText()).toEqual('1'); 

        element(by.id('footer')).element(by.linkText('All')).click();
        browser.driver.actions().mouseMove(viewArea).perform().then(function () { //hover and delete single task
        deleteButton.click();
    });; //here it will work
  });
});

这是页面对象文件

'use strict';

var todoAppPage = function() {

    this.newTodo = element(by.model('newTodo'));
    this.todoList = element.all(by.repeater('todo in todos'));
    this.viewArea = element(by.model('todo.completed'));        
    this.deleteButton = element.all(by.className('destroy')).get(0);
    this.categoryAll = element(by.id('footer')).element(by.linkText('All'));
    this.counter = element(by.id('todo-count')).element(by.className('ng-binding'));

    this.get = function() {
        browser.get('#/');
    };

    this.addNewTask = function (taskName) {
        this.newTodo.sendKeys(taskName);
        this.newTodo.sendKeys(protractor.Key.ENTER);
    };

    this.deleteOneTask = function () {
        this.categoryAll.click(); //go to 'All' category
        browser.driver.actions().mouseMove(this.viewArea).perform().then(function () { //hover and delete single task
        this.deleteButton.click();
    });
  };
};

module.exports = todoAppPage;

Answer 1

如评论中所述，使用 that = this 将解决您的问题。例如。

this.deleteOneTask = function () {
  var that = this;
  this.categoryAll.click(); //go to 'All' category
  browser.driver.actions().mouseMove(this.viewArea).perform().then(function () { //hover and delete single task
  that.deleteButton.click();
});

这是我见过的最好的解决方案，但我也很乐意看到更好的解决方案。

Protractor PageObject 实现后函数停止工作

Function stopped working after Protractor PageObject implementation

javascript

jasmine

angularjs

protractor