Develop Reference

How to get iframe src value dynamically in nightwatch test case?

My html dom includes a tag and the value of the src is dynamically generated. Please see below screenshot as an example:
I want to test the dom under the selected iframe tag:
<iframe class="ide-page-frame" ng-src="http://localhost:8080/che/wksp-rn6c?uid=514006" src="http://localhost:8080/che/wksp-rn6c?uid=514006"></iframe>
I use below method to load the frame and put the assert code in the callback function. But it doesn't find any dom. The code is shown as below.
browser
.url('http://localhost:8080/dashboard/#/ide/che/wksp-rn6c')
.frame(".ide-page-frame",()=>{
// it can't find any dom here
})
})
If I load the dynamical url http://localhost:8080/che/wksp-rn6c?uid=514006 directly, it is able to find the dom elements. So I want to know how I can get the url from the iframe src in the test case. Does nightwatch support something like $(.ide-page-frame).getAttribute('src')?

I think that your problem is in browser.iframe(".ide-page-frame")
nightwatch will look for an iFrame having the id="ide-page-frame" which does not exist in your page.
If the frame id is missing or null, the server should switch to the
page's default content.
My proposition: Please change your iFrame creation by changing class="ide-page-frame" by id="ide-page-frame" (or you can just add the id and keep the class)
<iframe id="ide-page-frame" class="ide-page-frame" ng-src="http://localhost:8080/che/wksp-rn6c?uid=514006" src="http://localhost:8080/che/wksp-rn6c?uid=514006"></iframe>
Does this solve your problem?

Javascript code for focusing on a certain div after loading the page

I'm trying to make a page horizontally and my problem is, and it starts from the end(DIVs are defined in right-to-left order, and it shows the one which is on the left)
I need a function to tell the browser to focus on the right div onload,so the user won't get confused.
thank you.
s.rb

By focus I assume you mean you want to scroll to the correct div on load.
if the div was defined like:
<div id="main"></div>
you can scroll to it in javascript with:
window.location.hash = '#main';
I hope this helps

You can do something like this
Set tabIndex to the element which you want to focus.
HTML
<div id = "iWillBFocused">
I will be focused on referesh
</div>
JS
document.getElementById('iWillBFocused').focus()
JSFIDDLE

Vanilla JS
There is a focus function that can be called on an html element:
document.querySelector('#myElement').focus();
You can read more about it on the Mozilla Documentation site.
jQuery
If you're using jQuery, you can also use the built-in jQuery focus() method:
$('#myElement').focus();

Transferring text from iFRAME to a textarea using js or jquery

I'm currently working on a little html/js site and my current goal is to load a .txt file into a page (accomplished this with iFrame src), then transfer the text from the iFrame to a textArea.
The latter I cannot do for some reason. I have tried to get various scripts to help me but none of them seem to work.
Currently lets imagine i have only this in the html:
<iframe name=my_frame id=my_frame src=textfile.txt height=100% width=100% frameborder=0 scrolling=auto marginheight=5 marginwidth=5></iframe>
The java code i am using to validate whether I am getting the inner text of the iFrame is a simple alert:
<script>
alert($('my_frame').*[attribute]*);
</script>
The ''attribute'' part is a dummy in this case. I've used things like HTML, innerHTML, innerTEXT, text, value, body, instead - but none of them work....
Perhaps someone here could assist with a little script to accomplish moving plain text from iFRAME to textArea, or even suggest a better way of approaching this?
I would be extremely grateful for any and all assistance.
Cpt.Mgn.

I think you must change your code:
<script>
alert($('#my_frame').html());
</script>
# Is a selector for id.
html() return all the html inside the element.
I hope this helps :)
EDIT:
<iframe name=my_frame id=my_frame src=textfile.txt height=100% width=100% frameborder=0 scrolling=auto marginheight=5 marginwidth=5>Hello </iframe>
And alert said: Hello
Link to code: http://jsfiddle.net/rEM6H/

if your file is hosted and the textfile is public-ally accessible, then you can try this
$.get("http://yourdomain.com/a.txt", null, function(response){
$("#theTextArea").val(response); // where theTextArea is the ID of the textarea you want to put the data into.
});

Jquery - Replace Specific Line in HTML

