I use own library for functional testing in PHP, it's based on JsonWireProtocol.
I have an select element selected by id and I need to select 2 options from this element. I know how to select singe element - I just find desired option and click on it. But it's impossible with 2 options as second click deselects first one.
How can I achieve this?
As workaround I send a JavaScript line but I'm not happy with this solution.
From the JsonWireProtocol draft version I understand that Selenium interprets modifier-keys such as ctrl and shift as sticky. http://code.google.com/p/selenium/wiki/JsonWireProtocol#/session/:sessionId/keys and code.google.com/p/selenium/wiki/JsonWireProtocol#/session/:sessionId/keys
So I haven't tested this myself, but it seems to me that you can send a ctrl-keypress, follow by two clicks on the options you want to select, and then another ctrl-keypress to "depress" the ctrl-key.
Related
I need to add multiple attribute to a select list, but unfortunately the dropdown list is not editable through HTML since it is a drag and drop feature of a CMS (Spiceworks user portal) I am using.
The CMS is quite outdated; my only other option is to add checkboxes which would make the page extremely long, since there are a total of 15 options to select. (In my example, this is different)
There is no listbox option in the CMS, which is why I need to use javascript to force the dropdown to act like a listbox.
Please look here at what I tried to do: https://jsfiddle.net/jamiedewitz/sdyn0xqz/
Is there a way to force javascript to add the multiple attribute to the dropdown list or is this just wishful thinking?
Sure
const addMultiple = select => select.setAttribute('multiple', true);
You can then use a CSS selector to target one or multiple elements
addMultiple(document.querySelector('#custom_ticket_form_field_55'))
document.querySelectorAll('select').forEach(addMultiple)
By the way, id="custom_ticket_form_field_55" is used in multiple places in your HTML, so actually the first variation wouldn't work. If you can, try to make your ids unique.
Note that it also breaks accessibility because your label doesn't point to the select anymore.
I'm trying to use html5 datalist in my program (angularjs) because I want the user to have the possibility to enter an option which is not in the list.
However, what I have noted so far is, when using the html5 Datalist, you loose the possibility of choosing an item in the list by just writing part of the text and pressing tab. What happens is the input element retains just what you typed and not the complete item in the list.
Is there a way to make Datalist+Input to choose the whole item in the list by just typing part of it and pressing tab??
Many thanks for your help and bye ...
Well I just ended up using selectize.js in my project.
This is a jquery plugin that can use an (html) Input to allow the user to select an option from a list, but also permits the user to type a new option (which is not in the list). This is exactly what I wanted.
There is a great post about using the plugin in Medium:
Using Selectize.js to Make Your Forms Better
Many thanks and bye ...
Trying to automate certain tests dealing with Yammer. What I want to do is to use selenium to post something, but when I click on the textbox it changes it's id. Also, everytime the page reloads, or a post is made, that textbox changes it's id.
So what I did next was to use wildcards by telling selenium to look for
//input[starts-with(id, 'yamjs')]
However, I quickly found out that yamjs is used for both the body of the update as well as the "+ Add people to notify" textbox.
The difference between the two seems to be the class. The one that we're interested in has a class="yj-tapf-textarea" whereas the add people to notify textbox has a class="yj-callout-bar-entry-field"
How do I get selenium to find the input field with the id that starts with yamjs within the class yj-tapf-textarea, and not the one in the class yj-callout-bar-entry-field?
Seems like I wasn't paying close enough attention to the classes and their locations. Here's what I ended up with:
driver.findElement(By.className("yj-auto-width-fake-textarea")).click();
driver.findElement(By.className("yj-tapf-textarea")).sendKeys(Text);
driver.findElement(By.id("yj-yam.ui.publisher.old.SubmitButton")).click();
If the id changes then perhaps it is a hint to not use id as the locator.
Using CssSelectors and XPath can give you more stable and reliable locators
I want to create a drop down menu (like an <options> tag) in an HTML form. The issue is that I also want the user to be able to not only select from a list of options, but also type in their own if they want. So it would almost be like there was a text field that was automatically filled when you selected something from the drop down box, but you could still edit it.
This is the sort of thing I mean, only its a desktop app on windows (notice how the text can be edited):
I'm pretty flexible about exactly how it looks. If there is another, easy to implement, solution where the user can easy scroll/see a list of options or add in their own that doesn't look like what I described, I'm open to the idea.
Most of the drop down auto type scripts out there will let you type into the input box text that doesn't have to match one of the options in the options list. Just when you go to submit the form be sure to check to see if there is a selectedValue in the drop down and if not grab the drop down's text instead. How to do this will vary on what script you are using. As to what type ahead drop down script to use there are plenty out there, here is an ancient one that works pretty well but there are lot's of others.
http://trappedinhoth.blogspot.com/2008/07/jquery-autocomplete-example.html
HTML 5 even supports an autocomplete drop down
http://trappedinhoth.blogspot.com/2013/03/html-5-datalist-key-value-work-around.html
I hope that points you in the right direction.
I am looking for a plug-in or way to duplicate the default combo box from visual studio in C#, where you can select from a list or type in a new value. I have found several plugins to "search" or act as an autocomplete for a select element, but I want the user to be able to see all options at any time through the drop down, and add their own through the text bar (or select an option then edit it, to either make a new option or permanently alter the selected option).
Does anyone know such a plugin?
I found this the other day, seems like it would meet your requirements: http://harvesthq.github.com/chosen/
(NOTE: I haven't used it yet so I can't comment on how well it works)