soenkekluth / ready-state

document.readyState Promise

ready-state

Get / Check the document readyState by Promise readystatechange Check when the DOM is loaded like DOMContentLoaded Check when the Window is loaded like onload

All checks also work even after the DOM was loaded.

Dependencies

none!

Install

$ npm i ready-state

$ yarn add ready-state

Usage

const readyState = require('ready-state');

readyState.loading.then(state => {
  console.log('readyState is loading');
}),

readyState.interactive.then(state => {
  console.log('readyState is interactive');
}),

readyState.load.then(state => {
  console.log('Window is loaded');
}),

readyState.window.then(state => {
  console.log('Window is loaded');
}),

readyState.complete.then(state => {
  console.log('readyState is complete');
}),

readyState.domready.then(state => {
  console.log('DOM is loaded');
}),

readyState.dom.then(state => {
  console.log('DOM is loaded');
}),

console.log(readyState.state);


console.log(readyState.ready ? 'I am ready' : 'still waiting');

Test result

  ✔ all document states should pass
    ℹ readyState.loading
    ℹ readyState.interactive
    ℹ readyState.load
    ℹ readyState.window (readyState.load)
    ℹ readyState.complete
    ℹ readyState.domready
    ℹ readyState.dom (readyState.domready)

  1 test passed

Related

• element-ready - Detect when an element is ready in the DOM

License

MIT © Sönke Kluth