Skip to content

aermin/web-locks

Repository files navigation

web-locks polyfill

push workflow release workflow npm license

a Web Locks API polyfill, work when the browser does not support web lock API: navigator.lock, resolve the browser compatibility issue.

Installation

// with npm
npm install navigator.locks

// with yarn
yarn add navigator.locks

Usage

Just import It.

import "navigator.locks";

navigator.locks.request("my_resource", async (lock) => {
  // The lock has been acquired.
  await do_something();
  await do_something_else();
  // Now the lock will be released.
});
// if you use Typescript, could import these types to use
import type {
  LockManager,
  Lock,
  LockInfo,
  LockManagerSnapshot,
  LocksInfo,
} from "navigator.locks";

navigator.locks API usage follow MDN API Doc

Online demo

demo link

You could open two tabs of this API unsupported browser, operate the lock buttons to experience

Process

All API ✅

  • navigator.locks.request

  • navigator.locks.request options:

    mode: exclusive | shared

    ifAvailable

    steal

    signal

  • navigator.locks.query

CI/CD ✅

Unit test ✅