supertokens / browser-tabs-lock Goto Github PK

View Code? Open in Web Editor NEW

36.0 6.0 3.0 707 KB

Using this package, you can synchronise your code logic across browser tabs.

License: MIT License

JavaScript 60.72% TypeScript 28.89% Shell 0.44% HTML 9.94%

supertokens javascript browser browser-sync lock tabs

browser-tabs-lock's People

Contributors

Stargazers

Watchers

Forkers

teamsupercell forkkit

browser-tabs-lock's Issues

Lock might be acquired by multiple tabs upon refresh

Hi,

I am trying to use this library for cross tab locking, and I noticed that upon refresh, the lock might be acquired by multiple tabs at the same time.

Given this simple page:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script src="https://cdn.jsdelivr.net/gh/supertokens/[email protected]/bundle/bundle.js"></script>
  <script>
  const lock = new supertokenslock.getNewInstance();

  window.addEventListener('beforeunload', async () => {
    await lock.releaseLock('lock-key');
  });

  (async () => {
    console.log(`Acquiring lock`);
    let acquired = false;
    do {
      acquired = await lock.acquireLock('lock-key', 5000);
    } while (!acquired);
    console.log(`Acquired lock`);
  })();
  </script>
</head>
<body>
</body>
</html>

If you open it in two tabs, the first one will acquire the lock, and the second one will wait.

Once you refresh the first tab, the second tab will acquire the lock, and also the first one (Once it finishes the refresh).

The only way I could mitigate it was by adding some random delay before the first call to acquireLock(), like this:

(async () => {
    console.log(`Acquiring lock`);
    let acquired = false;
	await new Promise((resolve) => setTimeout(resolve, Math.floor(Math.random() * 101)));
    do {
      acquired = await lock.acquireLock('lock-key', 5000);
    } while (!acquired);
    console.log(`Acquired lock`);
  })();

Any suggestions?

Please support node 18.6

Hi,

1.2.15 refuses to build with node 18.8. I get the following error:

This file contains the result of Yarn building a package (browser-tabs-lock@npm:1.2.15)

Script name: postinstall

(node:52) ExperimentalWarning: Custom ESM Loaders is an experimental feature. This feature could change at any time
(Use node --trace-warnings ... to show where the warning was created)
node:internal/errors:484
ErrorCaptureStackTrace(err);
^

Error [ERR_LOADER_CHAIN_INCOMPLETE]: "file:///app/.pnp.loader.mjs 'resolve'" did not call the next hook in its chain and did not explicitly signal a short circuit. If this is intentional, include shortCircuit: true in the hook's return.
at new NodeError (node:internal/errors:393:5)
at ESMLoader.resolve (node:internal/modules/esm/loader:847:13)
at async ESMLoader.getModuleJob (node:internal/modules/esm/loader:426:7)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:528:24)
at async loadESM (node:internal/process/esm_loader:91:5)
at async handleMainPromise (node:internal/modules/run_main:65:12) {
code: 'ERR_LOADER_CHAIN_INCOMPLETE'
}

Node.js v18.8.0

some googling suggests this relates to a new node 18.6 feature, hope that helps.

Lodash version upgrade

Snyk reporting an issue(Command Injection vulnerability) on lodash version <4.17.21

https://snyk.io/vuln/SNYK-JS-LODASH-1040724

Can we upgrade lodash version please?

Locks not enforcing mutex under extremely high load

Note that the locks are enforced under most real life scenarios. However, if we take it to the extreme, it breaks down

See:

Add web worker synchronisation with tabs

when refresh is needed, tell the main thread to do it. Remember that there can be an unlimited number of worker threads.
web workers maintain the current id refresh token and anti csrf token in memory - whenever these change, there is a broadcast from main thread to all worker threads.

SyntaxError: Unexpected strict mode reserved word

Our React application has a dependency on the "browser-tabs-lock" package and recently our Jest tests have started to fail with the following error:

E:\git\ScionUi\node_modules\browser-tabs-lock\processLock.ts:2
        static instance: undefined | ProcessLocking;
    SyntaxError: Unexpected strict mode reserved word

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
      at Object.<anonymous> (node_modules/browser-tabs-lock/index.js:38:21)

Looking into the "processLock.ts" file it complains about the use of "static" in the "ProcessLocking" class:

class ProcessLocking {
    static instance: undefined | ProcessLocking;
    private locked: Map<string, (() => void)[]> = new Map<string, (() => void)[]>();

Can someone provide a solution to that issue or provide some workaround?

Package includes .git folder, causing errors during npm operations

Issue

browser-tabs-lock recently updated to 1.2.4, as a sub-dependency of @auth0/auth0-spa-js. This version appears to include the .git folder from the repo, which I believe is causing issues running npm commands on windows.

After the update, I tried to run npm audit fix to fix unrelated sub-dependency security warnings, and received the following error:

λ npm audit fix
npm ERR! code EISGIT
npm ERR! path D:\Repos\CAPP.Dashboards\dashboards-client\node_modules\browser-tabs-lock
npm ERR! git D:\Repos\CAPP.Dashboards\dashboards-client\node_modules\browser-tabs-lock: Appears to be a git repo or submodule.
npm ERR! git     D:\Repos\CAPP.Dashboards\dashboards-client\node_modules\browser-tabs-lock
npm ERR! git Refusing to remove it. Update manually,
npm ERR! git or move it out of the way first.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\joep\AppData\Roaming\npm-cache\_logs\2019-11-26T09_24_07_358Z-debug.log

Other info

The same error occurs when attempting npm i browser-tabs-lock@"1.2.1". Manually removing browser-tabs-lock from node_modules, or removing the .git folder from inside browser-tabs-lock resolves the error.

Running Windows 10, npm 6.13.1.

Please let me know if any other information is needed.

Use cookies instead of localstorage?

This will allow synchronisation across subdomains as well.

Reset terminal color via ANSI reset

Is it possible that you're not resetting the terminal colour after you switch to yellow in the post-install script?

It doesn't seen to be a problem with a terminal install but on Jenkins it turns the rest of our log yellow and makes it very hard to read:

Thanks
Nick

ES5 support

Hi friends! Loved the project. Any chance you can publish an ES5 version of this for the poor souls like me that need to support IE11? 😝 Let me know how I can help with that 🎉

README documentation

document how to use this package
add comments in code explaining what it is doing