Issue with clicking on a button - ruby

I have a save button on my window whose html is
<div class="popup supportsLink editor">
<h2></h2>
<a class="close icon small" href="#"></a>
<style></style>
<form method="post" enctype="multipart/form-data" action="/AirWatch/Blob/upload-blobs" data-name="blobform">
<div class="editor"></div>
<div class="footer">
<div class="actions" align="center">
<input type="submit" value="Save"></input>
<input type="button" value="Cancel" onclick="closeClosestTray($(this));"></input>
I am not able to click on the save button. when i do an exists? in irb i get a true value. Can someone help me with this.

I am still new to Watir and still am getting my bearings but maybe
browser.form(:value=>'Save').submit
If that doesn't work, is the button in a pop up? if so did you account for this?
so maybe something like this:
browser.window(:title => "annoying popup").use do
browser.button(:id => "close").click
end

What error do you get when you try clicking?
I made a page with your provided html and made script for clicking that and that normal code works for me, and it clicked that button and no error, I used:
browser.button(value: 'Save').click

Related

CodeEffects RuleEditor not rendering in MVC dialog

Currently we have a full page that renders the RuleEditor without issue in the view. I've ran into an issue in getting this to render properly on a dialog.
I'm using the same exact logic to load the objects between the full view and the dialog view.
Here is what the RuleEditor looks like in the full view with an example rule:
RuleEditor Full view
Here is the RuleEditor display (bad rendering) for the same rule
RuleEditor within dialog
The div content within this dialog is:
<div id="ruleModel" name="ruleModel">
<input type="hidden" id="ruleModelData" name="ruleModel">
.
</div>
There are no html/javascript console errors. Any thoughts on why this is happening?
Thanks!
*******UPDATE*****
Here is the .cshtml content for the dialog:
#model RuleViewModel
<link href="#Url.Content("~/Content/Common.css")" rel="stylesheet"
type="text/css" />
#{
ViewBag.Title = "Edit Rule1";
Layout = null;
Html.CodeEffects().Styles()
.SetTheme(ThemeType.Gray)
.Render();
}
#using (Html.BeginSecureForm("Save", "Rule"))
{
#Html.ValidationSummary(true)
<br />
<b>Rule Name:</b> #Html.TextBoxFor(m => m.RuleName, new { id =
"RuleName", #class = "form-control" })
<fieldset>
<div class="main">
<div class="area">
<div style="margin-top:10px;">
#{
Html.CodeEffects().RuleEditor()
.Id("ruleModel")
.ShowToolBar(false)
.Mode(RuleType.Evaluation)
.Rule(ViewBag.Rule)
.DataSources(Model.DataSources)
.ContextMenuRules(Model.Rules)
.Render();
}
#{
Html.CodeEffects().Scripts().Render();
}
</div>
<div class="modal-footer">
<input class="btn btn-default" submit" type="submit"
value="Save" />
<button type="button" class="btn btn-
default">Cancel</button>
</div>
</div>
</div>
</fieldset>
}
UPDATE #2
I took from the AJAX example and did all the RuleEditor settings via the AJAX post/controller methods. That seems to work better, but now the context menu seems disconnected. (See area in Red Circle)RuleEditor In Dialog, Context Menu behind
Most likely your dialog is "disconnected" from the main editor's script and all json settings it receives from the server on load. Another possibility is that your dialog tries to render the editor before those json setting values gets to the client.

jQuery - who is blocking my events?

I'm using the mmenu plugin on a page that's based on jquery-mobile. Mmenu gives me left and right sliders which work fine except for when I try to open a 'mobile-style' popup window. These messages / events aren't getting out.
I have other popup windows on this page so I know that the popup code works but when I try to use the same code inside the <li><a href="#popup" ... ></a></li> framework for mmenu it does nothing.
Chrome script debugger doesn't show any errors. The styles and markup are the same between the working and non-working buttons (when viewed in the debugger).
popup window
<div data-role="popup" id="optionsDialog" data-overlay-theme="a" data-theme="b"
data-dismissible="false" style="max-width:400px;" >
<div data-role="header" data-theme="a">
<h1>Options</h1>
</div>
<div role="main" class="ui-content">
Some options go here?<br>
<a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline
ui-btn-b" data-rel="back">
Cancel
</a>
</div>
</div>
button to open popup
<a href="#optionsDialog" id="options_button" data-role="button"
data-mini="true" data-rel="popup" data-position-to="window"
data-transition="pop">
Show popup
</a>
How do I go about finding my missing events?
FWIW: No idea what mmenu is doing to stifle this event but it was solved by scripting as follows:
$( "#options_button" ).click( function()
{
$( "#optionsDialog" ).popup( "open", {} );
});
...
<li><a href="#" id="options_button" >Options</a></li>
plain old jQuery.

