page-active
TypeScript icon, indicating that this package has built-in type declarations

1.0.0 • Public • Published

page-active

Check and listen to all page activity changes. Combines several different methods for detecting activity changes into one to ensure maximum coverage.

The following are covered:

  • when the user changes tabs
  • when the user user changes applications (alt+tab)
  • when the user user minimizes browser
  • when the user opens dev tools
  • desktop browsers
  • mobile browsers
  • and more...

Warning: this package sets the following callbacks on the global window object. Do not overwrite them or this package may stop functioning correctly:

  • onpageshow
  • onpagehide
  • onfocus
  • onblur

Installation

npm i page-active

Usage

Use listenToPageActivation to setup a page activation listener. You can setup multiple listeners without any issues.

import {listenToPageActivation} from 'page-active';

listenToPageActivation(
    /**
     * Pass in `true` here to fire your callback immediately when it is hooked up so you get an
     * initial value.
     *
     * Pass in `false` to only fire your callback on future changes.
     */
    true,
    (isActive) => console.info(isActive),
);

At any time you can also call isPageActive to get the current page activation:

import {isPageActive} from 'page-active';

console.info(isPageActive());

Package Sidebar

Install

npm i page-active

Weekly Downloads

38

Version

1.0.0

License

(MIT or CC0 1.0)

Unpacked Size

15 kB

Total Files

10

Last publish

Collaborators

  • electrovir