We Keep Coding

Protractor: find a text in a page

I've created this step definition to check if a given text exists in a web page. The code works properly but sometimes, expecially when I look for a long text, I get an error even if the text exists in the page.
The code is this:
this.Then(/^The text "([^"]*)" exists in page$/, function(myText, callback){
browser.sleep(10000);
var selectedElement = element(by.xpath("//*[. = '" + myText + "']"));
expect(selectedElement.isPresent()).to.eventually.equal(true, "This text is not present in page").and.notify(callback);
});
Basically I do three things:
I wait 10 seconds to be sure that all elements of the DOM have been loaded.
I seach for an element(div, p, label or whatever) thet contains the text I'm looking for.
I check if the element is present oterwise I get an error.
Can you tell me if there is a better way to do this? It's correct to use browser.sleep() at the beginning of a step definition to wait for the DOM loading?
IMPORTANT: I'm not using Angularjs
Thank you in advance.

Most likely, the problem is because you are using a strict text match, but there could be extra spaces or newlines around a desired text. You can try with contains() if this is applicable:
element(by.xpath("//*[contains(., '" + myText + "')]"));
Or, with normalize-space():
element(by.xpath("//*[text()[normalize-space() = '" + myText + "']]"));
As a side note, using browser.sleep() to wait for a page to load is not quite reliable and should be avoided. There is a better way - browser.wait() and Expected Conditions.

Inline JS, how to escape a quote in a function parameter?

Is this a bug within JavaScript? http://jsfiddle.net/SommerEngineering/mr8sZ/
<a href='javascript:test("test")'>Works</a><br/>
<a href='javascript:test("test"")'>Does not work</a>
Its looks like JS goes into the string, converts back the " into " and then tries to execute the command, which is then of course wrong.

You are correct. What you're writing there is html, so the html entity &quote; is rendered as a double quote ", then executed as JavaScript. Because test("test""); is not valid javascript, this will throw an error. If you want to pass test" into the function, you would escape the quote like this: test("test\"");
Inline JavaScript is not a good practice and has tons of non-intuitive issues. Read some of these results: Why is inline JS bad?
Here's an example of how to do this properly.
var a = document.getElementById('myElem');
a.addEventListener('click', function() {
test('test"');
});
Just note there are many ways to get element references and you might want to use a class and attach the handler within a loop.

This is not a bug. The double quotes work because the HTML attribute has single quotes. However, the " entity is evaluated by HTML, so the data passed to the JavaScript engine is:
javascript:test("test"")
If you want to escape the quotes use
javascript:test("test\"")
as a \ escapes the quote.

This is not a js bug, indeed it's an html behavior. The " is an html entity that gets decoded to " prior to js execution.
Anyway, avoid to have embedded js in html, it's not a good practice, your case is one reason.

Javascript onclick function call issue: won't pass a string

So the basic rundown is that I'm trying to create a rudimentary means of flagging inappropriate content on our web mapping application.
Within a function that dynamically creates content for the sidebar of the webmap when the user clicks on a point I have this piece of code that should generate an image of a flag.
When the user clicks the flag, I want to run the function flagContent which should pass a url string into the function. From within this function I would then be able to
write it to a database later on (though I haven't made it this far yet).
Here are some code snippets I have been working with.:
1.This is where the flag image is generated
content += "<p class='info'><img id='flag' onclick='flagContent(" + attachmentInfo.url + ")
'src='assets/flag.png' style='height:15px'>Flag as inappropriate...</p>";
This is the connected function
function flagContent(imageUrl){ console.log(imageUrl)}
So basically the url is a string and I'd like to be able to manipulate it within the flagContent function. Unfortunately I can't get it to work. When I pass a numerical parameter such as attachmentInfo.objectID I do not run into the same problem.
For what it's worth I also get this error:
Uncaught SyntaxError: Unexpected token :
Any help would be greatly appreciated. Let me know if there is additional information that could help to solve this. Thanks!

I'm assuming that attachmentInfo.url would return a URL, which should be a string and it just needs to be surrounded by quotes. Since you've already used both types of quotes, you will have to escape some quotes.
content += "<p class='info'>";
content += "<img id='flag' onclick=\"flagContent('" + attachmentInfo.url + "')\" src='file.png'/>";
content += "Flag as inappropriate...";
content += "</p>";
Doing this makes the final out put look like this:
<p class='info'>
<img id="flag" onclick="flagContent('http://example.com')" src='file.png'/>
Flag as inappropriate...
</p>
The problem you had was that the URL was not surrounded by quotes, and it saw flagContent(http://example.com) and didn't know what to do with those bare words not in a string.

show images using javascript and CSS

I have to create a javascript code which calls different images on the click of an image button. I have given names to the images as product1, product2, product3. I am new to JavaScript.
var count;
document.getElementById("divProduct").style.backgroundImage="url('images/product'+count)";
I am trying the above code, but it's not working

If you look at the syntax highlighting, + count is being treated as a string.
You put it outside of the single quotes (kind of), but you still need to put it outside of the double quotes, which are the quotes you're really using to delimit the string:
document.getElementById("divProduct").style.backgroundImage="url('images/product" + count + "')";

You are also missing the image extension. It should be .png or .jpg or something else depending on whatever type your image is.
Also I'd like to know if you are getting any errors on the console.
Edit : For those looking for answers to this question, please also check blender's reply below mine.

Your code should be like Blender said and still if it doesn't work add in you div
sample:
<div id="divProduct"> </div>

I think it must be like;
var count;
document.getElementById("divProduct").style.backgroundImage="url('images/product" + count + ".jpg')";

How to pass a String variable containing value with hyphens as a java script function parameter

Hi I am a newbie to java script. Have issues in passing the string variable whose value contains hyphen as function parameter. Fire bug throws an error saying 'identifier starts immediately after numeric literal'
I am using flexigrid to display data. In each row have placed an image. On click of that image a java script function should be called. Setting up of flexigrid record content is done in java as below,
record.put("view","<img src='images/ic_text_document.png' onclick='view_content("+objid+")'/> ");
Value of the varible objid is something like this c2692d22-a407-4d38-85ee-5c16f25bcce7.
Firebug throws identifier starts immediately after numeric literal' error by pointing at the 14th digit (in the above example at 4).
Tried passing the variable with different combination of quotes as suggested in other posts but dint work. Can somebody help me with this?

You'll need to escape the objid before generating the html, and unescape when using the value in the javascript.
OR do something like this......
record.put("view","<img src='images/ic_text_document.png' onclick='view_content("+ COUNTER + ")'/><div style='display:none' id='objid"+ COUNTER + "'>" + objid + "</div> ");
where counter is just a different number/value for each obj/objid.
and in js:
function view_content(objidcounter){
var real_objid = document.getElementById('objid' + objidcounter).innerText;
...
...
}

You should quote the objid value, like
record.put("view","<img src='images/ic_text_document.png' onclick='view_content(\""+objid+"\")'/> ");

Because when it render it is showing up as
view_content(FOOBARSTRING)
You need quotes in there.
record.put("view","<img src='images/ic_text_document.png' onclick='view_content(\""+objid+"\")'/> ");
Ideally you would not be adding the onclick handlers in the html markup directly.