Here's the item in question - specifically that little caret:
http://screencast.com/t/NMPOM9Ok58q
As you can see there are multiples of those within the same page, they all have the same class etc.
I've tried several different routes and I've not been able to successfully click on that item.
I always want to click on the last of them present on that page (the number of them are dynamic so sometimes it's the 2nd one and sometimes it's the 6th - so referring to it with a specific number doesn't work)
Thanks for the help (my tests are written in ruby, using selenium and testunit)
Here are some things I've tried and a few variations of these as well (none of which actually produce a click on that item)
#driver.find_element(:class, "dropdown-toggle")[-1].click
#driver.find_element(:css, "(//*[contains,'a.dropdown-toggle')]").click
element_present?(:css, "div.dropdown.open > a.dropdown-toggle").click
#driver.find_element(:css, "div.dropdown.open > a.dropdown-toggle").click
#driver.find_elements(:css, "caret")[-1].click
#driver.find_element(:css, "caret:last-of-type").click
#driver.find_element(:css, "div.dropdown.open > a.dropdown-toggle:last-child").click
#driver.find_element(:class, "span1").find_element(:tag_name, "a").click
^ This one actually is the only one that clicks anything - but it only clicks the first carat.
Ultimately what I'm doing with this test is adding a filter, closing the filter window, re-opening the filter window, deleting the previous filter, adding a new one and closing the window.
how about using the CSS last child selector?
#driver.find_element(:css, "div.dropdown.open > a.dropdown-toggle:last-child").click
If <div class="span1"> is unique, you can try someth like:
#driver.find_element(:class, "span1").find_element(:tag_name, "a").click
ok, so, if you need to click all links, or just someth of it, then:
#links = #driver.find_element(:class, "span1").find_elements(:tag_name, "a")
#links[0].click - for first link
#links[1].click - for second link
etc.
Related
I have an view that extends the current project view, where we add multiple tabs (notebook pages) to show information from other parts of a project.
One of these pages is an overview page that summarizes what is under the other tabs, and I'd like to link the headlines for each section directly to each displayed page. I've currently solved this by using the index of each tab and calling bootstrap's .tab('show') method on the link within the tab:
$(".overview-link").click(function (e) {
e.preventDefault();
var sel = '.nav-tabs a:eq(' + $(this).data('tab-index') + ')';
$(sel).tab('show');
});
This works since I've attached a data-tab-index="<int>" to each header link in my widget code, but it's brittle - if someone adds a tab later, the current indices will be broken. Earlier I relied on the anchor on each tab, but that broke as well (and would probably break if a new notebook page were inserted as well).
Triggering a web client redirect / form link directly works, but I want to show a specific page in the view:
this.do_action({
type: 'ir.actions.act_window',
res_model: 'my.model.name',
res_id: 'my.object.id',
view_mode: 'form',
view_type: 'form',
views: [[false, 'form']],
target: 'current'
});
Is there any way to link / redirect the web client directly to a specific notebook page tab through the do_action method or similar on FormWidget?
If I understood well you want to select the tab from the JavaScript (jQuery) FormWidget taking into account that the id could change if anybody install another module that adds another tab
Solution 0
You can add a class to the page in the xml form view. You can use the id of the element selected by this class name in order to call the right anchor and select the right tab item. This should happen when the page is completely loaded:
<page class="nb_page_to_select">
$('a[href=#' + $('.nb_page_to_select').attr('id') + ']').click()
NOTE: As you have said the following paragrah I assume that you know where to run this instruction. The solution I suggest is independent of the index.
This works since I've attached a data-tab-index="<int>" to each
header link in my widget code, but it's brittle - if someone adds a
tab later, the current indices will be broken. Earlier I relied on the
anchor on each tab, but that broke as well (and would probably break
if a new notebook page were inserted as well).
Solution 1
When the page is loaded you can get the tab list DOM object like this:
var tablist = $('ul[role="tablist"]')
And then you can click on the specifict tab, selecing by the text inside the anchor. So you don't depend on the tab index:
tablist.find('a:contains("Other Information")').click()
I think if you have two tabs with the same text does not make any sense, so this should be sufficient.
Solution 2
Even if you want to be more specific you can add a class to the notebook to make sure you are in the correct notebook
<notebook class="nt_to_change">
Now you can use one of this expressions in order to select the tab list
var tablist = $('div.nt_to_change ul.nav-tabs[role="tablist"]')
// or
var tablist = $('div.nt_to_change ul[role="tablist"]')
Solution 3
If the contains selector doesn't convince you because it should be equal you can do this as well to compare and filter
tablist.find('a').filter(function() {
return $.trim($(this).text()) === "Other Information";
}).click();
Where "Other Information" is the string of the notebook page
I didn't tried the solution I'm giving to you, but if it doesn't work at least may be it makes you come up with some idea.
There's a parameter for XML elements named autofocus (for buttons and fields is default_focus and takes 1 or 0 as value). If you add autofocus="autofocus" to a page in XML, this page will be the displayed one when you open the view.
So, you can try to add this through JavaScript, when the user clicks on the respective link -which honestly, I don't know how to achieve that by now-. But you can add a distinctive context parameter to each link in XML, for example context="{'page_to_display': 'page x'}". When you click on the link, I hope these context keys will arrive to your JS method.
If not, you can also modify the fields_view_get method (here I wrote how to do that: Odoo - Hide button for specific user) to check if you get the context you've added to your links and add the autofocus parameter to the respective page.
As you said:
This works since I've attached a data-tab-index="" to each header
link in my widget code, but it's brittle - if someone adds a tab
later, the current indices will be broken.
I assume that your app allow multi-user interaction in realtime, so you have to integrate somewhere in your code, an update part function.
This function will trig if something has changed and cleanout the data to rebuilt the index in order to avoid that the current indices will be broken.
I'm currently using Cucumber / Selenium / Ruby to create my automation framework and setup my first test. The one I'm working on involves me to fill in a form in order to proceed to the next stage. The form contains a dropdown with multiple values, of which I want to select one (and any one!)
Inspect Element of the Dropdown Menu
<input type="search" class="ember-power-select-trigger-multiple-input" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" id="ember-power-select-trigger-multiple-input-ember3325" aria-controls="ember-power-select-options-ember3325" style="width: 100%;" placeholder="All classes">
I've therefore made use of the class inside my step below:
My Step
#wait.until {#driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input').click}
At the moment, when I run this, it's able to find the correct dropdown option and click it. The options in the list appear, but obviously nothing happens.
What I'd like to know is how I can extend this further so that the dropdown is selected, and that the "first" option is selected? I don't want to specify what it should be, but it just should randomly select the first from the list and use that.
Any thoughts on the easiest way to achieve this?
Research Snippet
I did some research and found the following snippet which I thought I could add to my code, however I'm unsure if it would actually work, or whether I could use this in conjunction with the #wait.until step that I mentioned above?
groupDropdown = #driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input')
option = groupDropdown.find_element(:css, "option:nth-child(1)")
option.click
#wait.until {#driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input').click}
#wait.until {#driver.find_element(:css => '.ember-view > li > .ember-view > li:nth-of-type(1) > .ember-view > li').click}
This worked.
Until
The “until” method within Selenium requires a “truthy” response to continue with the rest of the code.
What you could do is this:
power_select = #driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input')
#wait.until {power_select.displayed?}
power_select.click
This will wait for the element to be displayed on the page, which returns a boolean, and then follow through with a click
Select
Following on from that, the methods for Selects are hidden within the library quite well, but after searching around for a bit:
To Select by text:
Selenium::WebDriver::Support::Select.new(#driver.find_element(:css => <insert_css_of_select_here>)).select_by(:text, <insert_option_text_here>)
To Select by index:
Selenium::Webdriver::Support::Select.new(#driver.find_element(:css => <insert_css_of_select_here>)).select_by(:index, <insert_index_value_here>)
Selecting by index is what you most likely want to do here, setting the index value to 0 to select the first option.
This will let you select required option of ember-power-select with Capybara:
find('.ember-power-select-trigger').click # Open trigger
find_all('ul.ember-power-select-options > li')[1].click # Select 2nd option
Tested with latest ember-power-select.
You might find the click be quite slow if your Capybara.default_max_wait_time is high, so to speed things further you can do this:
find('.ember-power-select-trigger').click # Open trigger
Capybara.using_wait_time(0.1) do
find_all('ul.ember-power-select-options > li')[1].click # Select 2nd option
end
Does anyone know how to set a value to span tag using capybara?
I tried using element.set or element.send_keys, they only selected the targeted element without modifing the previous value.
<div data-offset-key="bbpvo-0-0" class="_1mf _1mj"><span data-offset-key="bbpvo-0-0"><span data-text="true">aa</span></span></div>
HTML snippet is above, I want to set aa to bb.
Capybara is designed to emulate a user - A user can't edit a span unless there's some sort of javascript widget attached to it. If you have a JS widget attached to the span you would need to perform whatever actions a user would do in order to edit the span. So you say the user has to click on the span and then type on the span - if that is so then you could try something like
span = find('span[data-text="true"]')
span.click
span.send_keys("new content", :enter) # if enter is needed to end the editing
which may work - although I'm going to guess the element actually gets replaced with an input or something after it's clicked on, in which case you need to figure out what those elements are (using the browsers inspector) and then find and use send_keys or set on that element instead
To set text in span value,jquery can be used with capybara as shown below:
page.execute_script("$("<span css selector>").text("testing")");
or
page.execute_script("$("<span css selector>").html("testing <b>1 2 3</b>")");
As shown in the following example, I would like to restrict the tab key behavior to just this frame with links.
http://jsfiddle.net/zFXNM/
tabindex ="1"
I do NOT want the tab to go the URL other items in the browser.
For example, the "Compose Mail" in Gmail does this already. I observed 3 usages of "tabindex=-1" within the JS.
In pure JavaScript, I have figured out a solution for this issue. The idea is whenever the page is loaded we determine the first and last links, then we prevent the tab default action and jump to the first link from the last tab.
if (activeElement.id == lastHrefID) {
e.preventDefault();
document.getElementById(firstHrefID).focus();
}
A working solution is available at : https://jsfiddle.net/srirammac/95sv63s7/
I have been Working with Selenium WebDriver for a few months now and I have a problem with a drop down menu within a web app that I am working on.
What is happening is that the test is opening the page, verifying several elements on the page by finding them and then ensuring they are displayed.
After doing that there is some text entered into different fields, then the option select box is clicked on to open the drop down menu.
Following this the test iterates through all the options in the drop down menu until it finds the one it needs, then clicks on that option.
At this point the option is selected but the drop down menu is not closed.
I have tried clicking on the option select again but this has no effect, during the rest of the test other pages are navigated to and the menu does not close.
Then the page is saved and then navigated away from.
However the drop down menu remains until the browser is closed.
This is the code from the app:
<select id="options" name="options" class="options">
<option value="option1 (auto)">option1 (auto)</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
</select>
the first solution I would try is to click on menu options in different ways. Selenium API provides us with this possibility.
1) locate e.g. css selectors of the elements.
String cssOption1 = "select[id='options']>option[value='option1 (auto)']";
String cssOption2 = "select[id='options']>option[value='option2']";
String cssOption3 = "select[id='options']>option[value='option3']";
Also don't forget to verify that you found elements properly e.g .in firepath, firebug addon in ffox:
approach 1
driver.findElement(By.cssSelector(cssOption2)).click();
approach 2 using actions builder API
WebElement mnuOptionElement;
mnuOptionElement = driver.findElement(By.cssSelector(cssOption2));
Actions builder = new Actions(driver);
// Move cursor to the Main Menu Element
builder.moveToElement(mnuOptionElement).click();
more info about Actions builder you can get here
approach 3 using jsExecutor to click on web element. Always works for me in all situations.
JavascriptExecutor js = (JavascriptExecutor) driver;
StringBuilder stringBuilder = new StringBuilder();
stringBuilder.append("var x = $(\'"+cssOption2+"\');");
stringBuilder.append("x.click();");
js.executeScript(stringBuilder.toString());
Hope this works for you
I have solved the problem with a work around, as this is the only way that I have found to work.
Firstly thank you eugene.polschikov for your answer although it didn't solve the problem it did open my eye somewhat, I had no knowledge of action builder, and it has given me some great ideas about future tests.
Also thank you to anyone who read this and pondered over a possible solution.
The workaround that is now in place is that the select is not opened.
The way the code works is that it would open the list and find the one it wanted and click on it, at this point the select wouldn't close, so now the code no longer opens the select in the first place, it clicks on the hidden option to select it, not 100% what i wanted, but it works.
Happy Programming,
Ben.
If a human can press Escape to exit the combobox, you can do that in Selenium by switching to the active element:
from selenium.webdriver.common.keys import Keys
element = driver.switch_to.active_element
element.send_keys(Keys.ESCAPE)