It's there any way to set a page loading time?
I wan't to make a loading animation for may web page (This one: How can I create a "Please Wait, Loading..." animation using jQuery?), and i can't see if it works because the page is loading too fast,all most instantly.
Related
The page I am testing, it's loading forever due to the slow network(or Internet censorship, some of the resources are bound to fail loading). However most of elements of the page are present within 1 second.
Since Selenium won't have an element clicked until the page's fully loaded, I want to use pageLoadTimeout() to stop the page from loading after 5 seconds and then handle the timeout and do something on the page. And the code works for the page which I specified in get(url).
try {
driver.manage().timeouts().pageLoadTimeout(5, TimeUnit.SECONDS);
driver.get(url);
}
catch (TimeoutException e){
}
finally {
driver.findElement(By.xpath("xpath here")).click();
}
However this won't work if you're trying to click a link and then be navigated to a new page. You're will soon get
org.openqa.selenium.TimeoutException
because the code above didn't handle this new page's timeout exception. Then I'll have to add another try-catch-finally to prevent this new page from infinitely loading. This will get trickier if there're a lot of links you have to go thru before you are actually reaching the page you wanna test.
Does anyone has a solution to this?
Once pageLoadTimeout is added in the script, the WebDriver instance waits for 5 seconds for every page to get loaded before throwing an exception. If the page is not loaded in 5 seconds of time, then it throws TimeOutException at run time.
You should try increasing the timeout.
Your approach - stopping page loading after 5 seconds - probably will not work.
WebDriver intentionally waits for a full page load. Many ajaxifed webpages havily use onload event to fire some javascript code just after a whole page has been loaded. This javascript code usually does some actions that prepares the page for use.
If you do not wait for a full page load and you start clicking or typing some data on this page, it's very likely that your test will not work - some fields could not be yet editable, clicking on buttons or links may not work etc.
WebDriver tries to prevent such errors, and most of it's methods like clicking and writing data are waiting for the full page to load by default.
I'm using .changePage
$.mobile.changePage($nextPage.attr('href'), { transition: 'slide', showLoadMsg: false });
Which is working ok. The page changes and slides in. The only problem is that on the new page there is an image at the top of the page that is not shown during the animation and then "pops" in after the animation.
I thought that changePage would get the page via ajax and load the result into the dom and when thats done do the animation?
It seems like changePage is getting the page and inserting it into the dom but NOT waiting tell that "page" is done loading before doing the animation.
Any one have any thoughts as to how to wait tell the new page and its various assets (an image in this case) is done loading before animating?
In the end the only way I was able to solve this was by pre-loading the page using $.mobile.loadpage
is it possible to delay loading of some controls on an xpage?
This is the problem: let's say you have a control that does a fultextsearch and displays the result in a repeat control. this ft search might take a long time and will hold the webpage loading in a waiting state until the search result is ready.
I want my page to load most of the data initally, and some "time consuming" controls should be loaded in to the page as a sperate request after the inital load.
this way the user will immediatly see the webpage, but some of the data on the page will load a little bit later without holding the webpage in a waiting state from the server.
possible?
The downside to using rendered is that all the value bindings will still evaluate, even if the corresponding markup isn't sent to the page. So the trick here is making sure the components don't even exist until you want them to.
Every component has a getChildren() method. This returns a mutable List of components, which has a add() method. This allows you to add components to the page on the fly, either while the page is loading, or later during an event. For the purposes of what you're trying to do, you would want to defer adding the "expensive" components until a subsequent event.
Create an event handler attached directly to the view root (), give it a unique ID (e.g. "loadExpensiveComponentsEvent", set its refresh mode to partial, set a refresh ID to whatever div or panel will contain the search results, and set its event name to an arbitrary event (e.g. "loadExpensiveComponents"). This prevents your event from being triggered by actual user behavior. Set the event's code to SSJS that will inject your components.
Then add a script block () to trigger the event after the page has loaded:
XSP.addOnLoad(function(){
XSP.firePartial(null, "#{id:loadExpensiveComponentsEvent}");
});
Your page will load without the search result components. Once the page has fully loaded, it will trigger the component injection event automatically.
For guidance on how to code the injection event, open the Java file that has been generated from your existing page to see what components need to be injected and what to set their values to.
You can pack them into a panel and set their rendered status to rendered=#{viewScope.pageFullyLoaded}. Then in the onLoad event have a XSP. partialRefresh request where you set viewScope.pageFullyLoaded=true
A little ugly but doable. Now you can wrap that code into your own custom control, so you could have a "lazyGrid", "lazyPanel" etc.
Not sure why I did not think of this before. the dynamic content control in extlib actually solves this problem. the dcc can be triggered onClientLoad both using javascript and ssjs afer the page has loaded.
one problem I am facing now is that I am already using the dcc on my site so I need to put another dcc within my dcc. and this seem to be a bit buggy. I have reported it to the extlib team on openNTF.
If I call a resource in a webpage (e.g. a pixel from tracker.com at the beginning of body), and tracker.com is very slow to answer (e.g. >10s or even timeout), what are the consequences to my webpage load?
Will the other resources (script, images, css, etc) be displayed as usual?
If not, is asynchronous tag an option?
Loading resources, as you call it, will not delay the domready or document ready page event, however it will delay the load page event. The actual behaviour of page loading depends on browser - the browser should download the resources from different hosts in paralel. It will not affect the whole page rendering, unless you use images with unspecified width and height - in that case browser must re-render the page after receiving the image.
So when well designed, the only problem would be the delayed load event.
In case of very slow-loading resources you can avoid that by the use the "asynchrounous tag" - just handle the domready event and place new tags. E.g. in jquery use:
$(function () {
// this code will be run after dom ready event
});
Good day,
I was wondering if there is a way to make Ajax move on to the next code segment only when all the elements included in the server-side code page are fully loaded. When the retrieved data is text-only there’s no problem, but sometimes there are photos included.
This is part of the code I have been using:
xajx.onreadystatechange = function(){
if(xajx.readyState==4){
document.all.div1.innerHTML = xajx.responseText;
document.all.div1.style.display = “”;
}
}
The thing is that when the response is retrieved (readyState set to 4) and div1 is displayed, the Photo has not been completely loaded yet, so actually the user can see the process of the picture slowly appearing, as he would in any other “normal” case. What I want to do is making div1 available for display only once all the components are fully loaded while meanwhile the system does its stuff in the background. Before Ajax I used hidden iframes like everybody, so I could enclose an onload event handler within the iframe tag (or in an external script), so div1 would appear only after the iframe has fully loaded, photos included.
Any idea?
You can use the 'onload' event on images themselves. You'll need to work out how to attach that event when you are downloading the code dynamically as in your case.