ngStorage seems to confuse $sessionStorage and $localStorage

[hugomenesesp]

ngStorage seems to confuse $sessionStorage and $localStorage, following this flow:

• Existing data "A: {B: 'localstorage-main'}" in $localStorage
• Existing data "A: {C: 'sessionstorage-main'}" in $sessionStorage
• Application reads data A.C from $sessionStorage correctly
• Application pop-up a new Window of the same App (in another route).
• New window operates in $localStorage (to pass data to the first Window). Setting: $localStorage['A']['D'] = 'localstorage-second';
• First window tries to read "A.C" from $sessionStorage (in code), but in debugging $sessionStorage contains "{A: {B: 'localstorage-main', D: 'localstorage-second'}}".

An execution screenshot can be seen here: http://prntscr.com/8ow3bh

[egilkh]

Would you be able to provide a plnkr or something with the code that produces this error?

[prosperusxix]

do the plnkr pls

[hugomenesesp]

I did update the description.

[hugomenesesp]

@egilkh: Here's an example code:

var app = angular.module('app', []);

app.config(['$routeProvider', function ($routeProvider) {
        $routeProvider.
                when('/', {
                    templateUrl: 'main.html', //Contains a single button that executes ng-click="onClick()"
                    controller: 'MainController'
                }).
                when('/popup', {
                    templateUrl: 'popup.html',
                    controller: 'PopupController'
                }).
                otherwise({
                    redirectTo: '/'
                });
    }]);

app.controller('MainController', function ($scope, $sessionStorage, $localStorage, $window, $interval) {

    var popupWindow = null;

    $scope.onClick = function () {

        //Try to close window if is opened
        if (popupWindow && !popupWindow.closed) {
            popupWindow.close();
        }

        $localStorage['A'] = {
            B: 'localstorage-main'
        };

        $sessionStorage['A'] = {
            C: 'sessionstorage-main'
        };

        var checkWindow = function () {
            if (!(popupWindow !== undefined && popupWindow !== null && popupWindow.closed === false)) { //Popup closed
                $interval.cancel(pollTimer);

                var a = $sessionStorage['A']['C'];
                console.info("Value of A.C: " + a);//Undefined
                //$sessionStorage.A contains {B: 'localstorage-main', D: 'localstorage-second'} and should contain {C: 'sessionstorage-main'}
            }
        };

        popupWindow = $window.open('#!/popup');
        pollTimer = $interval(checkWindow, 600);
    }
});

app.controller('PopupController', function ($scope, $localStorage, $window) {
    $localStorage['A']['D'] = 'localstorage-second';
    $window.close()
});

[antidote2]

Hi I'm experiencing the same issue: something goes totally wrong:

1. I use only $localStorage, but chrome shows also session storage var gets set.
2. Than I can reproduce this issue quite simple:
   • $localStorage.sessionInfo.active = true; on one tab, than switch to the other tab. Chrome shows local storage sessionInfo.active is true (as expected), but session storage sessionInfo.active = false (I wouldn't expect any value).
   • $localStorage.sessionInfo.active returns false which is wrong (runs in a $watch).
   • if I delete sessionInfo from chrome session storage, $localStorage.sessionInfo.active throws exception, which clearly tells us $localStorage tries to read from session storage.

[makarenkodenis]

Hi, it seems like a bug by creating session storage. Session storage is subscribed to the 'storage' event:

$window.addEventListener && $window.addEventListener('storage', function(event) {
    ...
});

but events are coming in by changing the local storage. If both storages contain the same key and the value in local storage was changed then the session storage becomes corrupted because it will be updated by the value from the local storage.

[blongstreth]

I too see this issue and was wondering what the intended functionality is support to be? Is the intention to somewhat synchronize between local and session storage? If not, then the event listed below should determine which storage is the source of the generated event and update accordingly. I didn't dig much to see the browser compatibility

https://developer.mozilla.org/en-US/docs/Web/API/StorageEvent storageArea nsIDOMStorage Represents the Storage object that was affected. Read only.

https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

[BusbyActual]

I'm experiencing this issue as well. On deleting or modifying a $localStorage value the changes propagate through other open windows. $sessionStorage had the same change made on every window. It's unclear how to create a new window with sessionStorage that doesn't pollute the other windows with the same changes.