Mechanizing checkbox with checkbox.check not working

I'm trying to mechanize the select devices part of the Apple Dev Portal "Edit iOS Provisioning Profile", which can be found here (if you're logged in).
The source looks like this:
<form name="profileEdit" method="get" action="https://developer.apple.com/services-developerportal/QH43B2/account/ios/profile/regenProvisioningProfile.action?content-type=text/x-url-arguments&accept=application/json&requestId=838c910b-f63d-843e7b1ce126&userLocale=en_US&teamId=BF5K33D" successURL="/account/ios/profile/profileDownload.action?provisioningProfileId=">
<input type="hidden" name="distributionType" value='store'/>
<input type="hidden" name="returnFullObjects" value="false"/>
<div class="nameSection">
<dl>
<dt class="selectDevices">Devices:</dt>
<dd class="selectDevices">
<div class="table">
<div class="rows">
<div><input type="checkbox" name="deviceIds" class="validate" value="8T8RG7HX" id="devices-6" ><span class="title">iPhone 4 - JC</span></div>
<div><input type="checkbox" name="deviceIds" class="validate" value="7Y9F8N47" id="devices-7" ><span class="title">iPhone 5 - DP</span></div>
<div><input type="checkbox" name="deviceIds" class="validate" value="ZNES97W7" id="devices-8" checked><span class="title">iPhone 5 - JC</span></div>
<div><input type="checkbox" name="deviceIds" class="validate" value="CRDSL7S5" id="devices-9" checked><span class="title">iPod 4 inch</span></div>
</div>
</div>
</dd>
<dd class="form-error deviceIds hidden">Please select a Device</dd>
</dl>
</div>
<div class="bottom-buttons">
<a class="button small left cancel"><span>Cancel</span></a>
<a class="button small blue right submit"><span>Generate</span></a>
</div>
</form>
What I want to do is check all boxes:
form = page.form_with(:name => 'profileEdit') or raise UnexpectedContentError
form.checkboxes_with(:name => 'deviceIds').each do |checkbox|
puts checkbox["id"] # prints correct value of devices-6...
checkbox.check
end
form.method = 'GET'
form.submit
I get no run time errors, however when I refresh the actual page, not all checkboxes are checked as I intended. Am I missing something?
For this:
form.checkboxes_with(:name => 'deviceIds').each do |checkbox|
puts checkbox["id"] # prints correct value of devices-6...
checkbox.check
end
What do these result in:
tmp1 = form.checkboxes_with(:name => 'deviceIds').map { |cb| cb.check }
tmp2 = form.checkboxes_with(:name => 'deviceIds').map { |cb| cb.checked? }
I would expect [true, true, true, true] for both. If not, something is clearing those out. The check() method is implemented in RadioButton which does clear the checked state of all buttons of the same name, but it should be limited to radiobutton types. The checked attribute is writable by itself, so you could try directly writing it:
form.checkboxes_with(:name => 'deviceIds').each do |cb|
cb.checked = true
end
And avoid what may be a bug or inconsistency in that page/mechanize/whatever. Just a guess, but something to try.
As for as I have understood, your issue is that you are visiting the actual page after setting checkboxes which will not work. But if you inspect the results returned after submit you will realize that Mechanize has set the check boxes and returned the response.
If you want to visually see that in an actual browser, you may need to use Watir / Webdriver etc.

Easier way to click button in nested divs with Watir?