I'm having an issue with iframes and IDs.
I currently have an Iframe with no ID attached to as its generated by another websites javascript. So I quickly wrote a Jquery script to give IDs to Iframes on load of page, and it worked successfully. Problem is however, it applies the ID to ALL the Iframes on the page instead of specifically the one I want.
This is what I have.
<script>
$(document).ready(function () {
$("iframe").attr({
id: "iframeid1"
});
});</script>
Is there a method with Jquery to 'search and replace' something specific on the page? For example
Search for:
<iframe allowtransparency="true" frameborder="0" scrolling="no" width="160" height="600"
Replace with:
<iframe id="iframeid1" allowtransparency="true" frameborder="0" scrolling="no" width="160" height="600"
Any help is appreciated! Thanks in advance!

If you know it is the nth iframe on the page:
$("iframe")[n].setAttribute('id', 'iframe1');
EDIT: You could also use attribute selectors:
$("iframe[allowtransparency=true][frameborder=no][etc=etc]").attr({id: 'iframe1'});

It depends on if there is a unique way of finding the iframe you want. For example, is it the only one with width = 160 and height = 600? Or is it always the Xth iframe on the page? Is it always located in the same spot in the page?
Here are some queries as examples for all 3 scenarios:
// if the width/height combination is unique...
var iframe = $('iframe[width=160][height=600]');
// if it is always, say, the 3rd iframe on the page
var iframe = $('iframe:eq(2)'); // 0-based index
// if it is always the only iframe in a div with an id of "iframeContainer"...
var iframe = $('#iframeContainer').find('iframe');
Then you can set the attribute like you said:
iframe.attr('id', 'iframeid1');

if the iframe is wrapped inside a div, with a ID, than you can do:
<script>
$(document).ready(function () {
$("#divID iframe").attr({
id: "iframeid1"
});
});</script>

If you know where your iframe is at you can get it by index position.
If you have 4 iframes on the page and you're looking for the third (with respect to the DOM), you can do this:
$("iframe").get(3).attr({
id: "iframeid1"
});

You can use selectors to find an iframe tag with specific attributes. But you need to be able to uniquely identify the specific iframe you want from attribute values, not HTML search.
As an example:
$('iframe[width="160"][height="600"]').attr("id", "iframeid1");
This would select iframe tags with width=160 and height=600. You can add more attributes if needed to uniquely select your particular iframe.
Perhaps the best option would be to use the DOM structure around the iframe to identify which one you want. You could use parent object identifiers, ordering of the tags, etc.. whatever helps uniquely identify the one you want.

Replace a set of html br elements with another in jQuery -- parsing HTML with jQuery

So here's my problem. I have a little third-party service on my site that generates a bunch of HTML from an RSS feed and sticks it in my webpage when the page is loaded. However, when it generates the HTML, it inserts a bunch of totally unnecessary break tags. Unfortunately, the source file that generates this code is on the third party's server and not mine, so I can't tweak it.
Thus, I'm trying to tweak the HTML right before the page is loaded by using a little jQuery inside the onLoad="" property in the body tag. However, I can't simply use something like $('br').remove(); because then there aren't ANY break tags, and I need one per each spot where there are currently three.
So ultimately, what I need to do is come up with a jQuery statement that replaces
<br><br clear=all><br>
with
<br />
I'm rather new to jQuery, but I couldn't seem to find anything that would help me do this. Any ideas?
Thanks in advance for any help!

Use the Next Adjacent Selector (+):
$("br+br").remove(); //Removes all <br> tags in front of another
jsFiddle demo

Assuming they are in the exact format you gave, you can do this:
var br = $('br[clear="all"]');
br.attr('clear', '');
br.prev('br').remove();
br.next('br').remove();

You can play with selector attributes, not inside the onload but inside the jquery ready (http://api.jquery.com/ready/)
$('br[clear=all]').remove();
more details on selector attribute:http://api.jquery.com/attribute-equals-selector/

Why donn`t just replace the html of the RSS HTML container:
yourContainerElem.innerHTML = yourContainerElem.innerHTML.replace(/<br><br clear=all><br>/gi, '<br />');

To remove all but one:
$('br,[clear!="all"]').remove()
Then to remove the 'clear=all':
$('br').removeAttribute('clear')

You better do this with regexps not with jquery. Simplest example:
string.replace('<br><br clear=all><br>', '<br />')