1.0.3 • Published 4 years ago
waitfaster v1.0.3
waitFaster
Promise based API for waiting on custom actions on browser. Makes use of requestAnimationFrame internally with a fallback to setTimeout.
When to use?
For instance if you include a third party library to your web project and if there is no way to know(callback wise) if that library is loaded or initialized. You can just wait on a specific DOM element or a variable that belongs to that library and react to it almost immediately.
Usage
import waitFaster from 'waitfaster';
waitFaster(
(resolve, reject) => {
// Continuously check for a DOM element with a class of myDiv or for a variable named myVar
if (document.querySelector('.myDiv') || typeof myVar !== 'undefined')
resolve('loaded');
},
1000 // Will timeout if the condition is not satisfied within 1000ms(optional parameter)
)
.then((response) => {
// Resolves as soon as an element with a class of myDiv inserted to the DOM
console.log(response);
// Output: { data: 'loaded', elapsedTime}
})
.catch((response) => {
// Rejects if the callback function throws an error, rejects manually or the time limit is exceeded(timeout)
console.log(response);
// Output: { error, elapsedTime}
});
:warning: Callback:
- As the callback function you provided to waitFaster will be called continuously till it resolves please do not set up any initialization code or alike in the callback. Use it just for condition checking.
Tests
npm install
npm run test