How to fill timepicker field with capybara - xpath

I am new to capybara and I have some problems with text field, Capybara can not find the field.
I need to create automatic tests and one of them has to fill in fields that changes all the time(id and name changes, they are like this: id="patternDailyStart_146d7547140" and this number is always different).
Html part looks like this:
<div class="timepicker">
<input value="" id="patternDailyStart_146d7547140"
name="patternDailyStart_146d7547140"
class="timepicker-input patternDailyStart hasDatepicker"
type="text">
<img class="ui-datepicker-trigger"
src="/mpromoter/assets/4716a6a0a357181/app/components/timefield/clock.png"
alt="..."
title="...">
</div>
This is time picking field. And The problem is that capybara can not find the field.. however I try to find it for filling.
When I try to find this xpath, then it is found, but when I want to fill it in with time($starttime=17:00) then it says that element not found or it does not exist.
These xpaths are found:
page.has_xpath?('//tbody/tr/div/input[contains(., "patternDailyStart")]')
page.has_xpath?(:xpath, "//*[#class='timepicker-input patternDailyStart hasDatepicker']")
I tried to fill in like this:
And(/^fill up the fields$/) do
field = find("//*[#class='timepicker-input patternDailyStart hasDatepicker'")
field.set $starttime
end
And like this:
fill_in('timepicker-input.patternDailyStart.hasDatepicker', :with => $starttime)
And like this:
within(:xpath,'//tbody/tr/div/input[contains(., "patternDailyStart")]'){ fill_in("#patternDailyStart", with: $starttime)}
And many other ways but still nothing fills in those fields..
So I am asking for some help. What I have to do, any suggestions?
Thank you... :)

I think the easiest would be to locate the inputs by its 'patternDailyStart' class:
find(:css, '.patternDailyStart').set($starttime)

Related

Filling in text box with capybara

I have a text box that I'm trying to fill in with Capybara. I've tried to play around with it and try to figure something's out but my tests don't pass.
Here's
It's for this specific text box:
<span class="ui-grid-header-cell-label ng-binding" ui-grid-one-bind-id-grid="col.uid + '-header-text'" id="14213131-uiGrid-0008-header-text">DOB</span>
<input type="text" class="ui-grid-filter-input ui-grid-filter-input-0 ng-touched" ng-model="colFilter.term" ng-attr-placeholder="{{colFilter.placeholder || ''}}" aria-label="Filter for column" placeholder="" aria-invalid="false" style="">
Here's the code I have.
find('ui-grid-filter-input ui-grid-filter-input-0 ng-touched').set('1414234')
Ideally I'm trying to find this specific text box and type something in.
To fill the <input> using Capybara you can use either of the following locator strategies:
find('[aria-label=Filter for column]').set('1414234')
or
find('input[aria-label=Filter for column]').set('1414234')
As a CSS selector 'ui-grid-filter-input ui-grid-filter-input-0 ng-touched' is looking for a ng-touched element which is a descendant of a ui-grid-filter-input-0 element which is a descendant of a ui-grid-filter-input element - which obviously isn't what you want. Since you're trying to match on classes you need to use the CSS class selector which starts with .
find('.ui-grid-filter-input.ui-grid-filter-input-0.ng-touched')
would be the correct way to do what you were doing, however you probably don't really need all those classes, and the more you specify the more brittle you are making your selectors. It's likely that just
find('.ui-grid-filter-input-0').set('1414234')
would do what you want - or better
find('.ui-grid-filter-input-0').fill_in(with: '1414234')

Capybara: How to fill a textarea without an 'id'?

I am in need to fill_in a textarea which does not have an id. Following the inspection:
<textarea class="stock-description-input js-short-description-textarea" placeholder="Select a product or enter a description" maxlength="64"></textarea>
Have you got an idea how to do it?
There are different location techniques and ways to get to the desired element. stock-description-input class looks like a good thing to rely on. Use send_keys() to fill the area:
text_area = first(:css, 'textarea.stock-description-input').native
text_area.send_keys('Test')

capybara ruby code to check an element is present or not

using capybara how can i check an element is present or not.
i used following code but it is not working
page.should_not have_selector('#confirmation_code')
<div style="width:250px;display:block;float:right;text-align:right;">
<span id="email_text">Order Number:<br></span>
<input id="confirmation_code" type="text">
</div>
i want to check above text box element is present or not?
So going from the last comment from Sush,
The first line in the code in the question is not correct at all. That will verify that the element is not shown.
You could use the following instead:
page.should have_css('#confirmation-code')
or if you wanted the text within do this:
page.find('#confirmation-code[type="text"]')
I will be honest though I am going by what I think the question is, it is not very clear what you are looking to achieve.

A way around Element cannot be scrolled into view - Watir-webdriver with Ruby

