I have tested a new website with Firefox, Chrome and Safari and all the content is present and working as desired across all browsers. However if viewing specifically on Safari and the website is left open with no activity / interaction for what seems anything more than 45 seconds the website becomes unresponsive when clicking any of the buttons for approximately 10 seconds.
I can click the buttons during this time but nothing happens. Then roughly after 10 seconds has passed the website jumps to whatever the function is of the button that was clicked during the unresponsive time. From this point onwards everything works as normal unless left again for 45 seconds or more.
I have experimented with Chrome and Firefox and both work just fine after being left inactive for similar periods of time or longer.
I wonder if anyone has had a similar experience?
Any help would be great.
Can you share a bug report with us so we can see what might be going on here? Use Help > Report an Issue and attach your document (and the URL of where it appears).
Do you happen to know if it occurs in either the Technology Preview https://developer.apple.com/safari/technology-preview/ or Webkit builds: https://webkit.org/build-archives/ ?
Thanks for your reply. With a little more testing starting fresh with a new basic project the exact same is happening. I am using Safari 13.1.1 on both my Macbook and iMac (Running Mojave) and both experience the same issue.
I have also tested on an older machine (running Mavericks), which is on Safari 9.1.3 and there is no issues at all.
Is this a bug specific to my newer machines, or is Safari 13.1.1 to blame here?
I have attached my basic project to see if you experience similar issues in your version of Safari. I click the forward button and then leave the page with no interaction for around 50 seconds or more. After this time the buttons become unresponsive but will jump after approximately 10 seconds to whatever button was clicked. I hope this explanation makes sense.
Thanks for your help.
Safari Delay.hype.zip (13.3 KB)
Thanks for providing the document and details on reproduction. I was able to reproduce this on macOS 10.14 only with Safari 13.1. Like you, I could not reproduce it on macOS 10.13 nor 10.15 or with other major versions of Safari.
It appears to be a rendering bug in Safari itself; Hype is definitely running animation code. If you do something like resize the window you can tickle Safari to re-render the page immediately. It affects much more than Hype animations and can be reproduced with fairly simple HTML code:
<div id="box" style="opacity:.3">hello world</div>
<div onclick="box.style.opacity=1">click me</div>
I've filed a bug against WebKit:
I spent some time trying to figure out workarounds for the problem, but unfortunately the only way I discovered to keep page rendering alive was to keep animating some element to keep the page from getting into this idle/sleep state. Setting up another timeline that has a brief animation and then a timeline action to restart the timeline after ~20 seconds should be enough. The object must have at least 1% opacity; if it is fully hidden it won't work.
I have filed this in our bug tracker, but I will wait to see how WebKit responds to the bug before exploring a permanent workaround in Hype.
Actually I found that if I install the Safari 14 beta, I cannot reproduce the problem. So it appears it will be fixed in a later Safari update .
If you are willing to give that a try, please let me know if you still hit it or not. Thanks!
Thanks @jonathan for taking the time to look into this.
I have added your suggestion of a simple looping animation that is mostly discrete and can confirm that this resolves the issue with the version of Safari 13.1.1
Great to hear that this issue maybe fixed with an upcoming version of Safari, however I would be a little concerned not everyone will have the option or decide to run Safari 14, so playing safe I will include the workaround of the looping animation for the moment.
Thanks again for your help, really appreciate it as always!