Triggering Storage Event Handler After Child Saves LocalStorage Key In Parent

I haven’t been able to find a similar post anywhere online. I am having issues triggering a Storage event listener after a child popup window saves to its parent’s localStorage. This feels like it should be simple, I’m just not sure if I am on the correct path for accomplishing this.

Environment:

  • Single server, IIS, multiple sites
  • Running PHP 7.4.22 on the server

Usage:

  1. User is filling out a web form
  2. User clicks ‘Search’ button on the form to import data into form fields
  3. Button loads a popup window of a site stored on the same server
  4. Item is searched for and selected
  5. Selected item data fields are stored in localstorage of the window.opener element
  6. ISSUE Listener picks up the key being created and is processed by parent

Current Code (Parent):

    window.addEventListener('storage', function(e) {
        alert('Storage change detected.');
        // Do stuff
    });

Desired Result:

  • Selecting an item saves to localStorage and the change is detected by parent – then processed accordingly

Actual Result:

  • Event listener does not trigger when the ‘storage’ event is triggered by the child. My code will trigger if changes are made IN the parent or in the console, but are not triggered when the localStorage key/value pair is created.