help with Watir for automated testing a webapp - watir

I m using Watir for automated testing a webapp.
In one of the page i have something like htis
</STYLE></HEAD><BODY background="IMAGES/fon06.gif"><DIV class="mainalignment" height="110%" width="110%"><TABLE class="mainframe" height="100%" cellSpacing="0" cellPadding="0" width="100%" border="0"><TBODY><TR><TD><DIV id="divTabButtons"><P align="left"> <INPUT class="tabOff" id="1" onclick="tabOnClick(1)" type="button" value="TIMESHEET" /> </P></DIV></TD></TR></TBODY></TABLE></DIV></BODY></HTML>
But m able to identify the HTML element to access it.
I need to access the id="1" value="TIMESHEET" element.
How do I do it in Watir.
If more info is required pls let me know.
Note: I am a HTML noob.
EDIT: I tried showAllObjects to see whether the objects are displayed or not.
and this is what I got
-----------Objects in page -------------
HTML Document name=header id= src=header.jsp
HTML Document name=body id= src=body.jsp
This is very strange.
but When i look at the page..there are many objects..
I m confused now..

If you want to click the button, any of these will work:
browser.button(:id, "1").click
browser.button(:value, "TIMESHEET").click
browser.button(:id => "1", :value => "TIMESHEET").click
More information at http://wiki.openqa.org/display/WTR/Buttons and http://wiki.openqa.org/display/WTR/Multiple+Attributes

If you want to check first, you can do this:
if browser.button(:id, "1").exists?
browser.button(:id, "1").click

Related

Added images in product attribute in WYSIWYG not showing in frontend

We're working with Magento 2.2.8, we added product attribute using WYSIWYG editor in admin panel. Image is showing perfect with admin url.
<img src="{{media url=" wysiwyg="" u4888.png"}}"="" width="400" height="400">
But, in product detail page, it's not showing image. It seems like media is not rendering.
Please check below code, the media url is not changing to dynamic url as its doing in admin.
<div class="col-md-4 custom-accordion__col">
<img src="{{media url=" wysiwyg="" u4888.png"}}"="" width="400" height="400">
</div>
Your help is highly appreciated.
Thanks,
Saikat
Whenever I add an image using WYSIWYG, the output I usually see looks something like this:
<img src="{{media url="wysiwyg/folder/image.png"}}" alt="" />
In your case, if the image is uploaded using WYSIWYG, the URL should look like this:
<img src="{{media url="wysiwyg/u4888.png"}}" width="400" height="400">
Hope this helps!
I just found the solution. So, in display block section we have to put below codes:
$_helper = $this->helper('Magento\Catalog\Helper\Output');
$_product = $block->getProduct();
<?=$_helper->productAttribute($_product, $product->getData('quality_n_materials'), 'quality_n_materials') ?>
Thanks,
Saikat

Selecting a Value for a DojoComboBox using Selenium Python

