As I debug in DevTools of either Chrome or Edge, sometimes the debugger loads my source map (generated by rollup) pretty immediately, sometimes I have to wait 10 seconds or so, and sometimes it never requests the source map. I'm watching the web log and can see when it requests the map file (bundle.js.map). The browser simply doesn't ask for it sometimes or takes forever before deciding to ask for it.
Any ideas? I can't step through code until the source map loads, so this just makes me sit and wait and get nothing done.
Related
A test which works perfectly well locally with selenium webdriver is timing out when run remotely on saucelabs.com. The same test works for Chrome (both local and on sauce).
From the client code's side, the click in the following code is never returning:
var someLink = await driver.findElement(By.className('some-class'));
await someLink.click()
I'm using jest for the test framework with at 60 second timeout, so on the client end, I get that timeout error after a minute.
When I log into sauce and look at the list of commands it processed I see:
POST elements
With parameters:
{"using":"css selector","value":".some-class"}
And the returned body is:
[{"ELEMENT":"2"}]
So that succeeds and finds the link. I then never see a click event on that element. Prior click events, and navigation commands are successful.
When I watch the video playback of the session, I see it click the given link and the new page load in Firefox, but the spinner (actually a little dot going back and forth) in the top right never stops.
I can't reproduce with Firefox myself, or even through the manual testing on Saucelabs where you can control the browser and VM through the web.
I'm wondering if there's some synchronous code that's running that just isn't resolving. But I can't figure out how to find that out. The developer tools don't appear to have any way to show currently blocking code.
When page is being loaded, Selenium is waiting for document.readyState to be complete.
Sometimes loading of some resource might stuck - when it tries to get big file and connection is poor, when resource is not reachable because of proxy, when service that provides this resource is down, and so on.
I had the same problem with Firefox and solved it using eager page load strategy.
With this load strategy Selenium will wait for document.readyState to be interactive - some resources might not be loaded, but main elements of the page are loaded and you can interact with them in common way.
DesiredCapabilities caps = DesiredCapabilities.firefox();
caps.setCapability(CapabilityType.PAGE_LOAD_STRATEGY, "eager");
using IE11 the time taken to load the javascript and png files is very huge. After disabling addons it was faster but still not as expected. Javascript loading is happening at the begining of the page and this is causing delay in page loading. Does this have anything to do with network?
I have a basic HTML website (with some javascript) using a simple anchor tag to download a file like so:
Mexml Samples 1.0
In order to track the number of downloads, I have an onclick handler that passes an event to Google Analytics like so:
$('#mybutton').click(function(e){ga('send','event','Download','MexmlSample','MexmlSample-1.0');});
This works as expected when downloading the file using Chrome on OS X, and IE on Windows 7. The file downloads and I see the event in my GA account.
When I test it in Safari 8 on Yosemite, the file does download, but GA only rarely sees the event. And of course I get the dreaded Failed to load resource: Frame load interrupted in the Safari error console.
I assume that I get the GA event sometimes because of a race condition between when Safari interrupts the action and when the GA code fires.
So can anything be done to fix this in Safari so that I always get the GA events?
Note that my question probably has the same root cause as this unanswered question: Frame load interrupted when downloading excel files
Update June 6
I am now thoroughly confused. I just noticed that if I open up a new browser page to my site (in Safari), and click on the download, then it gets logged by GA. However subsequent clicks download still the file, but don't get logged by GA.
If I close that window, and open a new one, then again the first download gets logged by GA.
In contrast, when using Chrome every download gets logged by GA.
I am now thinking that I may be looking at the wrong problem. The behavior I am seeing is telling me that Safari is maintaining a state in JavaScript that allows the first GA call to go through, but blocks all subsequent calls.
But this is the same code being run by Chrome, so I don't know where to how to even start debugging the problem.
If you always want to get the ga event then the hitCallback is likely the only way to go until whatever is wrong with Safari is fixed. I use a similar pattern to send a GA event from a page in an app which is just a redirect after a whole load of database stuff has been executed in rails. There is no noticeable lag from adding the javascript redirect into the callback. However I am not sure how to initiate the download from javascript off the top of my head.
ga('send','event','Download','MexmlSample','MexmlSample-1.0', {
hitCallback: function(){
initiateDownload();
})
I am not aware of any need to use the setTimeout() for pattern in this instance.
The only solution I can think of - is waiting till GA request will finish, and only after that set location.href to desired file download link. But this is not really good from user's perspective. (This can be achieved with hit callback https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#hitCallback).
Probably HTML5 download attribute for href will solve the problem.
I have no OSX with safari to test, so this is only my thoughts.
I have this game I wanted to integrate to my website as a competition for my members. I took a source code of github https://github.com/daleharvey/pacman.
I didn't mess with a code. It works fine on local machine, but when I put it to server It just keep saying it's loading (Not sure if it's allowed to post links so somebody remove it if it isn't allowed) http://puskice.org/assets/frontend/pacman/index.html
Important note is that server is behind Cloudflare so I was wondering if it could have something to do with it.
Application at link above sometimes works when you hit shift+f5 in chrome, and in firefox it mostly works as expected
I opened your site and it appears that your audio files are failing to load.
If you follow the pacman code through, then you'll notice that it displays a loading message (line 1056), and doesn't redraw until after at least one audio file has loaded (line 1082).
but your audio files are 404-ing, so the loaded function is never called.
I'm looking for tips on how to get the browser to kick off an AJAX call as soon as possible into processing a web page, ideally before the page is fully downloaded.
Here's my approximate motivation: I have a web page that takes, say, 5 seconds to load. It calls a web service that takes, say, 10 seconds to load. If loading the page and calling the web service happened sequentially, the user would have to wait 15 seconds to see all the information. However, if I can get the web service call started before the 5 second page load is complete, then at least some of the work can happened in parallel. Ideally I'd like as much of the work to happen in parallel as possible.
My initial theory was that I should place the AJAX-calling javascript as high up as possible in the web page HTML source (being mindful of putting it after the jquery.js include, because I'm making the call using jquery ajax). I'm also being mindful not to wrap the AJAX call in a jquery ready event handler. (I mention this because ready events are popular in a lot of jquery example code.)
However, the AJAX call still doesn't seem to get kicked off as early as I'm hoping (at least as judged by the Google Chrome "Timeline" feature), so I'm wondering what other considerations apply.
One thing that might potentially be detrimental is that the AJAX call is back to the same web server that's serving the original web page, so I might be in danger of hitting a browser limit on the # of HTTP connections back to that one machine? (The HTML page loads a number of images, css files, etc..)
You can use the jQuery onavailable plugin, which will execute as soon as an element is rendered on the page. You can have it execute once an element that is high up on the page renders.