How does having Chrome devtools open change behaviour?

Question

In my JavaScript, I have implemented a feature that hides the title bar and it is triggered by a scrollEvent. So when I scroll down, the title bar is hidden. As I begin to scroll up, it is revealed. Think about it as a similar effect to what most mobile browsers do with the search bar.

Here's the thing... with devtools open, it works just fine. If I close devtools, the effect no longer works, ie. the title bar remains visible as I scroll down. If I reopen devtools (ctrl-shift-j), the effect works again. I am running the devtools in a separate window, so its presence doesn't affect the window dimensions of my app.

Does anybody know what influence the presence of Chrome devtools has on Javascript or rendering behaviour?

NB, for any speed readers that miss the point of my question, I am not asking for a solution to the problem I'm seeing. I'm specifically only asking for answers to my question.

EDIT: I've now discovered that having devconsole in the foreground vs background is significant too. With the console in the foreground, it works, in the background it fails. See animated gif at https://ibb.co/4M75sPQ

Answer 1

I had a similar question in stack quite some time ago. Mine affected the way and speed JS was executed, specifically JSPerf was being slower when I had the console open, and the tests were completely messed up you can take a look at my answer here

Still, might be that some of the issues might be related to your config of the devtools, as this user pointed out in this question https://askubuntu.com/a/633838/742250

Have you tried in an incognito window or in other browsers? Mozilla or Safari?