How to target a input box with selenium when the ID changes? - javascript

Trying to automate certain tests dealing with Yammer. What I want to do is to use selenium to post something, but when I click on the textbox it changes it's id. Also, everytime the page reloads, or a post is made, that textbox changes it's id.
So what I did next was to use wildcards by telling selenium to look for
//input[starts-with(id, 'yamjs')]
However, I quickly found out that yamjs is used for both the body of the update as well as the "+ Add people to notify" textbox.
The difference between the two seems to be the class. The one that we're interested in has a class="yj-tapf-textarea" whereas the add people to notify textbox has a class="yj-callout-bar-entry-field"
How do I get selenium to find the input field with the id that starts with yamjs within the class yj-tapf-textarea, and not the one in the class yj-callout-bar-entry-field?

Seems like I wasn't paying close enough attention to the classes and their locations. Here's what I ended up with:
driver.findElement(By.className("yj-auto-width-fake-textarea")).click();
driver.findElement(By.className("yj-tapf-textarea")).sendKeys(Text);
driver.findElement(By.id("yj-yam.ui.publisher.old.SubmitButton")).click();

If the id changes then perhaps it is a hint to not use id as the locator.
Using CssSelectors and XPath can give you more stable and reliable locators

Related

Using Jquery, how do I change the text from a gridview table?

I'm using ADX Portal and it lets you write jquery or javascript to the backend of the pages as well as some webforms, my problem is changing the value or text from 'Suspended' and set it to 'Active' that is in a gridview table or what its called an Entity List form. The ADX prepopulate value as well as set value on save features also doesn't work so I ended going jquery but for some reason I can't seem to find any id nor class to produce my code. This is the code I found using inspect element on the browser.
<td data-type="Microsoft.Xrm.Sdk.OptionSetValue" data-attribute="statuscode" data-value='{"Value":803750000,"ExtensionData":null}'>Suspended</td>
Any help would be appreciated. Thanks
The strict answer to this question I think is:
$('[data-attribute="statuscode"]:contains("Suspended")').text('Active');
However, you should consider why the value is 'Suspended' in CRM and 'Active' on the portal. It would be better to have the value accurately reflected for your customers rather than having to change it every time it is displayed on a portal page with JavaScript.

How to get text boxes to except text added through JavaScript (Twitch TV chat)

So, I am trying to write a simple command chat bot for Twitch.tv chat, but I cannot seem to be able to get it to actually submit the text I add. Although I can add text and "click" the send button with JavaScript, it will not actually submit it.
For example, I can use http://www.twitch.tv/example to test it. Apparently it is not good practice on Stack Overflow to link to sites, but I do not know what else to do. I cannot recreate the problem in JS Fiddle because I do not know exactly what the problem is.
I can get these elements to seemingly work by using the Chrome console:
//finding the textbox
var textbox = document.getElementsByClassName("chat_text_input mousetrap ember-view ember-text-area")[0];
//then assign some text to it.
textbox.value = "Hello, World.";
This works fine and the text appears.
//to send it I should merely find a way to click the "send" button
var send = document.getElementsByClassName("button primary float-right send-chat-button")[0];
send.click();
Well, this does not really work. It only actually submits the text if I physically either type or use a character (like shift) inside the textbox, or physically click the button myself. So, from what I understand there is some sort of event that is triggered when I physically type and click. Unfortunately, I do not understand how to find/trigger this event through the console. This is what I want to do.
Preferably I would like to do this in pure JavaScript, but I believe it may be simpler in jQuery. If it absolutely has to be jQuery that's OK and I will just have to suck it up and learn.
As a side note, I was able to successfully use this (with the elements changed of course), for YouTube live streaming chat. However, several other websites' chat react similarly to Twitch. These include web skype.
I've spent the last few hours poking around Ember and Javascript to figure this out. I too was running into an issue where I had to either click into the chat area or the send button itself.
I thought I had a lead with a script made for Twitch Plays Pokemon which would send preset messages into the chat. It used Jquery to input the value into the textarea and click on the send button, but that no longer works as Twitch now uses Emberjs 2
I am not too familiar with the Ember framework, but it seems Twitch utilizes a Textarea component(in Ember terms), which associates some framework specific API to the Textarea HTML element.
Since the Twitch webapp is written with Ember, it would seem that using vanilla javascript to set the value of the textbox would not notify the property change to whatever observers are registered internally to Ember
The workaround would then be to change the value property via Ember internal methods. Luckily poking around the views associated on the Textarea DOM element gives access to the set method.
http://www.ember-doc.com/classes/Ember.TextArea.html#method_set
Ember.view.views worked pre-Ember 2 but was deprecated and now requires lookup
App.__container__.lookup('-view-registry:main')[document.querySelector(".chat_text_input").id].set("value","test");
document.querySelector(".chat-interface__submit").click();

