Selecting auto-complete field?

I can’t seem to find a way to record a selection in google Autocomplete address table dropdown.
Neither xpath nor css configuration helped.
Any suggestions?
Thanks!

Capture.PNG

3 Likes

It seems to be an issue if the Dropdown is not a traditional Select. Katalon Studio team are working on that to fix the issue.

1 Like

Any progress on that please?

Any update on this? Is there a workaround?

Is there any update on this issue? I am facing a similar issue where I am able to locate the autocomplete element, but any action to select the value fails.

Have same issue, any update on this pls

Any answer to the topic? problem with autocomplete

Hi, have the same issue - input field with autocomplete on angularJS web application. Any Updates?

Hi,

In this case, I would suggest that we create a custom keyword to handle this dropdown.
Here is an example:

class JSelect {	KeywordLogger log = new KeywordLogger();	private TestObject oInput;	private String label;	private WebElement elInput;	public JSelect(){}	public JSelect(TestObject o) {		log.logInfo("Init JSelect by TestObject");		this.oInput = o;		this.elInput = WebUiBuiltInKeywords.findWebElement(oInput);	}	public JSelect(String label) {		log.logInfo("Init JSelect by Label");		this.label = label;		WebElement temp = driver.findElement(By.xpath(String.format("//label[starts-with(.,'%s')]", label)));		String id = temp.getAttribute("for") + "-field"		this.elInput = driver.findElement(By.xpath(String.format(".//input[@id='%s']", id)));	}	public JSelect(WebElement el) {		log.logInfo("Init JSelect by WebElement");		this.elInput = el;	}	private void openDropDown() {		log.logInfo("Open dropdown list");		this.elInput.click();	}	private void select(String text) {		log.logInfo("Selecting item: " + text);		if (elInput.getAttribute("value").equals(text)) {			return;		}		elInput.sendKeys(text);		elInput.sendKeys(Keys.ENTER);	}	@Keyword	def selectByText(TestObject o, String optionText) {		JSelect jselect = new JSelect(o);		jselect.select(optionText);	}	@Keyword	def selectByText(String labelSelect, String optionText) {		JSelect jSelect = new JSelect(labelSelect);		jSelect.select(optionText);	}	@Keyword	def selectByText(WebElement el, String optionText) {		JSelect jSelect = new JSelect(el);		jSelect.select(optionText);	}}

Trong Bui said:

Hi,

In this case, I would suggest that we create a custom keyword to handle this dropdown.
Here is an example:

class JSelect {	KeywordLogger log = new KeywordLogger();	private TestObject oInput;	private String label;	private WebElement elInput;	public JSelect(){}	public JSelect(TestObject o) {		log.logInfo("Init JSelect by TestObject");		this.oInput = o;		this.elInput = WebUiBuiltInKeywords.findWebElement(oInput);	}	public JSelect(String label) {		log.logInfo("Init JSelect by Label");		this.label = label;		WebElement temp = driver.findElement(By.xpath(String.format("//label[starts-with(.,'%s')]", label)));		String id = temp.getAttribute("for") + "-field"		this.elInput = driver.findElement(By.xpath(String.format(".//input[@id='%s']", id)));	}	public JSelect(WebElement el) {		log.logInfo("Init JSelect by WebElement");		this.elInput = el;	}	private void openDropDown() {		log.logInfo("Open dropdown list");		this.elInput.click();	}	private void select(String text) {		log.logInfo("Selecting item: " + text);		if (elInput.getAttribute("value").equals(text)) {			return;		}		elInput.sendKeys(text);		elInput.sendKeys(Keys.ENTER);	}	@Keyword	def selectByText(TestObject o, String optionText) {		JSelect jselect = new JSelect(o);		jselect.select(optionText);	}	@Keyword	def selectByText(String labelSelect, String optionText) {		JSelect jSelect = new JSelect(labelSelect);		jSelect.select(optionText);	}	@Keyword	def selectByText(WebElement el, String optionText) {		JSelect jSelect = new JSelect(el);		jSelect.select(optionText);	}}

Is this code will handle autosuggestion drop down??

Hi,
Can anyone help how to call the methods from one Test case to another??

Thanks

Alternatively to Trong Bui’s Code, you can probably just use coordinates to select the drop down, and then another set of coordinates to click a selected item(s).

sort out this issue like dis
01 click drop down list
02 send key down arrow, if you go to bottom, you can send multiple time Down key
03 finally send ENTER key

WebUI.click(findTestObject(‘Object Repository’))
WebUI.sendKeys(findTestObject(‘Object Repository’), Keys.chord(Keys.DOWN))
WebUI.sendKeys(findTestObject(‘Object Repository’), Keys.chord(Keys.ENTER))

3 Likes

How do you do that? How to implement coordinates?

I’m new to Katalon and I’ve spent so much time trying to figure out how to select a value from an auto-complete drop-down :woozy_face: This solution worked for me - thanks!

Amazing work around. Thanks!!!