Javascript box not being triggered in selenium - javascript

I'm currently trying to automate part of our web application, mainly a form of #mentioning similar to facebook. In the front end when a user types # into a text input the API calls the list of users and displays them in a box that appears. This element is currently at the end of the DOM and not visible until the javascript triggers when the # is typed.
My selenium code uses send_keys to populate the #namehere but the user window element doesn't appear, even if i do it manually while the browser is opened via selenium
I've tried using the upkey event from Action Chains, injecting javascript to trigger the event, clicking back onto the text input to make sure its focused but nothing works. This happens in both chrome and firefox
Literally searched everywhere, any ideas?
Feature step:
And i create a post titled "#James"
implementation:
#when('i create a post titled "([^"]*)"')
def step_impl(context, text):
page = ActivityStreamPage.NewPost(context)
page.post_input.click()
page.post_input.send_keys(text)
element:
'post_input': (By.CLASS_NAME, "js-post-textarea")
web element:
<div class="js-post-textarea js-edit-content editor__editable"
contenteditable="true" autocomplete="off" autocorrect="off"
autocapitalize="off" placeholder="Write a post or #mention to notify
someone"><span class="atwho-query">#</span><br></div>
user box:
<div class="atwho-view" id="at-view-64" style="display: none; top:
135px; left: 440px;">
<ul class="atwho-view-ul">
<li class="mention__item cur">
<p class="mention__notice">
<span>#Group</span>
"Notify everyone in this Group."
</p>
</li>
</ul>
</div>

after a lot of debugging, seems that the AJAX call was being refused due to permissions. a defect with the application rather than selenium.

Related

Why TWebbrowser IHTMLElement.click fails while mouse click succeeds

I'm trying to auto-fill a web page. Filling input elements and navigating with buttons works fine. Just the final "Save" button fails when programmatically clicking on it, while clicking with the mouse succeeds. The Save button appears to contain some Javascript. In the document it looks like this:
<a title="Enregistrer / Save"
class="btn--icon icon-save ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
id="_save"
onclick="
$('#overlayLoading').dialog('open');
$('#form_model').attr('action', 'https://<some url>');
$('#form_model').submit();"
abp="1909">
<span
class="ui-button-text"
abp="1910">Enregistrer<br
abp="1911">
<span
lang="en"
abp="1912">Save
</span>
</span>
</a>
I tried 3 different approaches:
First approach:
Search for IHTMLelement with id "_save" and do .click()
Navigate() to the URL that is embedded in the element
Executing the JavaScript like this
var
Script: string;
DocPtr: IHTMLDocument2;
WinPtr: IHTMLWindow2;
Script :=
'$(''#overlayLoading'').dialog(''open'');'+
'$(''#form_model'').attr(''action'', ''https://<some url>'');'
'$(''#form_model'').submit();';
if Supports(WB.Document, IHTMLDocument2, DocPtr) and
Supports(DocPtr.parentWindow, IHTMLWindow2, WinPtr) then
WinPtr.execScript(Script, 'javascript');
All 3 methods do seem to work, but the web server returns an error page. When I instead click on the button presented in the TWebBrowser with the mouse, the web server returns success.
What is the physical click doing differently from the programmic click?

Pass or append the value from input text to <a href="sms?:body=">

I'm trying to look for a how I can pass the value from in input textbox *href="sms:?body" It is a dynamic value that changes every time a user creates a new account. The idea is that once I click on the "Send Invite by SMS" the value or referral code that is included in the input text will also be included in the SMS body message.
Sample work in progress
<input class="input" disabled="true" placeholder="Referral Code" ng-model="account.referral_code_string" id="input-refcode">
<a ng-model="account.referral_code_string" href="sms:?body=" class="sms-btn" >Send Invite by SMS</a>
Update
I have managed to bind the input text on the sms anchor but when I try tap on the button the SMS app doesn't open up. It shows unsafe:sms but when I try using only href with a sample text(href="sms:?body=text") it opens up the SMS app
You can use ngHref to append it to your link.
<a ng-href="sms?:body={{account.referral_code_string}}" class="sms-btn">Send Invite by SMS</a>
See: https://docs.angularjs.org/api/ng/directive/ngHref
Working Example: http://plnkr.co/edit/3z145H?p=preview

javascript popup window loads parent url

