I'm almost done with my previous issue, but now I'm dealing with something more subtle and annoying.
I've got a page with some links like these ones:
First content
Second content
In the page page.html there is some javascript, something like this:
document.write (window.location.href);
So, I click on the first link, and I see (in a different frame) the page "page.html", correctly starting at anchor #1. At the end the javascript writes "page.html#1", and this is correct.
Then I click on the second link, and I see the page "page.html" changing its starting point, now correctly set at anchor #2. But at the end of the page I still see "page.html#1", not "page.html#2" as I expected. I think this happens because the page is exactly the same as before, only the starting point changed, so the "location.href" was not changed, despite a difference in the hash.
Is there a way to solve the problem, and get the original location.href, the one with the correct hash?
use onclick event attribute:
First content
Second content
Related
I'm replacing the html in a div tag on my page on the keyup event of a textbox when the user enters a search. When the html is set via jQuery's .html() method on the div tag the entire page shifts to the left and then back to the right. For some reason this is only happening when I deploy the website to an IIS site when I run locally in Visual Studio the page no longer shifts to the left and back to the right. When I replace the div tags content I am first clearing it by calling .html('') and then am setting it to the search results that is a ul tag. This issue is also only happening with Chrome it works fine on Edge.
Posting code helps, so we do not have to make an assumption on what you are doing.
If you are in fact doing something like:
$("#id").html("");
$("#id").html("html-here");
Then that makes sense, the first .html() call sets the div to be empty, causing the shift you mentioned, then you fill up the div again on the next call to .html().
Using a single call instead will not cause the page to be re-rendered twice, but it will still overwrite the contents like you want (you may have been thinking of $.append(), where you do have to clear first:
$("#id").html("html-here");
There is a javascript command, window.history.back, that basically undoes the last action of clicking on a link. However, it has an annoying limitation. If you are on a very large HTML page with lots of intra-page links (using the notation ... to jump within the same page), then executing window.back won't get you to the previous page; it will only take you to the previous section of the same page. That's not typically what I want. Is there a way to jump to the previous page, rather than the previous section?
One approach that might work would be to record the size of the window history when you first load the page, and then go back however many additional entries have been made since then. That seems error-prone (what happens if you reload the page, for example?)
Use window.history rather than window.back. For example, you could use the following code to create a back button:
<button onclick="goBack()">Go Back</button>
<script>
function goBack() {
window.history.back();
}
</script>
My script scrapes the page and if there is a new element according to my requirements, it clicks the button, when there is only one element everything is perfect but problem is when it clicks the button, a new page opens. So if there are more than one element, I need to get back to previous page to continue process.
I tried browser.back() for sure, but when it comes back to previous page it doesn't remember the elements and gives this error as I expected: selenium.common.exceptions.StaleElementReferenceException: Message: Element not found in the cache - perhaps the page has changed since it was looked up with the line if len(css(".Total", parent=new, nowait=True)) > 0: which is the first line, I made it to recognise the new elements.
I also tried to open a new tab/window by clicking the button but button doesn't have this feature because it is javascript. Is there a efficent way to solve this issue?
first_window_handler = driver.current_window_handle
driver.find_element_by_css_selector("body").send_keys(Keys.CONTROL + 't')
second_window_handler = driver.window_handles[1]
# from second page
driver.switch_to.window(second_window_handler)
element_from_second = driver.find_element_by_css_selector('something')
# from first page
driver.switch_to.window(first_window_handler)
element_from_first = driver.find_element_by_css_selector('something else')
now you can switch between windows, and the elements will still be interactable
As per exception
selenium.common.exceptions.StaleElementReferenceException: Message: Element not found in the cache - perhaps the page has changed since it was looked up
we came to know that whenever page loads webdriver loosing references to webelements which it holds previously.
So the best thing is always pass locators dynamically on calling predefined keywords/methods in java prospective, so that webdriver looks for that web element at that instance and perform action.
Some times we may receive same exception in looping list of web elements, because in loop due to actions webdriver may loose reference, so in loop also we need to specify locators so that it will not fail. example if i need to click on links, i will give path like this "//a["+i+"]"
Thank You,
Murali
I am working on some javascript code, and using window.History.pushState to load new HTML pages, instead of using href tags. My code (which is working fine) looks like this.
window.History.pushState({urlPath:'/page1'},"",'/page1')
strangely, this fails, ie reloads the browser
window.History.pushState({urlPath:'/page2.php'},"",'/page2.php')
But this works, content is updated, browser not refreshed ! (notice the URL is absolute and not relative)
window.History.pushState({urlPath:'www.domain.com/page2.php'},"",'www.domain.com/page2.php')
The documentation for window.History.pushState says that the third parameter URL can be either absolute or relative -
URL — The new history entry's URL is given by this parameter. Note
that the browser won't attempt to load this URL after a call to
pushState(), but it might attempt to load the URL later, for instance
after the user restarts the browser. The new URL does not need to be
absolute; if it's relative, it's resolved relative to the current URL.
The new URL must be of the same origin as the current URL; otherwise,
pushState() will throw an exception. This parameter is optional; if
it isn't specified, it's set to the document's current URL.
Absolute URLs seem to be working but relative seem to be not. Why is this happening?
The short answer is that history.pushState (not History.pushState, which would throw an exception, the window part is optional) will never do what you suggest.
If pages are refreshing, then it is caused by other things that you are doing (for example, you might have code running that goes to a new location in the case of the address bar changing).
history.pushState({urlPath:'/page2.php'},"",'/page2.php') works exactly like it is supposed to in the latest versions of Chrome, IE and Firefox for me and my colleagues.
In fact you can put whatever you like into the function: history.pushState({}, '', 'So long and thanks for all the fish.not a real file').
If you post some more code (with special attention for code nearby the history.pushState and anywhere document.location is used), then we'll be more than happy to help you figure out where exactly this issue is coming from.
If you post more code, I'll update this answer (I have your question favourited) :).
As others have suggested, you are not clearly explaining your problem, what you are trying to do, or what your expectations are as to what this function is actually supposed to do.
If I have understood correctly, then you are expecting this function to refresh the page for you (you actually use the term "reloads the browser").
But this function is not intended to reload the browser.
All the function does, is to add (push) a new "state" onto the browser history, so that in future, the user will be able to return to this state that the web-page is now in.
Normally, this is used in conjunction with AJAX calls (which refresh only a part of the page).
For example, if a user does a search "CATS" in one of your search boxes, and the results of the search (presumably cute pictures of cats) are loaded back via AJAX, into the lower-right of your page -- then your page state will not be changed. In other words, in the near future, when the user decides that he wants to go back to his search for "CATS", he won't be able to, because the state doesn't exist in his history. He will only be able to click back to your blank search box.
Hence the need for the function
history.pushState({},"Results for `Cats`",'url.html?s=cats');
It is intended as a way to allow the programmer to specifically define his search into the user's history trail. That's all it is intended to do.
When the function is working properly, the only thing you should expect to see, is the address in your browser's address-bar change to whatever you specify in your URL.
If you already understand this, then sorry for this long preamble. But it sounds from the way you pose the question, that you have not.
As an aside, I have also found some contradictions between the way that the function is described in the documentation, and the way it works in reality. I find that it is not a good idea to use blank or empty values as parameters.
See my answer to this SO question. So I would recommend putting a description in your second parameter. From memory, this is the description that the user sees in the drop-down, when he clicks-and-holds his mouse over "back" button.
window.history.pushState({urlPath:'/page1'},"",'/page1')
Only works after page is loaded, and when you will click on refresh it doesn't mean that there is any real URL.
What you should do here is knowing to which URL you are getting redirected when you reload this page.
And on that page you can get the conditions by getting the current URL and making all of your conditions.
I have a webpage that use $(document).ready() to build the interface. Then the user can go to a child page, and to go back to the original page he can press the browser's "previous" button or a "Return" button in the page which triggers a history.back();. Back on the original page, $(document).ready() is not triggered so the page is missing information.
Is there a way to trigger it automatically like if it was a "real load"?
edit
placing an alert in it, the alert is popped but stuff is missing in my interface like if some part of the ready event is missing. Investigating...
edit 2
hahahahaha in document.ready I click some checkbox which are supposed to be unchecked. When I "back" on this page, they are checked so they become unchecked because I reclick them.
Sorry, this is completely my bad :(
A quick solution to this problem, use "onpageshow" instead.
window.onpageshow = function(event) {
//do something
};
If the user uses the Back button to navigate and you require a full reload of the page, you can set the NO-CACHE policy of the page.
This way the browser is forced to reload the page from the server, even using the Back button.
1.) put scripts at the bottom of your page.
2.) execute plugins and whatnot in your last script tag(s).
3.) Do not use onDomReady implementations at all, it's redundant.
People are so accustomed to onload or ondomready, they overlook the fact that putting your scripts at the bottom of a page does virtually the same thing without the need to poll and see if your html is available.
Furthermore, it's also good practise as your scripts do not block html/css rendering either.
Not depending on onDomReady or onLoad implementations solves a lot of issues.
Very interesting question. You might need to re-trigger the event/function when the page gets focus, or something similar. you might also need to keep a flag variable to track whether an 'event re-triggering' is in order.