I am working on web application which is implemented with angular and react js. In this, I have a scenario to scroll and check whether element is displaying or not.
I have tried all ways like using x,y values, scrollIntoView and all possible ways what I have noticed on different blogs and technical related web pages. But, i an not succeeded in it.
Here, I need some suggestions like what are other approaches we have to scroll webpage other than javascriptexecutor as this is already applied and failed in my case.
As a side note, elements will be loaded dynamically when we scroll the webpage and will not be available in the DOM itself. To get these elements, we have to scroll manually and check it.
Thanks in Advance..
I found a root cause why javascriptexecutor is not working on my application. This script will work only on browser (I.e. if browser have scroll bar), but in my application browser does not have a scroll bar instead it has virtual table scroll bar (scroll bar inside application).
Even I found a solution for the same after 2 days of investigation using Keys.PAGE_DOWN/UP inside do while loop.
Thanks for your support.
Related
I have a difficulties with some content of the web-page when I am trying to discover the element
For example some part of the web-page is blocked by the following:
[data-testid=shell-content]
Any idea what could possibly cause following?
In the browser, the page isn't blocked and (all buttons) can be accessed by the keyboard or mouse.
Tried to upgrade to the lates version, still the same problem.
The problem was described against the iframe, it has to be handled in a similar way in order to access the elements
cy.enter('iframe[data-testid="iframe-content"]').then((getBody) => {
getBody().find('[data-test-id="create-user-button"]').click();
please note that name shell-content could be different to what was name in your project.
While clicking the dropdown in an overlay, it shows the list as expected and the main page gets hided. But when the user tries to scroll on the page, the dropdown content (list) start moving along the page scroll.
We used Dojo 1.8 for our HTML development. Can anyone help me with a suggestion to handle this?
It's not 100% clear from your question, but I believe you are describing https://bugs.dojotoolkit.org/ticket/5777. As far as I can tell, the resolution to this for moving popups along with their opener's container's scroll was only institituted in 1.9 and above (I couldn't find the _repositionAll method in 1.8).
I would suggest trying with 1.9.7 or 1.10.4.
NOTE: New to this forum (UX/User Experience), so please let me know if this would be better in a different category. I searched Stack Exchange for "pinterest" and this forum seemed to have the most results. Thanks!
Hi guys. I'm writing a jQuery gist to grab links of all the images pinned to a given board in Pinterest. However, I've been running into the problem of having to repeatedly keep scrolling because all the results are not displayed on the same page. With the trendy "infinite scroll" or "lazy load" feature, one has to keep scrolling to the bottom without actually knowing if they are anywhere close because it seems to depend on your zoom percentage in your browser window and your window size as well, as to how many items display on your screen. I've been searching this for hours to no avail.
Searches I've already done keep returning non-productive results
The results I get when searching for
"Pinterest how to disable lazy loading" and "Pinterest how to disable infinite scroll"
keep returning the opposite of what I am looking for -- incorrect results for my purposes are anything like:
"How to add infinite scroll to my website",
"20 Useful Pinterest Tools",
or anything to do with adding infinite scroll.
The Problem: Infinite Scroll/Lazy Loading makes it hard for me to use browser plugins like jquerify (Chrome) and FireQuery (Firefox)
The issue for me is that I want to be able to view all my pins on a given board at once. Then I can use jQuery to manipulate all images on the page. Currently, infinite scroll makes it hard to keep track of where I'm at. I've tried stuff already by it's late at night and hard to remember everything. The important find was that in page source, Pinterest is using a "lazy" function. Here is what I found:
P.lazy = {
onImageLoad: function(a) {
var b = LOADED_CLASS;
P.overlap.isOverlappingViewport(a) && (b += FADE_CLASS);
a.className += b
}
};
This is just starting to be a deeper rabbit hole. I've checked for plugins to "remove", "disable", or "bypass" lazy loading, but haven't found any ... only those for adding it in.
Thanks in advance for your kind assistance and Cheers.
Pinterest loads cards via Ajax. When you scroll to the bottom of a page, browser javascript fires an Ajax call to load the next page full of cards.
This means it's not really possible to "disable" the infinite scrolling feature.
A few possible approaches:
Depending on how you're instantiating the browser, you might try setting or spoofing the window dimensions to a very large height. Pinterest may detect that height and attempt to load a window's worth of images, which may be enough to cover the feed you're trying to scrape.
If #1 is not practical for you, you can use javascript/jquery to keep scrolling the browser down until it has finished loading all the images. There are several ways to do this, since you are injecting javascript into the browser session.
(a) You can do this the "dumb" way with a loop that sets a timeout (setTimeout), then scrolls to the bottom (scrollTo()), then keeps going until the window stops scrolling and that comprises a kludgey auto-detect for the bottom of the page load.
(b) a more sophisticated approach would be to implement a listener for pinterest's ajax load function, (see the code, but it's a GET request to URL https://www.pinterest.com/resource/UserHomefeedResource/get/). An ajaxComplete() jQuery handler may help you detect the completion of a page load request so you can scrape the new images loaded.
Hope that helps
On my full screen browser page the header is visible but the footer is not visible on the current window. To see the footer we needs to page down N times as the intermediate contents is populated when we page down (dynamically populate). So my problem is to know how many times i needs to page down to see the footer. Adding to this question, is it possible to know if an web element is below the current visible browser area ?
If you are using QTP for identifying and operating on the objects, you need not scroll down. Make sure that you are using strong locator properties (htmlId, ObjectId etc) for identifying the element and your code will work just fine. QTP works on the HTML source of the web page; so it is immaterial whether or not the element that you want to work on is visible or not. I am assuming there are no AJAX components here. With AJAX, you need to employ a different strategy.
I am trying to recreate some effects similar to the div loading effects on this site i.e. there is no visible content when you load the page but upon clicking on a navigation link, it dynamically loads the divs.
http://worldofmerix.com
It is for a film studio website and I would like it to be interactive like this site. Does anyone know how I could achieve these effects with Javascript and/or jQuery?
Thanks for all the help in advance!
Have you used jQuery before or looked at the docs? This is really quite simple using jQuery's built-in animation effects such as fadeIn. The site you've linked to doesn't dynamically load the content - it's all part of the same page and simply displayed and hidden as appropriate.
Here's a rough fiddle showing how it works. Of course, you'd need to work out the styles and quirks in animations.