使用量角器測試AngularJS

我正在開發一個AngularJS應用程序，並且最近被要求將一些自動化測試集成到我們的開發過程中。之前我還沒有使用過自動化測試，所以我仍然在努力處理它。使用量角器測試AngularJS

我決定使用的框架是Protractor，我只是看着開始編寫一些基本的測試，但是，我有點麻煩從一些內部的HTML元素spec.js文件，我的測試將被寫入。我有以下describe塊spec.js：

describe('My App', function() { 
    var loginForm = element(by.id('loginForm')); 
    var loginBtn = element(by.className('form-control')); 
    var usernameInputField = element(by.id('inputName')); 
    var passwordInputField = element(by.id('inputPass')); 

    it('should hit the VM hosted site', function() { 
     browser.get('http://192.168.x.xyz:8080'); 
     expect(browser.getTitle()).toEqual('My app'); 
    }); 

    //Test to log in: 
    it('should enter the username into the username field on log in form', function() { 
     usernameInputField.sendKeys('username'); 
     passwordInputField.sendKeys('password'); 

     expect(loginForm.usernameInputField).toEqual("admin"); 
     expect(loginForm.passwordInputField).toEqual("password"); 
    }); 
});

我conf.js文件目前看起來是這樣的：

exports.config = { 
    framework: 'jasmine', 
    seleniumAddress: 'http://localhost:4444/wd/hub', 
    specs: ['spec.js'], 
    multiCapabilities: { 
     browserName: 'firefox' 
    } 
}

當我在命令行中運行命令protractor conf.js，我得到一些輸出，上面寫着：

失敗：找不到使用定位符的元素：By（css selector，「[id =」loginForm.inputName「]）

我在瀏覽器中檢查了窗體上用戶名的輸入字段，它顯示HTML元素的'name'屬性是'inputName'，並且該元素嵌套在loginForm元素中。

我不明白爲什麼控制檯給我的錯誤，說它試圖找到使用CSS選擇器的元素 - 我期待它試圖通過它的HTML標籤的'名稱'來查找元素，屬性...很明顯，我在寫'登錄測試'的時候做錯了什麼，因爲如果我發表評論，並且再次運行protractor conf.js，我會得到0次失敗 - 所以其他測試正在成功運行。 ..

我在做什麼錯在這裏？如何獲取表單輸入字段並在其中輸入正確的登錄詳細信息以檢查「登錄」功能是否正常工作？另外，雖然我也想測試'登錄'功能，但在測試過程中是否有'跳過'這一方法，以便我可以在應用程序的所有功能上運行測試，沒有量角器每次都必須登錄到應用程序才能運行測試？

編輯

我已經改變了，我想要得到的表單元素的變量定義，使他們現在是：

var loginBtn = element(by.className('form-control.submit')); 
var usernameInputField = element(by.id('loginForm.inputName')); 
var passwordInputField = element(by.id('loginForm.inputPass'));

和也改變了測試：

it('should enter the username into the username field on log in form', function() { 
    usernameInputField.sendKeys('username'); 
    passwordInputField.sendKeys('password'); 
    loginBtn.by.css('button.button.primary').click(); 

    expect(loginForm.usernameInputField).toEqual("username"); 
    expect(loginForm.passwordInputField).toEqual("password"); 
});

這似乎已清除了我得到的No element found using locator...錯誤消息。不過，我現在得到另一個錯誤，說：

失敗：不就行了閱讀的不確定

財產 'CSS'：

loginBtn.by.css('button.button.primary').click();

我不明白爲什麼這是...任何人都可以解釋我在這裏做錯了嗎？我將如何解決這個錯誤？

來源

2017-09-22 someone2088

這是你的測試失敗：

loginBtn.by.css('button.button.primary').click();

你應該把它變成：

loginBtn.click()

來源

2017-09-23 17:27:42

嘗試更換

var loginBtn = element(by.className('form-control.submit'));

通過

var loginBtn = element.all(by.css('.form-control.submit')).get(0);

來源

2017-09-22 12:01:23 scipper

感謝您的建議。我給出了一個去，但仍然得到錯誤，說'失敗：無法讀取未定義的屬性'css'，這似乎是來自行：'loginBtn.by.css（'。button.button.primary' ）.click（）;'，這表明'loginBtn'在其定義中沒有正確地分配HTML元素...？這是對的嗎？ – someone2088

不一定。如果選擇器匹配，它將返回一個沒有屬性'by'的元素（http://www.protractortest.org/#/api?view=ElementFinder）。所以，如果你想子選擇'button.button.primary'，試試這個：loginBtn.element（by.css（'button.button.primary'）） – scipper

所以我給了它一個去，但得到一個錯誤說：'失敗：找不到使用locator的元素：按（css selector，button.button.primary）'... – someone2088

使用量角器測試AngularJS

回答

相關問題