Remove an item from localStorage in a protractor test

Question

I am trying to remove an entry in the localStorage from a protractor test

describe('The feature', function() {

  beforeEach(function() {
    browser.executeScript('localStorage.removeItem("key");');
  });

  it('should do this', function() {

  });
});

but i get this error when the test is run in chrome

UnknownError: <unknown>: Access to 'localStorage' is denied for this document. Storage is disabled inside 'data:' URLs.
  (Session info: chrome=32.0.1700.77)
  (Driver info: chromedriver=2.8.241036,platform=Mac OS X 10.9.0 x86_64) (WARNING: The server did not provide any stacktrace information)
Command duration or timeout: 436 milliseconds
Build info: version: '2.39.0', revision: 'ff23eac', time: '2013-12-16 16:11:15'
System info: host: 'MyPC.local', ip: '192.168.1.1', os.name: 'Mac OS X', os.arch: 'x86_64', os.version: '10.9', java.version: '1.7.0_45'
Session ID: 23c01c8f756c653a6345e4b2f20c06e5
Driver info: org.openqa.selenium.chrome.ChromeDriver
Capabilities [{platform=MAC, acceptSslCerts=true, javascriptEnabled=true, browserName=chrome, chrome={userDataDir=/var/folders/9h/6j5pzftn4sxdw3rt25ffrqx80000gn/T/.org.chromium.Chromium.xrCG1d}, rotatable=false, locationContextEnabled=true, version=32.0.1700.77, takesHeapSnapshot=true, cssSelectorsEnabled=true, databaseEnabled=false, handlesAlerts=true, browserConnectionEnabled=false, nativeEvents=true, webStorageEnabled=true, applicationCacheEnabled=false, takesScreenshot=true}]

Answer 1

Another potential solution is to put any state clearing in an afterEach, which will run after any test is run: (see https://github.com/angular/protractor/issues/188)

afterEach(function() {
    browser.executeScript('window.sessionStorage.clear();');
    browser.executeScript('window.localStorage.clear();');
});

Answer 2

I solved this issue by checking the window.location before attempting to clear/modify sessionStorage or localStorage.

If a page has not been loaded then window.location.hostname will equal the empty string ''. So if you get the emptystring, then don't attempt to interact with sessionStorage or localStorage.

Here's some (ES6) code I used in my protractor suite to prevent this error. Note it's a cucumber-js After function, but it is still executed from protractor using chrome, and it demonstrates what you need to do to avoid this error:

this.After(function(scenario) {

  function getWindowLocation() {
    return window.location;
  }

  function clearStorage() {
    window.sessionStorage.clear();
    window.localStorage.clear();
  }

  return browser.executeScript(getWindowLocation).then(function(location) {
    // NB If no page is loaded in the scneario then calling clearStorage will cause exception
    // so guard against this by checking hostname (If no page loaded then hostname == '')
    if (location.hostname.length > 0) {
      return browser.executeScript(clearStorage);
    }
    else {
      return Promise.resolve();
    }
  });
});

Answer 3

It happens because your browser is not yet open when you trying to access it's localStorage.

You should move your localStorage manipulation to happen after the browser is open. Or, as suggested in the comment, to try/catch the JS execution of the first test (if it suits your scenario).