website blocks document.getElementById javascript injection

I am looking at this website in particular www.nadex.com
When you log into their platform you can see that the ID of the place order button is "ticket5_orderTicketButton" but when I use that ID to simulate a click it returns that the ID is not on that page. I have tried this with several different IDs and they all do this.
This is the only website I have ever encountered that does this and I am wondering how do they do this, but more importantly how can I still simulate the button click with JavaScript?
Thank you, and I attached a picture below to show what I mean.
ticket5_orderTicketButton

select multiple with JsonWireProtocol

I use own library for functional testing in PHP, it's based on JsonWireProtocol.
I have an select element selected by id and I need to select 2 options from this element. I know how to select singe element - I just find desired option and click on it. But it's impossible with 2 options as second click deselects first one.
How can I achieve this?
As workaround I send a JavaScript line but I'm not happy with this solution.
From the JsonWireProtocol draft version I understand that Selenium interprets modifier-keys such as ctrl and shift as sticky. http://code.google.com/p/selenium/wiki/JsonWireProtocol#/session/:sessionId/keys and code.google.com/p/selenium/wiki/JsonWireProtocol#/session/:sessionId/keys
So I haven't tested this myself, but it seems to me that you can send a ctrl-keypress, follow by two clicks on the options you want to select, and then another ctrl-keypress to "depress" the ctrl-key.

Trying to access javascript elements inside a page

I hope someone can help me. I'm trying to access the text box inside a webpage so I can do some scripting, e.g. placing text in fields, checking a box and clicking submit, to automate my employees' workflow. It's confusing as heck because I cannot find the name/id/whatever that will allow me to manipulate the form. I can see the name of the field I'm trying to get at using Firebug ("history[comment]") and the id, if that helps ("history_comment") but no matter what I do, the form will not be manipulated. Based on the other scripting I've done, this Applescript:
do JavaScript "document.forms[1].history_comment.value='Testing';" in document 1
should do the job, telling the browser to put "Testing" in the appropriate field. I've substituted other names I think might be what it wants, and tried referencing any other forms (forms[2], forms[3]), all for naught. I'm actually confused a bit more because there are no statements in the HTML, so it could be I'm screwing up there.
I've posted an HTML dump of the form at http://images.jlist.com/testform.html (with dummy information of course) in case any kind soul can take a gander and give me some direction. My goal is to be able to put information into the Comment field. Is there a script I can run that will tell me the complete name (as far as the browser is concerned) of every element in the form?
if you can use jquery, then you can do it quite easily using the following command
$("history_comment").val("HELLO");
The JavaScript should be:
document.getElementById("history_comment").value='Testing';
document.forms is non-standard and, as is the case in your example code, fails if the element is not inside a form. This is fairly common in AJAX applications and another good reason to avoid document.forms.
What #Kikuchyo wrote, though it's actually strictly incorrect not to enclose form elements like textarea in a form tag. You'll also need that form tag if (as you suggest) you want to submit the form programmatically. Since you're already accessing that text box, you can get the form from that in your javascript function:
var thetext=document.getElementById('history_comment');
thetext.value='whatever you want to put in there';
thetext.form.submit(); // all form elements have a 'form' property
You can get at the checkbox state as document.getElementById('history_notify').checked; it's a Boolean value, so set it to true or false, and use it in conditionals directly.
Of course, if (as, looking at the form, you likely want to) you want an AJAX submit, you'll need to check out the documentation for whatever wrapper library you're using.
since your element is a text area, it should be done like this:
document.getElementById('history_comment').innerHTML = 'HELLO';
using innerHTML instead of value

Categories

Resources