I'm trying to build a data scraper with Selenium Python that searches a webpage. The search page contains a dojoComboBox that allows you to select a name from a dropdown list.
Here is the HTML for the dojoComboBox:
<span _="whitespace and CR's between tags adds in FF" class="dojoComboBoxOuter dj_khtml dj_safari dropSel" style="null">
<input style="display:none" tabindex="-1" name="txtCaseName" value="" dojoattachpoint="comboBoxValue">
<input style="display:none" tabindex="-1" name="txtCaseName_selected" value="" dojoattachpoint="comboBoxSelectionValue">
<input type="text" autocomplete="off" class="dojoComboBox dropSel" dojoattachevent="key:_handleKeyEvents; keyUp: onKeyUp; compositionEnd; onResize;" dojoattachpoint="textInputNode" style="null">
<img hspace="0" vspace="0" class="dojoComboBox dropSel" dojoattachpoint="downArrowNode" dojoattachevent="onMouseUp: handleArrowClick; onResize;" src="dojo/src/widget/templates/images/combo_box_arrow.png" style="width: 13px; height: 13px;">
</span>
I can get the DojoComboBox scroll menu to open with the following code:
dropdown = browser.find_element_by_css_selector("img.dojoComboBox")
dropdown.click()
However, I can't seem to find a way to actually select one of the values.
Update:
The HTML I posted above is from the page I pull up when I inspect elements (the HTML under the 'Elements' tab of Chrome DevTools). I've been looking at some other files that I found in the 'Source' tab, and I found some code in a page called main.aspx?e=nauqov2blnhlnh45eseztnao that looks also related to the DojoComboBox:
<select name="txtCaseName" id="txtCaseName" class="dropSel"dojotype="ComboBox"
setSelectedValue="dojo.byId('txtCaseName1').value=arguments[0]"
autocomplete="true" dataurl="CaseCode.aspx?match=%{searchString}&lang=e"
mode="remote" maxlistlength="7">
</select>
However, neither of these seem to encode options that I can select. I thought that perhaps the options would be stored in the url labeled 'dataurl' in the piece of HTML above, but when I copy that link into my address bar, it doesn't take me to a valid webpage. From what I've found in the Dojo documentation, it seems like the options should be stored in a separate file/database, but I can't find any suggestions about how to access that file.
Any suggestions? (Thanks!)
you will have to store every options in a list. Then based on some conditions such as name of option, you can choose it and click on it.
all_options = browser.find_elements_by_css_selector("your locator for every options")
for options in all_options:
if "option_name" in options.text.strip():
options.click()

Lotus Web issue with browser

I have been using display.none, for the hid-whens for example, all the hidden fields were kept in a section and section was hidden from web by using Display.none.
This is working for Internet Explorer till IE 9, but for IE 10 all the hidden fields are shown.
Can anyone help in this matter. Any alternative or approach.
Without seeing the page it sis very difficult to guess.
Try validating the html through one of the many online html validators as something may not be closed or Notes might have given you an unwanted code addition .
Try adding a background color to the css #wrapper to make sure the css is being called.
Take a copy of the form and start removing all other elements one section at a time to see if something else is causing the issue.
Add {meta http-equiv="X-UA-Compatible" content="IE=10;IE=9; IE=8; IE=7; IE=EDGE" /} as the very top meta tag and see if that fixes it. Replace the curly braces obviously.
All the best in finding the issue.
It sounds like just the section element is getting hidden. Without seeing the code I can't tell why that changes between ie 9 and 10 but ie is famous for having varying behavior between versions.
One alternative that comes to mind: You could wrap the section and the fields in a DIV element using pass thru HTML and set that div's style to display:none. That is pretty standard and should work across browsers.
Update: To give you an idea what I'm talking about, check out this jsfiddle.
HTML:
<form>
<div class="wrapper">
<input type="text" name="Field 1" /><br />
<input type="text" name="Field 2" /><br />
<input type="text" name="Field 3" />
</div>
<span>Some text that won't be hidden.</span>
</form>
CSS:
.wrapper {
#display:none;
}
You can remove the # next to the display:none and see the difference, even in IE 10.
You'll need to look closely at the HTML being rendered by Domino and make sure that in fact all the fields you are trying to hide are surrounded by the DIV that is hidden.

SharePoint 2010 WebPart Personalize Layout

