React ReadyState Effect

Simple React Effect Hook that execute callback in case current document.readyState match expected.

Installation

Using npm

npm i react-ready-state-effect

Example

useReadyStateEffect

Source

Execute effect is current document.readyState match expected (see isReadyStateMatch).

import { useReadyStateEffect } from "react-ready-state-effect";

export const FunctionalComponent = () => {
    useReadyStateEffect(
        /* callback */ () => {
            console.log(`Document loading completed.`);
        }, 
        /* dependencies */ [], 
        /* expected ready state to execute callback */ "complete"
    );
    
    /* render your component */
    return null;
};

isReadyStateMatch

Source

This helper used to compare current document.readyState with required.

import { isReadyStateMatch } from "react-ready-state-effect";

isReadyStateMatch(undefined); // always true
isReadyStateMatch("complete"); // true if strict equal document.readyState
isReadyStateMatch(["interactive", "complete",]); // true if document.readyState equal some

Contributors

• Alexander Letnikow

License

MIT