I am trying to select a value in a dropdown which is inside a iFrame. The frame is nested within a table.
HTML:
<html class ="some text">
<head>...</head> <body id="htmlBody">
<div class= "modalWindow ui-dialog-content ui-widget-content ModalWindow containsFrame" id="ui-id-2">
<iframe src= "/MyApplicantPortal/Applicant/254471/SelectOrderTemplate?t=1">
#document
<html class = "some text"
<head id= "Head1">
<body id="htmlBody">
<form method= "post" action="SelectOrderTemplate?t=1" id="form1">
<div class = "ModalContent">
<Table>
<td class="label1">
<Select id= "MyselList" </td>
My code:
element(:select_frame, :frame, :src => MyApplicantPortal\/Applicant\/\d+\/SelectOrderTemplate\?t=1/)
select_list(:template) {select_frame_element.select_list_element(:id => 'MyselList')}
Error:
Watir::Exception::UnknownFrameException: unable to locate frame using {:src=>/MyApplicantPortal\/Applicant\/\d+\/SelectOrderTemplate\?t=1/, :tag_name=>"frame"}
Watir-webdriver 0.6.5 has changed the way locating frames works.
Before (ie pre-0.6.5), browser.frame located frame and iframe elements.
Now, browser.frame locates frame elements and browser.iframe locates iframe elements.
You will need to change your frame accessor to match the new rules (when you migrated to 0.6.5 or later). The second parameter needs to change from :frame to :iframe:
element(:select_frame, :iframe, :src => /MyApplicantPortal\/Applicant\/\d+\/SelectOrderTemplate\?t=1/)
I am in the process of releasing a new version of the page-object gem that addresses this issue. Should be out in a day or two.
Related
I'm trying to display a message that appears after the user has input some details into input boxes. Once they put in the info in the input boxes, the page should add the info to the multi-line text and then display the entire message on the webpage with the new info included. This code I have only displays the message without the input.
Here, I'm simply having the user put in the text in the box, then I tried to "parse" the input's value by giving it a variable name with a value within the code so it can be added as a property to the "libs" object. I have more to the message, but I can't even get this one sentence to process correctly.
<!DOCTYPE html>
<html>
<head>
<title>Madder Libs</title>
</head>
<body>
<div id="input">
<form>
<p>
<h4>Piece of clothing:</h4><input id="cloth" type="text" value=" " />
</p>
</form>
</div>
<script>
let clothes = document.getElementById('cloth').value;
let libs = {
a: clothes,
/*b: firstBodyPart,
c: secondBodyPart,
d: verbOne,
e: thirdBodyPart,
f: verbTwo,
g: firstNoun,
h: secondNoun,
i: verbThree,*/
};
let showThis = function()
{
let display = function(message)
{
let sayThis = `I wear a ${message.a} on sundays.`;
return sayThis;
}
document.getElementById('madlibs').innerHTML += "<br/>" + display(libs);
}
</script>
<div id="madlibs">
<button type="submit" onclick="showThis()">Show Message</button>
</div>
</body>
</html>
I want my message to be displayed including whatever the user put in the text box
Let's start by addressing why your sentence does not work. It is simply a matter of timing or in other words when things get executed. In your code (which isn't very well structured but onto that later) you execute
let clothes = document.getElementById('cloth').value;
at the very beginning of the script. In this case you are not obtaining some form of reference that would allow you to read the value at later stage but the actual value at the time. Since your input field has value attribute set to empty string, this is all you will ever get no matter how many times you execute the function later.
In order to get value of the input at the time of calling your method you would have to move it into the function itself.
But as I mentioned earlier your code is overall structured poorly so allow me to provide a few suggestions.
button of type submit by default executes submission of the form if placed within the form; you are not taking advantage of that (this has benefits such ability to submit form with "Enter" key e.g.
placing <script> in the middle of your document is poor choice as it blocks rendering of the rest of the document. Best options are to place it either within <head> when used with defer attribute or at the end of the document just before closing </body> tag.
Nesting your function within each other has not benefit here. You can easily define them independently and call one within the other if needed.
heading element <h4> cannot appear within <p> tag
Example
<!DOCTYPE html>
<html>
<head>
<title>Madder Libs</title>
</head>
<body>
<form action="/" onsubmit="return showThis()">
<div>
<label for="cloth">Piece of clothing:</label>
<input id="cloth" type="text" value="" />
</div>
<div id="madlibs"></div>
<div>
<button type="submit">Show Message</button>
</div>
</form>
<script>
// let's get references to our elements, so we don't have to
// do it multiple times
let clothes = document.getElementById('cloth');
let madlibs = document.getElementById('madlibs');
// let's define our functions
function display(message) {
let sayThis = `I wear a ${message.a} on sundays.`;
return sayThis;
}
function showThis() {
const clothesValue = clothes.value;
let libs = {
a: clothesValue,
/*b: firstBodyPart,
c: secondBodyPart,
d: verbOne,
e: thirdBodyPart,
f: verbTwo,
g: firstNoun,
h: secondNoun,
i: verbThree,*/
};
madlibs.innerHTML += "<br/>" + display(libs);
return false;
}
</script>
</body>
I want to only hide the P0 paragraph using childNodes[x] . I wonder how it works because it hides the whole div with in this code:
<html>
<body>
<div id="myDiv">
<p>P0</p>
<p>P1</p>
</div>
<button onclick="hideFn();">hide</button>
<script>
function hideFn()
{
document.childNodes[0].childNodes[1].childNodes[1].style.display = "none";
}
</script>
</body>
</html>
</html>
You easily could have found the reason yourself by simply doing the traversal step by step:
document
the document
.childNodes[0]
the documentElement, also known as the root node (<html>)
.childNodes[1]
the <body>
.childNodes[1]
the <div>
After the app menu html is retrieved, it is displayed as text instead of html. Chrome complains Resource interpreted as Script but transferred with MIME type text/plain. I'm using MVC on the Force.com platform. I've tried specifying the content type of the response as "text/html" and "application/javascript", but neither worked.
[EDIT 1]
Code
<script>
intuit.ipp.anywhere.setup({
menuProxy: "https://c.na55.visual.force.com/"
+ "apex/bluedot",
grantUrl: "https://c.na55.visual.force.com/"
+ "apex/authpage"
});
</script>
<ipp:bluedot>
<div id="intuitPlatformAppMenu">
<a id="intuitPlatformAppMenuLogo" href="javascript:void(0);" title="Intuit App Center">
<span id="intuitPlatformAppMenuDot"> </span>
</a>
<div id="intuitPlatformAppMenuDropdown" style="display: none;">
<div id="intuitPlatformAppMenuDropdownTop"></div>
<div id="intuitPlatformAppMenuDropdownInner">
<<=======
</div>
</div>
</div>
</ipp:bluedot>
When dropdown is open, code is added at arrow location as string and a class 'open' is addedto #intuitPlatformAppMenuLogo.
Image
[EDIT 2]
Server side apex code
public with sharing class GetBlueDotMenu {
public String response {get; set;}
public GetBlueDotMenu() {
QbApiController api = new QbApiController ('GET', 'QB API' , null, null, 'https://appcenter.intuit.com/api/v1/Account/AppMenu');
response = api.execute();
}
}
api.execute() returns the response body and saves it to response which is then rendered on the page.
This issue arises from Visualforce's default rendering of strings as escaped. To fix it, the apex:outputText attribute escaped needs to be "false". See http://bit.ly/13CSXve
PFB link -
https://developer.intuit.com/docs/0025_quickbooksapi/0060_auth_auth/widgets/blue_dot_menu
For IE8, you should add (as mentioned in the above doc)
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ipp="">
You can clear the browser's cache and try it again.
Plz let me know how it goes.
Thanks
Is there any plugin that transfoms html elements (span, div) into a form ? One example is when editing LinkedIn profile which convert the section to be modified into a form.
Thanks all !
JQuery has the Wrap method, which you can use to throw the whole div / span into a form.
$('.inner').wrap('<form class="newform" action="..." method="..." />');
Found here: http://api.jquery.com/wrap/
Consider the following HTML:
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
Using .wrap(), we can insert an HTML structure around the inner elements like so:
$('.inner').wrap('<div class="new" />');
The new element is created on the fly and added to the DOM. The result is a new wrapped around each matched element:
<div class="container">
<div class="new">
<div class="inner">Hello</div>
</div>
<div class="new">
<div class="inner">Goodbye</div>
</div>
</div>
The second version of this method allows us to instead specify a callback function. This callback function will be called once for every matched element; it should return a DOM element, jQuery object, or HTML snippet in which to wrap the corresponding element. For example:
$('.inner').wrap(function() {
return '<div class="' + $(this).text() + '" />';
});
This will cause each to have a class corresponding to the text it wraps:
<div class="container">
<div class="Hello">
<div class="inner">Hello</div>
</div>
<div class="Goodbye">
<div class="inner">Goodbye</div>
</div>
</div>
Examples:
Example: Wrap a new div around all of the paragraphs.
<!DOCTYPE html>
<html>
<head>
<style>
div { border: 2px solid blue; }
p { background:yellow; margin:4px; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<p>Hello</p>
<p>cruel</p>
<p>World</p>
<script>$("p").wrap("<div></div>");</script>
</body>
</html>
Im using a form to give the user the option to show or hide the date on a webpage, either yes or no.
I am using cookies to store the option but i can find or figure out how to display or not display the date on the page.
I have been trying to process the yes or no option using an IF statement that will then be used as a css stylesheet for the webpage.
Maybe im going about it all wrong.
Regards
Trev
EDIT STARTS HERE
My code so far (not working, dont even know if im on the right track)
Code in the css/asp processing style sheet called styleCookieProcess.asp
<%
date= Response.Cookies("usedate")
If(date= "yes") then
Response.Cookies("wantdate") = "date()"
ElseIf(date= "no") then
Response.Cookies("wantdate") = "None"
End If
%>
And this is the code in my Webpage:
<html>
<head>
<link rel="stylesheet" type="text/css" href="styleCookieProcess.asp">
<title>About Us</title>
</head>
<body>
<p>Current Date <%
Response.Write(Response.Cookies("wantdate"))
%></p>
<P ALIGN = "CENTER">
<IMG SRC = "Images\About_Us.png" HEIGHT = "250" WIDTH = "715">
</P>
<TABLE ALIGN = "CENTER">
<tr>
<th>
<DIV ALIGN = "CENTER">
<P>
We have been around the block and back and have the t-shirt to prove it!
The Glad Rag Team
</P>
</DIV>
</th>
</tr>
</TABLE>
</body>
</html>
Regards, Bubs
try this
<%
date= Response.Cookies("usedate")
If(date= "yes") then
Response.Cookies("wantdate") = "date()"
Else
Response.Cookies("wantdate") = "None"
End If
%>