I have this input of type "Submit" that Watir cannot see. I can identify it by ID, but it doesn't turn up in browser.text_fields, or by any other idenfication method. The ID is dynamically generated so I cannot use it for testing. Any ideas on how to make this readable? I'm willing to change the WATiR source code if necessary.
<INPUT id=t8CPm value=Submit type=submit>
I have obviously tried text_field(:value, 'Submit') and text_field(:type, 'Submit'), and I get an "Unable to locate element" error.
Did you try treating it as a button element? Inputs of type submit are generally considered to be a button because the browser generally renders them that way.
try
browser.button(:value, 'Submit').flash
and see if it works for you
I changed INPUT_TYPES to ["text", "password", "textarea", "submit"] in the TextField class of input_elements.rb and there it was.
I should also probably edit the collections to read the type too.
Edit: I am an idiot and I didn't need to do this, but I'm leaving it here in case anyone else needs to identify a real dynamic-id custom-type text field, not a fake dynamic-id custom-type text field otherwise known in my particular case as a "button".
Related
I am using selenium webdriver to try and emulate file uploads
I have a file input field:
<input class="upload_file_field" id="main_image_file" label="false" name="banner_image_file" type="file" />
Using this in my test results in a ElementNotVisibleError
#driver.find_element(:id, "main_image_file").send_keys "/Users/dan/Desktop/sample.jpg"
I even tried to change the visibility before trying to upload the file:
#driver.execute_script("arguments[0].style.visibility='visible'; arguments[0].style.display='block'; arguments[0].style.height='100px'; arguments[0].style.width='100px'; arguments[0].style.opacity=1; arguments[0].style.zindex=20", #driver.find_element(:id, "main_image_file"))
It still results in an ElementNotVisibleError
Any advice would be much appreciated
UPDATE
Okay, turns out that there are several conditions which can make an element hidden:
Cannot have 0 opacity
Must have length and width > 0
Cannot be hidden visibility
Display can't be none
transform property can move elements off the page which make it not visible
My problem was with the transform property. it was a way of hiding the input field by transforming it off the page completely so I could use a nicer style button using jQuery file-upload.
After that,
#driver.find_element(:id, "main_image_file").send_keys "/Users/dan/Desktop/sample.jpg"
worked perfectly well in emulating user selection of a file
It simply may be the case that the page didn't load because of some error. Could you try to error out with:
raise(#driver.page_source.to_s)
just before the find_element command?
This way you could make sure that the input field is actually on the page, as seen by Selenium.
you use Ruby but anyway if this question is still actual for you then please take a look at the similar question where I offered the answer How to click on <input type=file> across browsers using Selenium Webdriver?
Please see jsfiddle for example, blank out First Name field to have validation tooltip show. In a normal form the validation tooltip positions correctly to the right of each element. But in the popup editor for the grid it still trying to position the tooltip below the element as if it where editing inline. I have tried <span class="k-invalid-msg" data-for="FirstName"></span>but it doesn't change anything. Is there a setting I am missing to get this working in popupeditor? I guess I could manually modify the .k-tooltip but I am hoping for something more built in that handles the positioning correctly, because I am not very good at css.
As you've discovered, the error template for the grid is different to that provided by the kendo validator when applied to standard inputs.
Unfortunately, the validator that is created internally by the grid does not pass along any errorTemplate that you might define in the options object and by the time the "edit" event fires, the validator has already been created and the error template compiled, hence why setting the errorTemplate in the manner you describe does not work. Really, I think the Kendo grid should respect any user defined errorTemplate option but until it does we have to hack a little bit.
The key is to define a custom template and to apply it in the edit event, but instead of using the options object, set the private instance directly. Not ideal, but it works:
edit: function (e) {
e.sender.editable.validatable._errorTemplate =
kendo.template($('#tooltip-template').html());
}
See this updated fiddle for an example of what I think you might be looking to achieve.
http://jsfiddle.net/nukefusion/eQ2j7/10/
(I would post this as a comment but not enough reputation yet...)
I'm successfully using nukefusion's solution. I, too, fought with the syntax error from jQuery for a long time and discovered through debugging that how you define the template is important. In particular, it appears that the template has to be written on a single line without any formatting, as in:
<script id="tooltip-template" type="text/x-kendo-template"><span class="k-widget k-tooltip k-tooltip-validation"><span class="k-icon k-warning"></span>#=message#</span></script>
If you try to make it "pretty" and format the html in the template, you get the syntax error. I don't know where the real bug is, as this sort of thing shouldn't cause an error. But it does and I stopped worrying about it once I got it to work correctly.
What is a generally accepted way to validate preference values in a Firefox extension, specifically when using the prefwindow mechanism in XUL?
I am introducing some new preferences in one of my extensions that I would like to validate before the preferences window is closed. If there's an error, the user should be allowed to correct the issue, and then proceed. I see that the prefwindow element has two potentially useful functions to help in this regard:
onbeforeaccept
ondialogaccept
The former seems to have an associated bug (Bug 474527) that prevents the prefwindow from remaining open when returning false from that function. This is bad in that it doesn't give the user an opportunity to immediately correct their mistake.
The latter appears to have the problem that the preferences get saved prior to exiting, which leaves the preferences in a bad state internally.
In addition, the prefwindow mechanism supports the browser.preferences.instantApply option, in which preference values are written immediately upon updating the associated control. This makes validation extra tricky. Is there a clean way to validate custom preferences in a Firefox extension, allowing the user to correct any potential mistakes?
Normally you would want to validate the preferences when they are changed. That's something that onchange attribute (and the corresponding change event) is good for:
<preference name="preference.name" onchange="validate(this);"/>
The event is fired after the preference value changes. There are two drawbacks:
In case of instantApply the new preference value is already saved, too late to validate and decline.
For text fields the preferences are saved every time a new character is typed. This becomes ugly if you report validation failure while the user is still typing.
You can solve the first issue by intercepting the change events for the actual input fields. For example, for a text field you would do:
<input preference="preference.name"
oninput="if (!validate(this)) event.stopPropagation();"
onchange="if (!validate(this)) { event.stopPropagation(); this.focus(); }"/>
So changes that don't validate correctly don't bubble up to the <prefpane> element and don't get saved. The events to listen to are: input and change for text fields, command for buttons and checkboxes, select for the <colorpicker> element.
The second issue is tricky. You still want to validate the input when it happens, showing the message immediately would be bad UI however. I think that the best solution is to assume for each input field initially that it is still "in progress". You would only set a flag that the value is complete when you first see a blur event on the field. That's when you can show a validation message if necessary (ideally red text showing up in your preference page, not a modal prompt).
So to indicate what the final solution might look like (untested code but I used something like that in the past):
<description id="error" hidden="true">Invalid preference value</description>
<input preference="preference.name"
_errorText="error"
onblur="validate(event);"
oninput="validate(event);"
onchange="validate(event);/>
<script>
function validate(event)
{
// Perform actual validation
var field = event.target;
var valid = isValid(field);
// If this is the blur event then the element is no longer "in progress"
if (event.type == "blur")
{
field._inputDone = true;
if (!valid)
field.focus();
}
// Prevent preferences changing to invalid value
if (!valid)
event.stopPropagation();
// Show or hide error text
var errorText = document.getElementById(field.getAttribute("_errorText"));
errorText.hidden = valid || !field._inputDone;
}
</script>
If you want to validate values as soon as the field is changed so you can handle the instantApply case, you could hook into the change events for the individual fields (e.g. oninput for a textbox). Display an error message and force the focus back to the field if the value is invalid. You can either set it back to a valid value automatically or block the user from closing the dialog until it is fixed.
I am a relatively new user of ruby and have witnessed the following sporadic anomaly with entering text into text fields with pre-populated (or watermarked) text.
I have a login page with Email address and password fields.
The Email address field has some pre-populated text which says 'Enter your email address here'
When the user clicks in the text field, the text disappears ready to accept the actual input.
However, on some runs of my ruby/watir scripts I'm finding that the value I wish to enter (using browser.text_field(:id,'name').set 'mylogin') simply gets concatenated with the pre-populated text (I.e. so I see 'Enter your email address heremylogin') and on other runs it does what I expect and just enters 'mylogin')
So far, I"ve only been trying this on Firefox 9.0/Mac OSX so don't know whether it's a peculiarity of the browser, os, or indeed the site under test. The html of the fields in question look like this:
<input name="ctl00$MainContentPlaceHolder$TextBox_email" type="text" id="ctl00_MainContentPlaceHolder_TextBox_email" style="color:#0B404E;border-color:#A4A4A4;border-width:1px;border-style:Solid;font-family:Arial;font-size:15px;font-weight:bold;width:318px;padding: 4px 10px;" class="watermarked" autocomplete="off">
<input type="hidden" name="ctl00$MainContentPlaceHolder$TextBoxWatermarkExtender_email_ClientState" id="ctl00_MainContentPlaceHolder_TextBoxWatermarkExtender_email_ClientState">
Is there an alternative way of inserting text into this field without triggering this anomaly?
Thanks in advance
D
If it's a "sometimes it does this, sometimes it does that" issue, I'd go with it being a timing problem.
Try running the same code through IRB ( http://wiki.openqa.org/display/WTR/IRB )
e.g. browser.text_field(:id => "emailAddress").set("my.email.address#whatever.com")
If that works, refresh the page and do it again with browser.refresh
If it consistently inputs the correct email address using IRB, it's most probably a timing issue.
Test by adding a small sleep to your script just before putting the email address into the field, e.g.
sleep 10
browser.text_field(:id => "emailAddress").set("my.email.address#whatever.com")
If that works, something's changing on your site between the page loading and between when watir interacts with that field. Find out what, and wait for that to happen.
Potentially with something like browser.wait_until{browser.text_field(:id => "emailAddress").value == "The placeholder text"
There is likely some client side code that clears the field. if you view the HTML you might find it. if I was guessing I'd try 'onfocus'' first
when watir fills in the field a lot of things happen very rapidly and the client side code may not get a chance to clear the prior contents.
what I would do is use irb and the .fire_event method to see if you can fire an event that causes the field to clear e.g.
browser.text_field(:id => "emailAddress").fire_event('onfocus')
if you find one that clears the field, then try putting that line ahead of the line in your script that sets the value
another option would be to try .value= instead of .set
Using watir-webdriver, I am trying to set the value for a text field.
browser.text_field(:id, "phoneNumbers_value_input").set("5555551234")
When I run that command, I can see that watir found the field because the cursor is set on that field however no text is entered. I have also tried the send_keys and append commands but nothing seemed to work. No exception is thrown from these methods.
The only difference I could find between this field and the other fields on the page(which all work fine) is that it has this JQuery mask on it.
$(selector).mask("(999) 999-9999");
Any ideas on how to set the text field?
Edit:
Some more of the Javascript:
selector = '#' + id(field.id) + '_input';
if (field.format == 'phone') {
$(selector).mask("(999) 999-9999");
}
HTML of the field:
<div id="phoneNumbers_value_form_item" class="form_item validated no_focus">
<label for="phoneNumbers_value" class="form_label">phone</label>
<input type="text" value="" name="phoneNumbers[][value]" id="phoneNumbers_value_input" class="text">
<div class="tip"> </div>
<div class="tip_validating">
</div>
<div class="tip_error">
</div>
</div>
I don't see any element in the HTML you provided that would match the text input field being addressed in the ruby code at the top of your posting. e.g. there is nothing there with an ID of 'phone'
Based on the HTML in your question, I would expect the following to work
browser.text_field(:id, "phoneNumbers_value_input").set("5555551234")
Looking at the sample page you linked in the comments, when I use google chrome and the "Inspect Element" function on the input field with the ID of 'phone' I see that there are a number of event listeners associated with the field (blur, focus, input, keydown, keypress, unmask)
The 'focus' one gets my attention in particular, and seeing it there on that field makes me think that you might then need to first fire an event against the same element, such as the onfocus event, in order to activate the field, then try to set the value.
You'll notice that when you manipulate things manually, the field starts out blank, but as soon as it gets focus it displays the format for the input mask to the user, it may well be that this needs to happen first, before it see's any kind of input.
EDIT: In this case, based on feedback from the questioner, the answer turned out to be that they needed to first fire the 'unmask' event against the text field, and THEN .set the value they wanted, in order for things to work correctly when automating the testing. This doesn't exercise the field masking functionality, but then again I doubt the test mandate in this instance is to extensively test a 3rd party (JQuery) addin, and they are more concerned with the business logic etc in the back end, thus simply being able to set the value without the masking code getting in the way is what is needed.
The problem has to do with focusing on the text field. Even with a .click() somehow webdriver ends up with the cursor at the end if the input field (see issue 2377). Pressing the HOME key moves the cursor to the beginning and allows you to type in the input field, and still have the mask functionality.
In Java:
WebElement txtPhone = getDriver().findElement(By.id("phoneNumbers_value_input"));
txtPhone.sendKeys(org.openqa.selenium.Keys.HOME);
txtPhone.sendKeys(phoneNumber);