So, we have the following code in our page:
<div class="toggle-wrapper">
<input id="HasRegistration_true" class="registration_required toggle" type="radio" value="True" name="HasRegistration" data-val-required="The HasRegistration field is required." data-val="true">
<label for="HasRegistration_true" class="">On</label>
<input id="HasRegistration_false" class="registration_required toggle" type="radio" value="False" name="HasRegistration" checked="checked">
<label class="checked" for="HasRegistration_false">Off</label>
</div>
These are 2 radio buttons. 'On' and 'Off'. 'Off' is the default value.
Using Watir-webdriver and Ruby, we want to select the 'On' radio button. We do so like this:
browser.radio(:id => "HasRegistration_true").set
But in doing so, we get the following error:
`WebElement.clickElement': Element cannot be scrolled into view:[object HTMLInputElement] (Selenium::WebDriver::Error::MoveTargetOutOfBoundsError)
We know Selenium 2 scrolls the page to the element, so trying to scroll down is useless.
We are always using the latest releases of watir-webdriver and ruby.
We can't change the HTML of the page since we're QA engineers.
Here are two solutions that have worked for me:
There is a Ruby gem called watir-scroll that can work.
Then
require 'watir-scroll'
browser.scroll.to browser.radio(:id, "HasRegistration_true")
If you don't want to add a gem, my co-worker suggested something that somewhat surprisingly (to me) had the same effect as the above code:
browser.radio(:id, "HasRegistration_true").focus
browser.radio(:id, "HasRegistration_true").set
In my code, ".focus" scrolled straight to the element that was previously not visible. It may work for you as well.
First of all try locating the element using XPATH:
browser.element(:xpath, "//input[#id='HasRegistration_true']").click
or
alternatively if it is a hidden element you are trying to locate then you are better off using CSS. Download firebug add-on for firefox and copy the CSS path of your element.
It should be something like:
browser.element(:css => "the CSS path you have copied from Firebug").click
One of the 2 should do it for you!!
Best of luck!
You could manipulate the html on the fly by executing some javascript to make the radio element settable. To execute javascript on a page, do something like:
#browser.execute_script("your javascript here")
I used something like the following javascript to strip the class out of a label tag which moved it out of the way of the input tag I was attempting to act on for a Chrome specific problem I had.
execute_script("$(\"label.classname\").removeClass(\"classname inline\")")
If the element is contained within a form and a div (Wrap) class I found that I had to do the following to click the 'No' radio button on the "https://quote.comparethemarket.com/Motor/Motor/AboutYourVehicle.aspx?" page:
div_list = #browser.form(:action => "AboutYourVehicle.aspx?ton_t=CTMMO&prdcls=PC&rqstyp=newmotorquote&AFFCLIE=CM01").div(:class => "inputWrap").divs(:class => "custom-radio")
And then:
div_list[1].click
Hope this solves your issue too :-)
I'm not using watir but I have the same error as you "...could not be scrolled into view ...". I tried to use watir just to solve it and didn't work for me. Then, I use an ActionBuilder (move_to with click) and the error disappeared.
My line to avoid the error is:
#driver.action.move_to(*webelement*).click.perform
I hope it will be useful for you

How can I use Spring MVC "form" tag instead of my "input" tags?

What I have:
I have a generic JSP page that is used throughout my application for displaying certain entities. The code that I am interested in goes like this:
<form:form modelAttribute="object"/>
<core:forEach items="${sections}" var="section" varStatus="itemStat">
<core:forEach items="${section.fields}" var="fieldDef">
<form:input path="${fieldDef.fieldName}"/>
</core:forEach>
</core:forEach>
<form:form>
For each section, and for each field in that section, I have an input having the path fieldName, which is what I want to display from each field.
What I want:
I would like instead of the input to be a simple text, like a label.
What I have tried:
I am most certain that I can do it somehow with <form:label> but I can't really make it work. Making a <form:label path="${fieldDef.fieldName}" /> just tells the browser for which field I need the label, but doesn't get the actual value from it.
I have also tried something like ${object.fieldDef.fieldName}, but in order for this to work I would have to first analyze the value of ${fieldDef.fieldName}, which would give me the name of the column, and then do a ${object.column}, but column being a variable I haven't been able to make this work in any way.
Alternative:
An alternative would be to just make the inputs as disabled and remove the border with CSS, but that would be a dirty way and from what I saw it is also tricky for IE different versions. I am sure that I can handle it directly.
I am a little intrigued by the fact that <form:input path="..."> puts into the input what it finds corresponding to that path (same goes for other form elements), but with label it works different.
So, what I want is basically simple, but I haven't managed to find a way. If someone could shed some light, that would be great. Thanks in advance !
You could look into the spring bind tag. I haven't tried using it before but this may work for you, in place of the input tag
<spring:bind path="fieldDef.fieldName">
${status.value}
</spring:bind>
reference: http://static.springsource.org/spring/docs/1.1.5/taglib/tag/BindTag.html
Instead of
<form:input path="${fieldDef.fieldName}"/>
use
<c:out value="${fieldDef.fieldName}"/>
It would display whatever value is there instead of creating a input field. Hope this helps you. Cheers.
Using the spring form tab, one option would be to use
<form:input disabled="true" path="${fieldDef.fieldName}"/>
To further make it not look like an input you could use CSS to style it to your preference.
Some css styles you could use:
background-color:#EEEEEE;border: 0px solid;
Update:
You could look into the spring bind tag. I haven't tried using it before but this may work for you, in place of the input tag
<spring:bind path="fieldDef.fieldName">
${status.value}
</spring:bind>

Resources