Protractor: How to click a select option that has a given value

Today I needed to click on a select option that had a specific value using protractor.
After Googling for a while, I did it using the element selection by xpath.
This is the helper function I created:

	var TestTools = {
	// some other helpers
	// ...
	clickDropdownOptionWithGivenValue: function (
	selectId, optionValue) {
	element(by.css('#' + selectId)).click();
	return element(
	by.xpath(
	'//select[@id="' + selectId +
	'"]/option[text()="' + optionValue + '"]')
	).click();
	}
	};
	// some other exports
	// ...
	module.exports.clickDropdownOptionWithGivenValue = TestTools.clickDropdownOptionWithGivenValue;

view raw clickDropdownOptionWithGivenValue.js hosted with ❤ by GitHub

And this is how it's used from the test:

	describe("In the project details page", function () {
	var TestTools = require('./TestTools'),
	Navigation = require('./Navigation'),
	ptor;
	beforeEach(function () {
	TestTools.resetTestData();
	ptor = protractor.getInstance();
	ptor.get('/ebo/#/projects/excecutive-education');
	Navigation.logIn(ptor);
	TestTools.waitForElementByCssToBePresent(
	'.project-item__title', ptor);
	});
	// some other tests
	// ...
	it("A landing gets duplicated", function () {
	expect(
	element.all(
	by.repeater('landing in project.landings')).count()
	).toBe(6);
	element.all(by.css('.duplicate')).first().click();
	element(by.css('#input_duplicate_new_name')).sendKeys("new_name");
	TestTools.clickDropdownOptionWithGivenValue(
	'project-name-select', 'Excecutive Education'
	).then(function () {
	element(by.css('.button_big')).click();
	expect(
	element.all(
	by.repeater('landing in project.landings')
	).count()
	).toBe(7);
	}
	);
	});
	});

view raw selectWithGivenOption.js hosted with ❤ by GitHub

----------------

PS: Check also my previous posts about Protractor:

• How to avoid UnexpectedAlertOpenError
• How to select a dropdown option to avoid ElementNotVisibleError