I have in my website the code of Google Plus Badge and Google +1 Button
I need that the link to Google+ page (generate by Badge) open in new Window.
If you have other way, I need:
Link to Google+ Page.
Add function for add to circles.
+1 Button with the count.
All in a line.
My code look as:
<table>
<tr>
<td style="padding-top:2px; vertical-align:top;"><div style="width:180px; height:30px; overflow:hidden;">
<div style="margin-top:-15px; margin-left:0px;" title="International Studies Google Plus">
<style type="text/css">
#___plusone_0, #___plusone_0 iframe{
width:66px !important;
}
</style>
<div class="g-plus" data-href="https://plus.google.com/118182458881247471225?rel=publisher" data-width="170" data-height="69" data-theme="light"></div>
</div>
</div></td>
<td style="padding-top:6px; padding-left:5px;"><g:plusone></g:plusone> </td>
</tr>
</table>
You can't do this.
The badge does not provide any flag that allows you to open the link in a new window. It's also the only feature that provides the 'Add to circles' functionality that you require.
The closest that you can get would be to use a static badge and a +1 button:
<div>
<a href="https://plus.google.com/118182458881247471225?prsrc=3" rel="publisher" style="text-decoration:none;" target="_blank">
<img src="//ssl.gstatic.com/images/icons/gplus-32.png" alt="Google+" style="border:0;width:32px;height:32px;"/></a>
<div class="g-plusone" data-annotation="inline" data-width="300"></div>
</div>
Also, it looks like there's a feature request for this functionality. If you star this feature request, you'll be notified about updates.
Related
I have some HTML with a (facebook Description text for an event) where I need to enter text, however I cannot find where or how I can add the text, which is a div, span or other. I think this is a redactor (but I'm no expert!)
<th class="_3sts">
<!-- react-text: 77 -->Description
<!-- /react-text -->
</th>
<td class="_480u">
<div class="_mh-">
<div class="_56ji _5yk1">
<div tabindex="-2" class="_5yk2">
<div class="_5rp7">
<div class="_1p1t _1p1u">
<div class="_1p1v">Tell people more about the event</div>
</div>
<div class="_5rpb">
<div style="outline: medium none; white-space: pre-wrap; word-wrap: break-word; background-color: transparent;" title="Tell people more about the event" spellcheck="false" role="combobox" class="_5rpu" aria-owns="js_g" aria-haspopup="false"
aria-expanded="false" aria-autocomplete="list" contenteditable="true">
<div data-contents="true">
<div data-offset-key="9c3am-0-0" data-editor="dvke2" data-block="true" class="">
<div class="_1mf _1mj" data-offset-key="9c3am-0-0"><span data-offset-key="9c3am-0-0"><br data-text="true"></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
I have tried these in Selenium IDE:
<tr>
<td>type</td>
<td>//div[#title='Tell people more about the event']</td>
<td>testing</td>
</tr>
and
<tr>
<td>type</td>
<td>//th[text()="Description"]/../td/div/div/div/div/div/div/div/div/div/span/</td>
<td>test</td>
</tr>
and (to apply a redactor solution)
<tr>
<td>runScript</td>
<td>$(._5rpu).html('text');</td>
<td></td>
</tr>
But while I can easily identify the area (one of the many divs) that seem to reflect the space where the text should go I can't manipulate it. Any help appreciated! ;-)
That field is not a trivial case.
First of all it's not an input. That's why "type" command will not work even if you will find element properly.
Secondly the div is in dynamic change when you are entering text that's why you cant use sendKeys for long text because this command is sending symbols one by one to the element that was located once. So after the first successful symbol sending, DOM of the element will be changed and it will become impossible to finish sending other keys.
But you can send one symbol using sendKeys like that:
sendKeys | //div[#class='_5rpu'] | Y
Finally because of unknown reason you can't send symbols with series of sendKeys commands like:
sendKeys | //div[#class='_5rpu'] | Y
sendKeys | //div[#class='_5rpu'] | O
That will throw an exception
[error] Unexpected Exception: Error: Cannot set the selection end.
The only way I've found is to use an ancient and deprecated typeKeys. After typeKeys command you also need a click a whole div which is containing field because orthodox typeKeys is working incorrect with that strange field too.
Also you need to be fully sure that all the animations was showed before you will start. That's why I recommend a small pause before you will try to type to the field.
So here is the final and working code:
pause | 2
typeKeys | //div[#class='_5rpu'] | myDescription
click | //div[#class='_56ji _5yk1']
I have a form written in ASP.NET MVC4/Razor. The form post works perfectly well in Firefox and Chrome, but for some reason in Internet Explorer 10 and 11, the "Submit" button is unresponsive. (Internet Explorer 9 works also good).
This is how my form in the view looks like:
<div class="bla">
<table style="width:100%;">
#using (Html.BeginForm("MyAction","MyController", FormMethod.Post, new {id="myID"}))
{
<thead>
<tr>
<th class="heading highlight">Enter Registration</th>
<th>
<span style="display: block;">
#Html.EditorFor(model => model.Sign)
<input style="margin-left:4px;" type="submit" value="Save" />
</span>
<span style="display: block; font-weight: normal;">#(Model.SignDescription)</span>
</th>
</tr>
</thead>
}
</table>
</div>
And this is my Controller:
[HttpPost]
public ActionResult MyAction(InfoModel infoModel)
{
if(!string.IsNullOrEmpty(infoModel.Sign))
{
//do something
}
infoModel = LoadModel ();
return (indoModel);
}
I really have no idea why this is happening...
THanks in Advance!
EDIT:
My form is inside a table, I forgot to add it..
Your markup is invalid - form element cannot be child of table element. Rearrange your markup so #using (Html.BeginForm( will be inside <th> .
you don't need to Write 'Mycontroller' complete try writing with prefix only in form.
Also ensure that your users haven't disabled JavaScript.
I spent the last 2 days trying to work out why this didn't work on IE8, but was fine on other browsers. I even had to build a windows XP hyper-v installation, just to try and reproduce the issue!
I am very new to selenium. I am trying to automate my EMS/NMS test cases.
Test environment: My webpage is actually an application for NMS operations[it is a private webpage]. Now source of the main page is:
<html>
<head>
<frameset bordercolor="gray" border="3" rows="10%,90%">
<frame scrolling="no" bordercolor="black" src="/cgi-bin/portal.cgi" noborder="" name="start_tab">
<html>
<head>
<body bgcolor="white">
<style type="text/css">
|
<a target="showcase" href="/Portal/sonm/cgi-bin/welcome">Ckt</a>
|
<a target="showcase" href="/cgi-bin/build_instpage">EM Inst</a>
|
<a target="showcase" href="/Portal/BAT/cgi-bin/bat_welcome.pl">System Check</a>
|
<a target="showcase" href="/Portal/SOEM-GUI/cgi-bin/soem_welcome">EM</a>
|
</body>
</html>
</frame>
Now from the above, I am able to click on "EM" which is on the first frame called "start_tab" when I click on this, another page is not opened, instead second frame is refreshed and a login button appears. Now I need to access this login button. However, I am not able to locate this login button. Src code for this is:
<script language="Javascript">
<table>
<tbody>
<tr>
<td width="100%" align="center">
<table>
<tbody>
<tr>
<td width="100%" align="center">
<a href="http://actual button">
<img style="< border="" src="http://login_btn.png">
</a>
</td>
</tr>
</tbody>
</table>
I have tried, xpath for the button, I have tried by tag name, but I think I am not able to go to this new refreshed frame. Also when I fetch source-code I get the source code of previous frame.
Just to add, entire page is divided into two pages:
1) start_tab which has all the links
2) showcase which will be refreshed with content depending on the link clicked.
Also is there any good documentation apart from JavaDocs for webdrvier wherein different web app testing scenarios are discussed.
Thanks in advance!!
You need to switch to frame before locating the button
driver.switchTo().defaultContent(); // you are now outside of current frame
driver.switchTo().frame("start_tab");
// now add code to locate login button
I'm trying to implement a Google Custom Search Engine into my website. So far, I've been able of changing my snippets layout, and show the variables Google shows in its examples:
http://googleajaxsearchapi.blogspot.com.es/2010/04/rendering-custom-data-in-custom-search.html
Well, in the examples, everything looks great, BECAUSE THEY KNOW THE VALUES THEY MAY PRINT. I mean, if you see this snippet:
<div id="mysite_thumbnail">
<div data-if="Vars.thumbnail" class="gs-image-box gs-web-image-box">
<a class="gs-image" data-attr="{href:url, target:target}">
<img class="gs-image" data-attr="{src:thumbnail.src, width:48, height: 48}"/>
</a>
</div>
</div>
it's pretty clear that "Vars" is holding some data GSE is printing. My problem is that I don't know what "Vars" holds, and when developing my view I can't know if the value is there, and what is its name.
So, the question is: How can I print "Vars"? I suppose is a js variable you may obtain from the jsapi, but juss guessing, console.log() was not working for me, :(
Well, I finally found out how to post the data:
From Google Search Engine Api documentation:
https://developers.google.com/custom-search/docs/js/rendering?hl=es&csw=1#richsnip
You only have to add the following code in your snippet:
<span data-body="JSON.stringify(Vars)"></span>
So, you'll have something like:
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
// Load the Search API
google.load('search', '1');
// Set a callback to load the Custom Search Control when you page loads
google.setOnLoadCallback(
function(){
new google.search.CustomSearchControl('XXXXXXXXXXXXXXX').draw('cse');
google.search.Csedr.addOverride("mysite_");
},
true);
console.log(google);
</script>
<div style="display:none">
<div id="mysite_thumbnail">
//This will show all Vars content
<span data-body="JSON.stringify(Vars)"></span>
<div data-if="Vars.thumbnail" class="gs-image-box gs-web-image-box">
<a class="gs-image" data-attr="{href:url, target:target}">
<img class="gs-image" data-attr="{src:thumbnail.src, width:48, height: 48}"/>
</a>
</div>
<div data-ifel="Vars.thumbnail == 0" class="gs-image-box gs-web-image-box">
<a class="gs-image" data-attr="{href:url, target:target}">
<img class="gs-image" data-attr="{src:'XXXXX.png', width:115, height: 90}"/>
</a>
</div>
</div>
<div id="mysite_webResult">
<div class="gs-webResult gs-result"
data-vars="{longUrl:function() {
var i = unescapedUrl.indexOf(visibleUrl);
return i < 1 ? visibleUrl : unescapedUrl.substring(i);}}">
<table>
<tr>
<td valign="top">
<div data-if="Vars.richSnippet" data-attr="0"
data-body="render('thumbnail',richSnippet,{url:unescapedUrl,target:target})"></div>
</td>
<td valign="top">
<div class="gs-title">
<a class="gs-title" data-attr="{href:unescapedUrl,target:target}"
data-body="html(title)"></a>
</div>
<div class="gs-snippet" data-body="html(content)"></div>
</td>
</tr>
</table>
</div>
</div>
</div>
I meet a headache problems, when I use dojo to develop a frontend UI. I have google this problem for a long time. So does the mailist and bugtracker.
When I open a page with TabContainer and swith to a Tab, the DataGrid in the Tab didn't properly displayed.Now I switch to another Tab and switch back again, the grid properly displayed.I implement this in Declarative dojo. Only one line javascript code.
<script>
function imgFormatter(s) {
return '<img src="' + s + '"/>';
}
</script>
situation is like this:
Open the page
http://i.stack.imgur.com/QGeid.png
switch to another Tab and siwtch back again
http://i.stack.imgur.com/OWQxR.png
code:
<div data-dojo-type="dijit.layout.TabContainer" data-dojo-props="region: 'center'">
<div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region: 'center'" title="tab1">
tab1
</div>
<div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region: 'center'" title="Hosts">
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'center'">
<div data-dojo-type="dojo.data.ItemFileReadStore" data-dojo-props="url: dojo.config.api2Path + '/GangliaHostMetric', urlPreventCache:true, clearOnClose:true" data-dojo-id="gangliaHostSummaryStore"></div>
<table data-dojo-type="dojox.grid.DataGrid" data-dojo-props="region: 'center', query : {}, store:gangliaHostSummaryStore" data-dojo-id="gangliaHostSummaryGrid">
<thead>
<tr>
<th field="hostname">hostname</th>
<th field="load_report" width="300" formatter="imgFormatter">Load</th>
<th field="mem_report" width="300" formatter="imgFormatter">Memory</th>
<th field="network_report" width="300" formatter="imgFormatter">Network</th>
<th field="cpu_report" width="300" formatter="imgFormatter">CPU</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
IF the grid si the only thing displayed in the tab, then you don't need all these BorderContainers and ContentPanes, put the grid as directChild of the TabContainer.
Otherwise, it is a famous problem, one way to solve this is to create the grid programmatically after the tab onLoad. Tha means basically connecting to tab onLoad event, and create the grid here.
Another way to fix it is to play around with doLayout, isLayoutContainer, and specify the size of the parent widget also.
With all of this you should find a suitable solution to your problem. If you want more guidance, I'd recommand joining irc freenode #dojo. There you'll maybe find someone to guide you step by step :)