Giters

rehooks / local-storage

React hook which syncs localStorage[key] with the comp.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

delete not detected across browser tabs?

mifi opened this issue · comments

commented

First thanks for this extremely practical hook!

To reproduce the problem:

const [val, setVal, deleteVal] = useLocalStorage('myval');

useEffect(() => console.log({ val }), [val]);

  1. Run page in two tabs in Chrome.

  2. When calling deleteVal() in one tab, the useEffect callback never gets fired in the other tab.

  3. However, when calling setVal(null) in one tab, useEffect callback gets fired and logs {val: undefined}

So using setVal(null) instead of deleteVal is definitely a workaround, but it seems like deleteVal should also work.

commented

I have done some debugging and I found the culprit:

local-storage/src/use-localstorage.ts

Line 58 in cdbe4e3

if (event.newValue) {

Instead we should only check if it is undefined, as null is a valid value during deletion. That being said, our types are a bit off as well, and we will have to update the state value to be TValue | null.

commented

Also seeing this issue in 2.4.0, can see the code is fixed in master branch, @jharrilim is there a scheduled next release for this at all?