Enable localStorage / webStorage in nightwatch.js

Question

I am trying to test an app that relies on localStorage. Everything works fine when I interact with the browser manually. However, in nightwatch.js instead of the desired string I get a null response when requesting localStorage. This applies both in Chrome and Firefox.

I already tried to enable localStore in the nightwatch JSON by assigning "webStorageEnabled" : true in desiredCapabilities like this:

{
  "src_folders" : ["tests/functional/tests"],
  "output_folder" : "tests/functional/reports",
  "custom_commands_path" : "",
  "custom_assertions_path" : "",
  "globals_path" : "",

  "selenium" : {
    "start_process" : true,
    "server_path" : "/Library/WebDevelopment/selenium-server/selenium-server-standalone-2.45.0.jar",
    "log_path" : "",
    "host" : "127.0.0.1",
    "port" : 4444,
    "cli_args" : {
      "webdriver.chrome.driver" : "/usr/local/lib/node_modules/chromedriver/lib/chromedriver/chromedriver",
      "webdriver.ie.driver" : ""
    }  
  },

  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "webStorageEnabled" : true,
        "databaseEnabled" : true,
        "applicationCacheEnabled" : true,
        "nativeEvents" : true,
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    } 
}

Is localStorage supposed to work when using nightwatch.js?

Answer 1

In my test is working with localstorage, you need to use the "execute" command to inject javascript in the browser and interact with the browser localstorage

it.only('expectation', function (client) {

    client.url('www.someurl.com').execute(function(data) {
        try {
            // statements
            localStorage.pepe = 1
            console.log('local', localStorage)
        } catch(e) {
            // statements
            console.log(e);
        }
        return true;
    }, [], function(result) {
    });
    client.pause(0);
});

Answer 2

What worked for me is dumping localStorage into a new Object, otherwise it returns an empty array. This way it's readable back in Nightwatch land:

client
  .url('http://yahoo.com')
  .execute(() => Object.assign({}, localStorage), [], (result) => {
    console.log(result.value)
  })