Issue with Chrome jumping to bottom on reload on my website - javascript

I hope someone can help me figure out this issue because I'm at a loss.
In one of my sites, it seems there is an issue when pages are reloaded.
Sometimes (not all the time, just sometimes, which makes it even weirder), when I refresh the page, the page will jump to bottom for a second, and then it will jump back up to the position you were in.
Here's an example: https://www.gamesatlas.com/cod-modern-warfare/guides/all-operators-in-call-of-duty-modern-warfare-full-list-of-characters-for-coalition-and-allegiance-factions
Go about halfway through the page. Then refresh. Keep refreshing the page. At one point you will see that Chrome will jump to the footer, and then jump back up to the position you were in. And this will keep happening on subsequent refreshes.
If it doesn't happen with this page, you can try ANY page of the website, same thing.
Can you reproduce it? And if so, does anyone have any clue on why this is happening? It's making me pull my hair out.
The weirder part is that this happens only one of my sites, despite having other sites that are set up pretty much identically (same exact code), yet it doesn't happen there.
So I'm really at a loss. Any help would be appreciated! Thanks!

I had a problem like this, it seemed to be caused by a Chrome extension that I had logged out of (in this case, boomerang). When I removed the extension, the problem seemed to go away. It was driving my crazy too.

Related

Window is in random offsets on page refresh

I'm using GSAP animations in a project and I keep running into this bug where upon page refresh the window will sometimes be in random places. When this happens I just type in window.pageXOffset to see where it's at. This sometimes happens with the Y axis as well. I'm using Chrome, but I've tested it out on Safari and it hasn't happened but it's a totally random bug. It usually will happen when my inspector is out and I've been clicking around A LOT! Clicking the 'empty cache and hard reload' button has fixed it every time. This is a wordpress project too, so I'm not sure when the scripts get loaded if that matters. Anyone know what's going on???

Prevent Chrome 80 from freezing tab with my page

I have a simple html page that displays some monitoring results, it reloads every 2 minutes and makes noise when those results are not acceptable. I keep this page open 24/7, so new Chrome started freezing and suspending it, as I found out via chrome://discards/ .. So the page stopped making noise and catching my attention, mostly cause the tab gets frozen by Chrome. That happens if I forget to leave the tab with this page active, "on top". Is there a rather simple way to prevent Chrome from freezing the tab, even if it is not active? I could involve some Javascript, if needed..
I am aware that there is a simple solution of opening new window with this page and leaving it alone. On the other hand, I made the page, so I can make changes to HTML in order to ensure that page remains unfrozen. I tried updating title with current time on every reload, this visibly helped, page seemingly always has fresh time in the title, but it still doesn't make noise. And if I switch into it when noise is supposed to happen, - it starts the sound half way like it was trying to all alone.. it's even funny..
Is there any simple solution to this? Thanks for your help.

Reloading Hulu with Chrome Devtools open causes strange behavior

Background: I'm trying to create a chrome extension for Hulu. For now, all I'm concerned with is grabbing the titles of the movies/shows in the Comedy genre from the DOM.
Prereq to recreate the issue: I feel terrible saying this, but a Hulu subscription. I can't seem to recreate it without logging in.
Steps to recreate the issue:
Navigate over to https://www.hulu.com/genre/comedy-7d00a83e-556b-4f3c-b894-7c20f4360a1c after logging in.
Open Devtools
Enter the following in the console:
const showLinks = [...document.getElementsByTagName("a")].filter(x => x.id.includes("title"));
console.log(showLinks);
The above should print a number greater than 0, basically just grabbed all links with "title" in their ID. I may or may not pursue a better method later, just playing around for now.
Refresh the page with the Devtools open
Enter the above code snippet again. You will now notice 0 selected elements. The look and feel of the page also changes for some reason.
Any clues on why this is happening would be greatly appreciated. Any suggestions on a better way to grab all the titles would also be quite welcome! Thanks :)
Almost immediately realized my folly, the devtools defaulted to a Responsive view which must have fooled Hulu into thinking I was trying to access content through a mobile/tablet device. The error does not occur after switching to a laptop device.

Javascript failing on IE works if debugger is open

So, I am in a conundrum with my JS failing after a certain amount of time through the menu navigation. Since it works with the console debugger open, I assumed it was a console.log error, but I have removed those functions.
If you open up this page, http://behrent.com/test/Industry.html, in internet explorer, then use either your arrow keys or the menu headers to scroll many times right or left in a row it will break. It currently works in Chrome and FF.
It's almost as though the js crashes or something.
Any ideas on what might be occurring? My JS doesn't have any console.log.
On another page using same css and js, but different html it is also producing scary behavior. http://www.behrent.com/test/Services.html. Basically if you go to that site you can navigate through them if you go slowly, but if you go very quick it will then break in the same fashion as the first page.
Just hope I don't have to move to another layout.
Chad
Figured it out. IE was expecting background images in the various sections, but I didn't indicate that any existed. IE got confused because it was expecting them as I indicated, but they didn't exist in the css, so it just broke.
Calling not existent sections with js makes things break. The more you know...

ContentVeil.js and Forced Synchronous Layout Issue

I have a php page that hangs for 3-10 seconds after the page loads, you can't even scroll up or down, or close the tab when this happens. (the chrome loading gif still loops tho) Happens in Chrome and IE.
Chrome Timeline: http://imgur.com/wF5Pioz,KRbnxIm#0
Shows ContentVeil.js repeating over and over. I think it is client side(?), I did a grepWIN to search for ContentVeil, with no luck, and it doesn't show up in Chrome Network tab.
Chrome Profile: Second image, from above link.
I think this shows the issue at the anonymous function from meta-boxes.min.js, ln 1.
meta-boxes.min.js: http://pastebin.com/yqtJyqB1
Unfortunately line one is a function that encapsulates the whole script. I don't know js very well, I tried to just remove each function one by one but that just created more errors.
Any ideas on how I could find the source of the problem would be much appreciated.
It's part of the Evernote web clipping extension, and it's hooks DOM events, causing massive slowdowns if you are doing large amount of dom changes.

Categories

Resources