2016-05-04 5 views
1

このように、ページ上の要素にいくつかのメソッドを提供するページオブジェクトファイルがあります。このページは、テキスト、ユーザー名とパスワードの入力要素、およびログインボタンを含むログインページです。私はテスト目的のためにラベルと入力要素を結びつける "InputLabel.js"という汎用オブジェクトを作成しました。Page ObjectファイルのsendKeys結果の結果が未定義のエラー(投機器)

問題は、入力をクリアしてデータを送信した後にデータを確認した後、Failed: Cannot read property 'verifyValue' of undefinedエラーが発生しているという問題です。

// InputLabel.js 

function InputLabel(container) { 
    this.Container = container; 
} 

InputLabel.prototype = { 
    constructor: InputLabel, 
    // ... 
    /** 
    * Return the element for the input of the input/label combination of elements. 
    * 
    * @returns {ElementFinder} 
    */ 
    getInput: function() { 
     return this.Container.$('input'); 
    }, 
    /** 
    * Return the text shown in the input of the input/label combination of elements. 
    * 
    * @returns {Promise} 
    */ 
    getValue: function() { 
     return this.getInput().getAttribute('value'); 
    }, 
    /** 
    * Verify the text shown in the input of the input/label combination of elements. 
    * 
    * @param expected The expected text in the input element. 
    */ 
    verifyValue: function (expected) { 
     console.log('Asserting input value [' + expected + ']'); 
     expect(this.getValue()).toEqual(expected); 
    }, 
    // ... 
    /** 
    * Clears the input element then puts the text from data into the input element. 
    * 
    * @param data The text to be entered into the input element. 
    */ 
    sendKeys: function (data) { 
     var el = this.getInput(); 
     el.clear().then(function() { 
      el.sendKeys(data).then(function() { 
       console.log("Verifying [" + data + "] was sent to the input.") 
       this.verifyValue(data); 
      }); 
     }); 
    } 
}; 

ファイルを必要とした後、私はのSendKeys以外問題なくこれらのメソッドを呼び出すことができます。

は、ここで関連するコードです。 this.verifyValue(data);メソッドを無効にすると、sendKeysは正常に動作します。

// LoginPage.js 

var InputLabel = require('InputLabel.js'); 

function LoginPage() { 
} 

var username = new InputLabel($('#username')); 
var password = new InputLabel($('#password')); 

function.prototype = { 
    // ... 
    username: username, 
    password: password, 
    loginButton: { 
     get: function() { return $('#Login'); }, 
     click: function() { return this.get().click(); } 
    }, 
    // ... 
    login: function(user, pw) { 
     this.username.sendKeys(user); 
     this.password.sendKeys(pw); 
     this.loginButton.click() 
    } 
} 

範囲内で何かを失っていますか?繰り返しますが、エラーは、キーを送信した後、未定義のプロパティ 'verifyValue'を読み取ることができないために失敗することです。

答えて

3

"this.verifyValue(data);"が含まれている行に "this"キーワードのスコープの問題があります。この場合、 "this"キーワードはInputLabelクラスを参照しません。また、ページオブジェクトをアサーションフリーに保つことも良い方法です。 http://martinfowler.com/bliki/PageObject.html

+0

私が「これ」を取ったとき。そのオフ、私はまだ同じエラーが発生します。 'Failed:verifyValueが定義されていません。 '私はあなたのリンクを見て、それから学びます。ありがとうございました。 – Machtyn

+2

最初の約束 'el.clear()'に入ると、@finspinは 'this'のスコープを失います。 'sendKeys'関数の基底レベルで' var self = this; '(InputLabelのスコープを保ちます)を入力し、' self.verifyValue(data);を使います。 – martin770

+0

ありがとう。それはとても役に立ちます。私は再びそれにぶつかったので。 (私はまだjavascriptスタイルを学んでいます。) – Machtyn