I have a homepage on an Intranet. It has at 15+ webparts (news, weather, etc.) I want to allow the users to customize the page by moving the webparts around or deleting them. At present I don't let them see the ribbon at the top so they don't have access to the "Edit page" button. I have pulled it out from the Ribbon
<a unselectable="on" href="javascript:;" onclick="return false;" class="ms-cui-ctl-large" aria-describedby="Ribbon.WebPartPage.Edit.Edit.Menu.Actions.Edit_ToolTip" mscui:controltype="Button" role="button" style="height: auto;" id="Ribbon.WebPartPage.Edit.Edit-SelectedItem">
<span unselectable="on" class="ms-cui-ctl-largeIconContainer">
<span unselectable="on" class=" ms-cui-img-32by32 ms-cui-img-cont-float">
<img unselectable="on" alt="" src="/_layouts/1033/images/formatmap32x32.png" style="top: -160px; left: -96px;">
</span>
</span>
<span unselectable="on" class="ms-cui-ctl-largelabel" style="height: auto;">Edit<span unselectable="on">
</span>Page</span>
</a>
Unfortunately it is not working. Any thoughts?
I will be doing the same with the "Stop Editing" button as well.
According to this post: http://artykul8.com/2011/03/useful-sharepoint-shortcuts/
the trick is to use the MSOLayout_ToggleLayoutMode(); javascript function.
According to a comment in that same page, in SP2010, that javascript function is only available when you already have a web part in the page. The behavior I observed differs from this one, given that, to me, this function only worked when the page was in edit mode already (and it worked even when the page had no web part added).
I was able to find the javascript file where that function is defined, which is the ie55up.js. You can load it in your masterpage by doing:
<SharePoint:ScriptLink language="javascript" name="ie55up.js" OnDemand="false" runat="server" />
For information about how to build a web control that uses that javascript function, see here: http://www.codeproject.com/KB/sharepoint/SwitchWPMode.aspx
Hope this helps
I finally found the answer to this question. It was very simple after the JS call was determined. I believe this should be for a webpart only page.
To put the page in edit mode for Personalization via a Javascript call:
ChangeLayoutMode(true); // how simple is that??
To stop the editing of the page via a Javascript call:
MSOLayout_ToggleLayoutMode(); // same as given in the other post
The "Stop" edit mode I believe is the same for all pages no matter if it's a personalized page, all webparts page, etc.

Read-only text field

I have an read-only text-field in my site. And I need to enter a date using cucumber and watir. But I can't set any value. Even passing the value of date with value = method I can't input any output. There is a JavaScript calendar.
I wrote:
browser.text_field(:name => "deal[start_date]").value = 'test'
it shows the following error:
Watir::Exception::ObjectReadOnlyException: Watir::Exception::ObjectReadOnlyException
from /var/lib/gems/1.8/gems/watir-webdriver-0.1.7/lib/watir-webdriver/elements/element.rb:252:in `assert_writable'
from /var/lib/gems/1.8/gems/watir-webdriver-0.1.7/lib/watir-webdriver/elements/text_field.rb:24:in `value='
from (irb):10
Please help me, I am in a trouble.
This goes along with what xboxer21 noted. I found this code worked for me on a site that had a similar calendar widget.
Lets say you have an HTML form with input text fields that are set to readonly:
<form name="FindRange" method="post" action="FindRange.asp" onsubmit="return false">
...
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" class="FieldLabel">
<input type="text" name="FromDate" size="16" readonly="true" style="width:85px; background-color:#F8F6E7;">
</td>
<td>
<input type="text" name="ToDate" size="16" readonly="true" style="width:85px; background-color:#F8F6E7;">
</td>
</tr>
...
</form>
Using code like '#ie.text(:name, "FromDate").set("3/23/2011")' in your Ruby Watir script would result in an error in Ruby stating the field was read-only. But using the eval() method may allow you to use Javascript to set the read-only fields behind the scenes.
#Code above these lines instantiate the Watir object in #ie and navigate to the page #containing the HTML form
#named 'FindRange'
#ie.document.parentWindow.eval("document.FindRange.FromDate.value = '3/23/2011'")
#ie.document.parentWindow.eval("document.FindRange.ToDate.value = '3/24/2011'")
Well, the text field is read only, as the error message says. That means it can not be changed. How would you change the value of the text field without Watir? Can you provide link to the page or relevant HTML?
This is what I did to enter a date in a read only text field, The JS calendar script used was http://www.dynarch.com/projects/calendar/
There is a small icon next to the date field which displays the calendar widget upon clicking it.
browser.image(:id,"datewidget-trigger").click # Will display the Calendar
browser.send_keys("{ENTER}") # Will select current date
If you want to select a future date or previous date
browser.send_keys("{LEFT}")
browser.send_keys("{RIGHT}")
This has been tested using IE only.
Try executing the JavaScript itself.
browser.document.parentWindow.execScript("Date_JS_script('date')")

Resources