Do i need to insert external html element into parent element only through tag in parent html because i have created a button in parent html and not able to open the external html thorugh the button click??
As already explained to you in the original question, here: Button not working in multi-page application... this fails because you were attempting to .load the contents of an .html file into a HTML button (you were using the ForNext id). This is not possible. You do not load HTML into a button. The fix was to point to the pagePort id which belongs to a DIV. To a DIV you can load/append/replace HTML...
Related
Let's say we're working with an element in chrome. And it's not clear whether it's inside an iframe or not. You right-click the element > copy > full xpath.
This shows the full xpath but only from the point where the iframe starts. Is there any way to copy the full xpath that includes the parent frame as well?
I'm basically trying to see if there's an easy way to find out whether an element is present inside an iframe instead of visually scrolling through the entire HTML code searching for an "iframe".
I've searched for browser extensions but didn't find anything that can "highlight" the iframes. I've tried highlighting them manually as well by searching for each frame and hovering the mouse on the objects inside it. It's not a good method for finding out whether or not an object is inside an iframe.
Is there a way to get the full path of an HTML element (including the path from the root HTML tag)?
I am using jquery featherlight (https://github.com/noelboss/featherlight) after trying to get jquery lightbox (https://lokeshdhakar.com/projects/lightbox2/) to work. I am using DataTables to generate a list. One of the items in the table is a link to a php page that returns links. The problem is I am calling an external PHP page that generates a list of links. So my link code is like this:
<i class="fas fa-link fa-lg"></i>
The page "lenker.php" does a search and outputs html code. It looks fine in the chrome inspector. But the popup is empty. If I link to another page with the code hardcoded it shows fine. Why does it not show when it is generated on the fly? The html code looks just fine like this:
<div><a class="external" href="http://databank.artsdatabanken.no/FremmedArt2012/N63753" data-featherlight="ajax">fremmedartsvurdering 2012 for edelgran</a></div>
<div><a class="external" href="http://eol.org/pages/1033070" data-featherlight="ajax">edelgran hos Encyclopedia of Life</a></div>
<div><a class="external" href="http://linnaeus.nrm.se/flora/barr/pina/abies/abiealb.html" data-featherlight="ajax">edelgran i Virtuella floran, Sverige</a></div>
but the popup opens and then resizes to almost nothing since there is no content. Featherlight does not need any other initialization since it looks for data-featherlight="ajax".
Is the problem that datatable is dynamic content?
jQuery ajax expects one object so I solved this with enclosing my content in one DIV.
Can't click to Customize link when div+link together with FakeAnchor class using selenium web driver
In my Ajax application, we have dropdown + link (Customize) together in div and i want to click to Customize link. I have locator and which was working fine for Customize link with old selenium but it doesn't with latest web driver. Can anyone please point me the problem or suggest something to make it work?
Expected:
Clicking to Customize link should open respected option (it actually opens dialog).
Actual:
Below locator clicks to dropdown button instead of Customize link due to such a complex page DOM which has no actual href or anchor tag.
Locator:
css=div[id$='_repeatDesc'][class='FakeAnchor']
Html:
<div id="zcs1_repeatDesc" class="FakeAnchor" style="cursor: pointer;">Customize</div>
Code:
webDriver().findElement(By.cssSelector("div[id$='_repeatDesc'][class='FakeAnchor']")).click();
I think your locator is not unique, may be it is locating dropdown element that's why it clicks to dropdown button instead of Customize link.
You should try using By.xpath() with text() node to locate this element as below :-
webDriver().findElement(By.xpath(".//div[text() = 'Customize']")).click();
Or As I'm seeing in HTML element has id attribute, if it's unique I'd to locate desire element and it's not being changed dynamically, you can try also using By.id() as below :-
webDriver().findElement(By.id("zcs1_repeatDesc")).click();
Edited :- If you want to click using JavascriptExecutor try as below :-
((JavascriptExecutor)driver).executeScript("arguments[0].click()", webDriver().findElement(By.xpath(".//div[text() = 'Customize']")));
I'm working in selenium with Firefox browser.
The Html code shown in View Source (CTRL+U) is different from the html code i see when inspecting the elements in Firefox.
When i run the driver.getPageSource() i only get the View source (CTRL + U) codes.
Is there is any way to access the Inspect element code instead of View source code?
I think your question is answered here.
The View Source html is what is sent by the server. I think of it as compile time html, or the initial state of the DOM.
The Inspect Element html could have been updated by ajax responses or javascript so will not necessarily be the same. I think of it as runtime html, or the current state of the DOM.
The GetAttribute() method queries the current DOM element state. You can return a particular html attribute value directly
webElement.GetAttribute("class")
or get the whole html string.
webElement.GetAttribute("innerHTML")
There are some fundamental difference between the markup shown through View Source i.e. using ctrl + U and the markup shown through Inspector i.e. using ctrl + shift + I.
Both the methods are two different browser features which allows users to look at the HTML of the webpage. However, the main difference is the View Source shows the HTML that was delivered from the web server (application server) to the browser. Where as, Inspect element is a Developer Tool e.g. Chrome DevTools to look at the state of the DOM Tree after the browser has applied its error correction and after any Javascript have manipulated the DOM. Some of those activities may include:
HTML error correction by the browser
HTML normalization by the browser
DOM manipulation by Javascript
In short, using View Source you will observe the Javascript but not the HTML. The HTML errors may get corrected in the Inspect Elements tool. As an example:
With in View Source you may observe:
<h1>The title</h2>
Whereas through Inspect Element that would have corrected as:
<h1>The title</h1>
getPageSource() always returns the markup obtained through View Source.
I have set up in Javascript my preferred dijit.Menu which is that far so good.
How am I able to display the dijit.Menu directly after the page starts up in the (with it's position) without any mouse interaction?! I have looked in the API so far and don't find the answers. Will I have to "overwrite" a method?
If yes, which one is it? And what do I have todo???
The widget will not show up until it is parsed by dojo.
You should place fake menu markup inside its dom node:
<div dojoType="dijit.Menu">
<h1>This text is shown after the dom is loaded
and until the menu is parsed and renered</h1>
</div>
As soon as menu is ready, everything you've placed inside menu's dom node will be replaced by actual widget's html.
NON-AMD Version:
dojo.ready(function(){
// The code for all items!
})
DOJO-AMD Version, put the parameters of the modules you like to add, in require as well give them a name in the functions parameters list:
require(["dojo/domReady!"],function(){
//natve code
});