Listen to localStorage.removeItem() event only

Question

I am displaying notifications to users using pnotify plugin. However I want to remove notification on all tabs if user closes notification in 1 tab by clicking X icon.

I use localstorage for this, each time a new notification is shown to the user, it gets added to the localStorage. When user presses X icon, I do localStorage.removeItem(key). How do I listen to this event to close the notification in all tabs?

My listener is below:

$(window).bind('storage', function(e) {
    // if it was removed
    if (e.originalEvent.newValue == null) {
        var notificationObject = e.originalEvent.oldValue;

        // call remove function on pnotify object
        notificationObject.remove();
    }
});

I noticed that newValue turns into null if it was removed, in theory this would work (have not tested yet), but is it reliable in terms of will it always return null if removeItem was called on that item? What if the item value changes to null, it will then trigger that event since the value changed right?

Answer 1

$(window).on("itemRemoved", function(e, args) {
  console.log(e, args);
  if (!localStorage.getItem(args)) {
    // do stuff
  }
})

fn = localStorage.removeItem; 
localStorage.removeItem = function() { 
  var args = arguments; 
  setTimeout(function() {
    $(window).trigger("itemRemoved", [args[0]])
  }); 
 return fn.call(localStorage, args[0]); 
}