I am not able to make the href attribute work in JSFiddle. Is it a limitation of JSFiddle?
https://jsfiddle.net/ThatBoyCoder/9d0ku9vw/5/
The links should take me to another page on JSFiddle
Current code:
<body bgcolor="blue">
<h2 align=center>Welcome To MathMasters</h2>
<h3 align=center>Developed By ThatBoyCoder</h3></font>
<hr>
<br>
<br>
<br>
<br>
<br>
<br>
<hr>
<a href="http://jsfiddle.net/ThatBoyCoder/zb6jmz53/15/">
<IMG STYLE="position:absolute; TOP:150px; LEFT:160px; WIDTH:50px; HEIGHT:50px" SRC="https://s-media-cache-ak0.pinimg.com/236x/ba/c4/1d/bac41dd0a43f7ddba5321481b101d28e.jpg">
</a>
<a href="http://jsfiddle.net/ThatBoyCoder/zb6jmz53/15/">
<IMG STYLE="position:absolute; TOP:150px; LEFT:310px; WIDTH:50px;HEIGHT:50px" SRC="https://s-media-cache-ak0.pinimg.com/236x/65/75/5e/65755e052fc8c4a8a3d1f1d68c3bf328.jpg">
</a>
<a href="http://jsfiddle.net/ThatBoyCoder/zb6jmz53/15/">
<IMG STYLE="position:absolute; TOP:150px; LEFT:460px; WIDTH:50px; HEIGHT:50px" SRC="https://s-media-cache-ak0.pinimg.com/564x/6c/8d/40/6c8d40d75fe2477080bd02ee134c237d.jpg">
</a>
</body>
Thanks!
You won't be able to visit another link in that same window, but if you add target='_blank' to your href's, they will correctly open in a new tab
Related
i'm trying to automate Salesforce Service Console, but i'm having some troubles because the multiples iframes.
One thing i really need is to click on the option "Close all primary tabs", but everything i have tried is not working.
The weird thing is that although the click is done nothing happens, if i try to do a click on chrome inspector console using javascript the tabs are closed, also if i click manually the tabs are closed, but if is made this trought selenium/katalon although the click is done nothing happens.
I have discovered that the popup html source is not under an iframe but the render of the popup overlays a iframe which comes from the external page tab.
If i trick the webpage modifying the css with the inspector moving the popup more up, were there is not iframe, then the click is closing the tabs.
Also if i delete the iframe from the html, the click is closing the tabs.
So i understand that this could be the problem, but although i have tried switch to iframe still not working.
i'am using katalon to automate but also happens with selenium .
Can you help me?
code of the popup list
<div id="ext-comp-1031"
class="x-menu x-menu-floating x-layer"
style="position: absolute; z-index: 15000; visibility: visible; left: 1086px; top: 124px;">
<a class="x-menu-focus"
href="#"
onclick="return false;"
tabindex="-1"
id="ext-gen173"/>
<ul class="x-menu-list"
id="ext-gen174"
style="height: 158px;">
<li id="x-menu-el-ext-comp-1106"
class="x-menu-list-item">
<a id="ext-comp-1106"
class="x-menu-item tab-scroller-menu-item "
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon hidden"
id="ext-gen526">
<span class="x-menu-item-text"
id="ext-gen527">
<div class="tabTitle">
<span class="tabText">External Page</span>
</div>
<img alt=""
src="/s.gif"
class="refresh-icon"
id="ext-gen538">
<div class="x-menu-item-icon burl-link third-position"
id="ext-gen539"/>
<img alt=""
src="/s.gif"
class="bookmark-icon bookmarkNoPin"
id="ext-gen540"></span>
</a>
</li>
<li id="x-menu-el-ext-comp-1107"
class="x-menu-list-item">
<a id="ext-comp-1107"
class="x-menu-item tab-scroller-menu-item x-tab-tabmenu-selected "
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon hidden"
id="ext-gen528">
<span class="x-menu-item-text"
id="ext-gen529">
<div class="tabTitle">
<span class="tabText">External Page</span>
</div>
<img alt=""
src="/s.gif"
class="refresh-icon"
id="ext-gen541">
<div class="x-menu-item-icon burl-link third-position"
id="ext-gen542"/>
<img alt=""
src="/s.gif"
class="bookmark-icon bookmarkNoPin"
id="ext-gen543"></span>
</a>
</li>
<li id="x-menu-el-ext-comp-1108"
class="x-menu-list-item">
<a id="ext-comp-1108"
class="x-menu-item x-tab-tabmenu-menuItem"
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon "
id="ext-gen530">
<span class="x-menu-item-text"
id="ext-gen531">Close all primary tabs</span>
</a>
</li>
<li id="x-menu-el-ext-comp-1109"
class="x-menu-list-item">
<a id="ext-comp-1109"
class="x-menu-item x-tab-tabmenu-menuItem"
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon "
id="ext-gen532">
<span class="x-menu-item-text"
id="ext-gen533">Refresh all primary tabs</span>
</a>
</li>
<li id="x-menu-el-ext-comp-1110"
class="x-menu-list-item">
<a id="ext-comp-1110"
class="x-menu-item x-tab-tabmenu-menuItem"
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon "
id="ext-gen534">
<span class="x-menu-item-text"
id="ext-gen535">Reopen last-closed tab</span>
</a>
</li>
<li id="x-menu-el-ext-comp-1111"
class="x-menu-list-item">
<a id="ext-comp-1111"
class="x-menu-item x-tab-tabmenu-menuItem"
hidefocus="true"
unselectable="on"
href="#">
<img alt=""
src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
class="x-menu-item-icon "
id="ext-gen536">
<span class="x-menu-item-text"
id="ext-gen537">Show keyboard shortcuts (SHIFT+K)</span>
</a>
</li>
</ul>
</div>
xpath i'am selecting
//*/text()[normalize-space(.)='Close all primary tabs']/parent::*
I'm using vue-slick-carousel to build a slider. I have an issue with image which I wrapped as a link. When I click on image redirect doesn't happen. Also I have a title under image which I wrapped as a link too, and with text it works great, but when I click on image it doesn't. It doesn't work only on mobile devices, on desktop when I click on image it makes redirect.
Here is my code:
<VueSlickCarousel
ref="slick"
v-bind="slickOptions"
class="post-category__slider"
>
<div
v-for="post in posts"
:key="`post-${post.id}`"
class="post-category__list-item"
>
<div class="row">
<div class="col-lg-6">
<div
class="post-category__list-item-image mb-4"
>
<a
:href="`/${item.slug}/${post.slug}`"
>
<img
:src="$store.state.env.panelUrl + post.get_thumbnail"
:alt="post.title"
>
</a>
</div>
</div>
<div class="col-lg-6">
<div class="d-lg-flex flex-lg-wrap flex-lg-column justify-content-lg-between h-100">
<div class="mb-4">
<h4 class="post-card__text-block-title">
<a :href="`/${item.slug}/${post.slug}`">
{{ post.title }}
</a>
</h4>
<div>
{{ post.short_story }}
</div>
</div>
</div>
</div>
</div>
</div>
</VueSlickCarousel>
Try adding pointer-events: none to the images. It should do the trick.
please share your properties for a better picture, also try adding only the property with its object something like this: :href="item.slug/post.slug", but for better reference provide your properties.
I'm trying to click on 'Recommended' input tag of a 'Samsung' label. Please find the appropriate HTML code below.
`
<div class="card-wrapper">
<a class="card-focus has-shadow" href="/app/72292">
<div class="card-container">
<div class="card-logo">
<section class="card-info">
<div class="card-name">Samsung Push Service</div>
<div class="card-publisher hidden-xs">Samsung Push Service</div>
</section>
<div class="card-rating">
</div>
</a>
</div>
<div class="hidden-xs">
<div>
<div class="app-management">
<div class="checkbox ">
<div class="checkbox ">
<label>
<input id="Recommended-72292" class="" aria-disabled="false" value="Recommended" type="checkbox"/>
<span class="cr"/>
<span class="layer-label">Recommended</span>
</label>
</div>
<a href="/mdm">
</div>
</div>
</div>
</div>`
How to achieve this?
Your input seems to be a checkbox, not a button. Try changing its checked value instead of triggering a click:
document.getElementById('Recommended-72292').checked = true;
In selenium, click() method would do your job.
if ( !driver.findElement(By.id("Recommended-72292")).isSelected() )
{
driver.findElement(By.id("Recommended-72292")).click();
}
try following:
driver.findElement(By.cssSelector("div.checkbox input#Recommended-72292")).click();
I have following HTML code snippet:
<div class="pagging-box status-border status-border">
<div class="left-container">
<div>
<div class="clientid-hover">
<h4>AAB52</h4>
<div class="hover-title" style="display: none;">
<p>AAB52</p>
</div>
</div>
<div class="clientid-hover-state pl-info">
<h4>CO</h4>
</div>
<div class="client-name-hover">
<h4>Daniel-old Polar-old</h4>
</div>
<p class="contacting-client">Interview Partially Co..</p>
</div>
</div>
<div class="right-container">
<div class="start-session pull-right">
<a href="javascript:void(0)");" class="login-button">
<i class="fa fa-2x fa-play-circle continue-session"></i>
</a>
</div>
</div>
</div>
I want to locate the Anchor tag on the basis of <h4>AAB52</h4> text. I have tried to locate the same with siblings like following xpath
//div[h4[contains(. , "AAB56")]]/following-sibling::div[1]
(xpath is not correct as it is locating second one div immediate of AAB52 text )
following-sibling operates on the parent of the context node, so you first need walk up to the correct context node:
//h4[. = 'AAB52']/../../../following-sibling::div[1]/div/a
Alternatively you can use:
//div[./div/div/h4 = 'AAB52']/following-sibling::div[1]/div/a
I am trying to find div node with Xpath for selenium. here div having categories/Accounts & Contacts as value of ext:tree-node-id need to be selected, but as ext:tree-node-id is a namespace my below xpath is not working.
//li[#class='x-tree-node']//div[contains(.,ext:tree-node-id='categories\/Accounts & Contacts')]
//li[#class='x-tree-node']//div[#ext:tree-node-id='categories\/Accounts & Contacts']
<li class="x-tree-node">
<div class="x-tree-node-el x-unselectable folder x-tree-node-collapsed" unselectable="on" ext:tree-node-id="categories\/Accounts & Contacts">
<span class="x-tree-node-indent"/>
<img class="x-tree-ec-icon x-tree-elbow-plus" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/>
<img class="x-tree-node-icon" unselectable="on" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/>
<a class="x-tree-node-anchor" tabindex="1" href="" hidefocus="on">
</div>
<ul class="x-tree-node-ct" style="display: none;">
</li>
<li class="x-tree-node">
<div class="x-tree-node-el x-unselectable folder x-tree-node-collapsed" unselectable="on" ext:tree-node-id="categories\/Opportunities">
<span class="x-tree-node-indent"/>
<img class="x-tree-ec-icon x-tree-elbow-plus" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/>
<img class="x-tree-node-icon" unselectable="on" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/>
<a class="x-tree-node-anchor" tabindex="1" href="" hidefocus="on">
</div>
<ul class="x-tree-node-ct" style="display: none;">
</li>
A colon in the attribute will not allow the xpath works. You need to improve a little to it works as you wish, like:
//li[#class='x-tree-node']//div[#*[contains(local-name(), tree-node-id)] = 'categories\\/Accounts & Contacts']
The "local-name" will select the name after the colon named "tree-node-id".