Delaying onDOMContentLoaded and onload events
While testing frontend issues, you may be confronted with verifying a feature's functionality while the document is still in parsing mode. That is before the DOMContentLoaded
event was triggered. Or maybe the test needs to be run in between DOMContentLoaded
an load
events. Or some other weird stuff. Here's how…
There is no “native” - inline - way to influence (delay) either of DOMContentLoaded
or load
. All is not lost, though. A browser keeps a document in parsing mode until all synchronous JavaScript has finished loading (and executing). So we can simply load a <script>
resource from a web server that allows us to specify how long it should delay the return of that resource. Delaying the load event can be done similarly, by loading an image instead of a script.
I've written a little PHP script (test-resource.php
) that allows you to
- specify how long the request's response should be delayed (in milliseconds)
- specify HTTP response status code an message (like
404 Not Found
) - specify the returned data (using proper Content-Type, using valid content)
- HTML
- CSS
- JavaScript
- JSON
- GIF image
- SVG image
The test-resource
does a bit more than needed for only delaying some events. It allows you to test what your implementation does with JavaScript that is not served as application/javascript
, or what a non-image/svg+xml
looks like, or if you're properly accepting encodings other than UTF-8
. Is a JavaScript resource executed if it's returned as 404 Not Found
? … have fun answering those questions yourself ☺
Remy Sharp created hang - a public service doing most of the above. It's a node server you can grab from here.
The author does not allow comments to this entry
Comments
Display comments as Linear | Threaded