I've been working on a web page where they want the person to sign up for something. As a result, they have an alert window on the page, the person hits the "sign up" button, and the alert window loads with a form.
No big deal about that. However, on the browser page underneath, and on the form on the second stage of signup, there are links to standard disclaimer pages. They want these to be pop up windows when the user clicks on them.
When I was testing it out, in generic form (no user signed in - the page and disclaimers are declared "public" so you don't need to be logged in to see them), it worked fine.
However, if the user is logged in, when you hit the disclaimer links, it instead loads that same "signup" page - the parent page!
I'll post my coding, but what I'm looking for is twofold - is there an easy way to keep other content from loading in that popup?
If not, I'm guessing that it has something to do with that omnipresent signup popup/alert, and as this other content gets pulled in, there's coding that tells it to load any subsequent popups with that same page. Is there some kind of language I should be looking for? It's all very modular, with a lot of includes, to tracking things down can be tricky. Less so if someone has some suggestions, I'd guess.
<script language="javascript" type="text/javascript">
// Popup window code
var popupWindow = null;
function popitup(url2,winName,w,h,t,l,scroll){
settings =
'height='+h+',width='+w+',top='+t+',left='+l+',scrollbars='+scroll+',resizable'
popupWindow = window.open(url2,winName,settings)
}
</script>`
<p>© <%=Year(now)%> <%=usr_Company%> All Rights Reserved.
<a style="color: #898787;" href="info_privacy1.asp" onclick="popitup(this.href,'disclose','700','780','100','200','yes');return false">Privacy Policy</a> | <a style="color: #898787;" href="info_terms1.asp" onclick="popitup(this.href,'disclose','700','780','100','200','yes');return false">Terms of Service</a> <br /><br />
<%=brand_name%> legal disclaimer blah blah blah blah blah.<br /><br />
</p>
</div>
</div>
</body>
</html>
`
You have to let the JS know that the user is signed in. Few ways to do this - AJAX, but more so simply on page load -IDK what you are using - php or whatever, but what it should do is this:
if user is signed in, print out a globav variable to javascript "userSignedIn = 1"
then when the user clicks a link, js checks if userSignedIn is set to 1, and if it is, it will not display the signup window, but continue to the next one, if userSignedin is not set (or is not 1), the signup form will be displayed...

Access is denied error in IE while file uploading

I am currently working on a new site under .NET MVC platform and I am trying to implement an asynchronous user upload image through iframe. Although I almost complete my task and is fully functional in any other browser fails in IE 9 with the follow error: Microsoft JScript runtime error: Access is denied. It looks like a security concern. Allow me to describe my issue using below code snippets with comments:
1. I have an html form with an input file that its visibility is hidden. Inside the form there are one input element with type="file" and a submit button (also hidden).
<div class="brandLogo">
<p>#identity._RetailerLogo.Caption</p>
<div id="LogoContainer" class="imgLogo">
<img id ="CompanyLogo" src="#DefaultRetailerImage" alt="" title="#Model._ADD_LOGO_IMAGE">
</div>
<p class="txtR">
<a id="UploadLogo" href="#" style="position: absolute; left: -999em; top: -999em;">Upload
</a>
</p>
<form id="UploadForm"
action="#Url.Action("editLogo", "Profile")"
method="POST" enctype="multipart/form-data"
name="UploadForm"
target="UploadTarget"
style="position: absolute; left: -999em; top: -999em;">
<input name="UploadLogoFile" id="UploadLogoFile" type="file" onchange="clickUploadButton();" />
<input type="button" id="SubmitLogoForm" value="Save Image" />
</form>
<iframe id="UploadTarget" onload="UploadImage_Complete();" name="UploadTarget" style="position: absolute;
left: -999em; top: -999em;"></iframe>
The html form tries to post the file to an iframe via javascript. Both form and iframe are on my local project (asp.net mvc) under the same domain ( i run this under localhost).
I am using an on change event on the input element to capture that user selected something and to trigger the submission of the form with ajax call. So when I call via javascript: $("#formID").submit() I get an access denied error.
Any help would be appreciated
I saw this IE bug before,finally I changed my method .triggering change event of input element programmically consider as security risk by IE :( (so stupid IE)
By default IE not let you trigger file element change, if you want you this feature can use ajaxuploader or fileuploader
var uploader = new qq.FileUploader({
// pass the dom node (ex. $(selector)[0] for jQuery users)
element: document.getElementById('file-uploader'),
// path to server-side upload script
action: '/server/upload'
});

Javascript code working in IE but not working in Firefox?

I have this code :
<a href="javascript:document.forms['form1'].student_pic.click()">
<img src="images/mypic.png" alt="" width="161" height="29" border="0" style="margin-top:10px" />
</a>
<input style="display:none" type="file" name="student_pic" id="student_pic" />
This code is working successfully in IE but it's not working in FF.
off course there is form on my page called form1
When the user click the image, select file window will let the user select image and put it in hidden file element.
What is the proplem?
Thanks
Your problem is simply that .click() to open the file chooser dialog does not work on all browsers. I'm not aware of any workaround.
Common way around is have the file input in place but with opacity of 0 which actually means it's hidden, and over it place your custom image or text. Make sure the "browse" button is exactly where your text/image is and it will work - clicking the custom text/image will actually click the browse buttton.
I have such code somewhere so if you won't be able to achieve this I'll search for that code.
Not supported in Gecko yet:
Gecko 2.0 note(Firefox 4)
Starting in Gecko 2.0 , calling the click() method on an <input> element of
type file opens the file picker and lets the user select files.
from https://developer.mozilla.org/en/HTML/Element/input#File_inputs

Categories