While my test passes smoothly on Safari, I encountered an issue on Chrome where the following code snippet fails to work:
it('should click the first source and get to the source preview page', function () {
var grid_icon = element(by.css('.fa-th'));
var sources = element.all(by.repeater('source in shownSources'));
sources.get(0).element(by.tagName('a')).click();
browser.pause();
// Check url
expect(browser.getCurrentUrl()).toContain('/source/');
});
Upon clicking the hyperlink, the URL should contain "/source/". This works perfectly in Safari, but not in Chrome.
Here is my Protractor configuration file:
exports.config = {
framework: 'jasmine2',
seleniumServerJar: '../node_modules/protractor/selenium/selenium-server-standalone-2.45.0.jar',
seleniumPort: 4444,
troubleshoot: false,
basePath: '../',
specs: ['protractor/***/**/*.js'],
baseUrl: 'http://localhost:9000',
capabilities: {
browserName: 'chrome'
},
onPrepare: function() {
browser.manage().window().maximize();
}
};
Edit: While the initial problem no longer exists, the test still behaves strangely. The following code works fine in Safari:
it('should add all sources to the list and show the cart icon on the source in inventory', function () {
browser.get('/sources');
var ordersources = element.all(by.repeater('orderSource in orderSources'));
var sources = element.all(by.repeater('source in shownSources'));
sources.get(0).element(by.css('a')).click();
var add_to_cart_btn = element(by.binding('addBtnText'));
add_to_cart_btn.click();
browser.get('/sources');
sources.get(1).element(by.css('a')).click();
var add_to_cart_btn = element(by.binding('addBtnText'));
add_to_cart_btn.click();
browser.get('/sources');
browser.pause();
sources.get(2).element(by.css('a')).click();
var add_to_cart_btn = element(by.binding('addBtnText'));
add_to_cart_btn.click();
browser.get('/sources');
expect(ordersources.count()).toBe(3);
sources.each(function (field) {
var isInCart_symbol = field.element(by.css('.fa-cart-arrow-down'));
expect(isInCart_symbol.getAttribute('aria-hidden')).toBe('false');
});
});
However, in Chrome, the 'a' item isn't found the second time and the browser.sleep() is never executed, causing the next 'it' block to run prematurely.
EDIT: I managed to resolve the issue by using a different HTML element identified by the class attribute.
element.(by.css('.example'))