I'm new to Watir and I'm trying to click the following login button:
<div class="container login" style="display: table;">
<div class="left">
<div class="right">
<div class="joinbox">
<form id="form_login" class="hidden-submit" method="post">
<input type="submit" value="Submit">
<div class="header">
<div class="left">
<div class="mid">
<div class="right">
<a class="button button-red submit" href="#">Log In</a>
...
So far I'm able to access this button by going through every nested div:
b.div(:class, "container login").div(:class, "right").div(:class, "joinbox")......
and so on. Is this really the best way to access this button? I assume I'm missing something. Any help is appreciated!
If there is only one link (that looks like a button) with text Log In on the page, try this:
browser.a(:text => "Log In").click
You could also use class attribute:
browser.a(:class => "button button-red submit").click
May this work?
browser.form(id,form_login).submit
BTW: I have seen some tips said safari only support GET mode for submit.
I would try:
browser.a(:href => "#").click
Assumption - "#" is unique. may need a slash so it doesn't misinterpret the #. I used something similar when I was trying to reference a button with only a href value of "/login" e.g., browser.a(:href => "/login").click.

Form Submit using a Javascript to invoke webflow transition, doesn't take the updated value on form

I am trying to invoke a form submit using javascript (jquery) to invoke a webflow transition. It works and the submit invokes the desired transition. But, the updated radio button values is not reflected on the model object which is posted.
Here is the code:
<form:form method="post" action="#" commandName="infoModel" name="pageForm">
<form:input type="input" path="testMsg" id="success" />
<input type="button" id="clearSelections" value="Clear Selections">
<div class="question">
<h4><c:out value="${infoModel.questionInfo.description}"/> </h4>
<form:radiobuttons path="infoModel.answerId"
itemValue="answerId" itemLabel="answerDescription" items="${infoModel.answers}" delimiter="<br/>" />
</div>
<input type="submit" name="_eventId_saveQualitativeInput" value="Save" id="save" />
$(document).ready(function() {
$('#tabs').tabs();
//Clear selections (copy is server-side)
$('#clearSelections').click(function() {
//$('input[type="radio"]').prop('checked', false);
$('input[type="radio"]').removeAttr('checked');
$('#save').trigger('click');
});
});
</form:form>
The form:radiobutton, generates the below html:
<div class="question">
<h4>Is this a general obligation of the entity representing a full faith and credit pledge? </h4>
<span>
<input type="radio" checked="checked" value="273" name="infoModel.answerId" id="infoModel.answerId1">
<label for="infoModel.answerId1">Yes</label>
</span>
<span><br>
<input type="radio" value="274" name="infoModel.answerId" id="infoModel.answerId2">
<label for="infoModel.answerId2">No</label>
</span>
<br>
<span class="error"></span>
</div>
The input id= "success" value is registered and when the control goes to the server, the value of input id= "success" is updated in the "infoModel" object. But the value of answerId is not updated on the "infoModel" object.
Thoughts if i am missing something in the form:radiobutton element or if there is something else wrong?
Thanks in advance!
EDIT:::::::
Thanks mico! that makes sense. I stripped of some of the code first time to make it precise, but i have a list which is being used for building the radio-buttons, below is the code:
<c:forEach items="${infoModel.list["index"]}" var="qa" varStatus="rowCount">
<div class="question">
<h4><c:out value="${question.questionInfo.description}"/> </h4>
<form:radiobuttons path="list["index"][${rowCount.index}].answerId" itemValue="answerId" itemLabel="answerDescription" items="${question.answers}" delimiter="<br/>" />
<br>
</div>
</c:forEach>
Could you please suggest how i could try this one out?
NOTE: The same code works on a regular form submit on click of a button of type submit. Its the javascript form submit which is not working. I also tried to do whatever i want to do in javascript and then invoke the button.trigger('click'); form got submitted but the changes made on form in my javascript didnt reflect.
With commandName inside a form:form tag you set "Name of the model attribute under which the form object is exposed" (see Spring Documentation). Then in path you should tell the continuation of the path inside the model attribute.
With this said I would only drop the extra word infoModel from path="infoModel.answerId" and have it rewritten as path="answerId" there under the form:radiobutton.

Resources