Network Powering Makers

    when-dom-ready
    DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/when-dom-ready package

    1.2.12 • Public • Published

    when-dom-ready

    $(document).ready() for the 21st century

    Build Status Coverage Status npm

    Returns a Promise for cleaner usage, provides a Promise chain helper function and can also be used as a pure function. The Promise will resolve instantly if the DOM is already ready.

    Browser Compatibility

    • IE9+ (requires Promise polyfill)
    • Edge *
    • Firefox 29+
    • Safari 8+
    • Chrome 33+
    • Opera 23+

    Install

    npm install --save when-dom-ready

    or for quick testing:

    <script src="https://unpkg.com/when-dom-ready"></script>

    Usage

    import whenDomReady from 'when-dom-ready';
     
    whenDomReady().then(() => console.log('DOM is ready yo!'));

    You can still use callbacks if you want to:

    whenDomReady(() => console.log('DOM is ready yo!'));

    Promise chain helper

    There is also a little helper function, whenDomReady.resume(), that pauses the execution of a Promise chain and then resumes it with the last value once the DOM is ready.

    This allows you to specify complex async control flow in simple readable code:

    fetch('/my-badass-api.json')
      .then(getSomeProcessingDoneWhileWaitingForDom)
      .then(whenDomReady.resume())
      .then(injectDataIntoDom);

    Pure usage

    You can make the function pure by passing in a document object. This is really useful for tests and mocking environments.

    For example this works in Node.js:

    const Window = require('window');
    const whenDomReady = require('when-dom-ready');
     
    const { document } = new Window();
     
    whenDomReady(document).then(() => console.log('DOM is ready yo!'));

    Again, you can use the callback version as a pure function too:

    whenDomReady(() => console.log('DOM is ready yo!'), document);

    And of course the helper:

    //...
      .then(whenDomReady.resume(document))

    License

    MIT © Luke Childs

    Install

    npm i when-dom-ready

    DownloadsWeekly Downloads

    74,003

    Version

    1.2.12

    License

    MIT

    Last publish

    Collaborators

    • lukechilds