localStorage being set on wrong domain

[egucciar]

Current behavior:

We use the following code to set baseUrl:

export function setMoverDemoBaseUrl() {
  const moverDemoUrl = Cypress.env('moverDemoUrl');
  const baseUrl = 'http://app.dev.updater.com:8080';
  console.log('setting mover base url', moverDemoUrl || baseUrl);
  Cypress.config('baseUrl', moverDemoUrl || baseUrl);
}

Which demonstrates that the baseUrl of Cypress is set as follows:

Shortly after, we set some stuff in the localStorage.

we use something like this:

cy.window().then(win => win.localStorage.setItem(...));

This then is updating the wrong Domain/Origin.

Notice that the baseUrl is set to be app.moving.dev.updater.com, whereas the url being chosen here is app.dev.updater.com.

There's no telling why it is setting on this other Domain as of now. This is failing my test and blocking my progress forward. I cannot perform a visit before the first setting either, as this will mess up my tests.

I am simply doing a refactor from one domain to another domain as of now, and for some reason, it is still "hanging on" to this previous domain. And I do not know why.

Desired behavior:

I want the localStorage setting to occur on the baseUrl I have set.

Steps to reproduce: (app code and test code)

I really do not know how i can just hand over my private code for you to reproduce. But please see if any advice could be given regardless.

If a reproducible example is ultimately required, It is not feasible given my priorities and timelines to create one this instant. It will require extensive work to make a reproducer as this will require debugging, sourcing the issue, and docker containers to be able to spin up a DNS for actually reproducing.

Versions

MacOS, 3.1.4 Cypress

[egucciar]

I was able to do some debugging with window.location. What i found was the ancestorOrigins was actually controlling where the localStorage was set. What i believe is happening is when Cypress reloads the window, it doesn't completely respect subdomains in the reload so it actually does not populate the ancestorOrigins correctly. This means if you have a test which switches baseUrls between different subdomains on the same domain, the localStorage will respect the ancestorOrigins prior to any visit. Preferably, setting the baseUrl will also update ancestorOrigins so that we do not need to resort to hacky work arounds to get tests to work.

Currently. i do not have a good solution or know if this is only happening in open mode. From what i saw, the ancestorOrigin is populated only after a hard-refresh caused by switching domain from localhost to app.dev.x.y.z on the first run. Since this is a different domain, i believe that it is updated correctly, however since we do not visit until the first setting is set, it fails at first. then upon refresh it is successful. It is to be assumed that if we have tests which run across multiple subdomains, our tests will fail as localStorage set by cypress will always honor the first subdomain visited.

[jennifer-shehane]

Hey @egucciar, can you provide the full test code? Include where you call the cy.visit() and where you invoke setMoverDemoBaseUrl. I've been unable to replicate this behavior with another multi-level subdomain example I have.

[egucciar]

I can do that but there's still multiple repositories invovled in our ecosystem including docker and private npm packages. I would still need to spend an hour or so throwing it together so you won't need any our our permissions to run. I'll be able to get to this in 1-2weeks. Thank you!

[jennifer-shehane]

Unfortunately we have to close this issue as there is not enough information to reproduce the problem.

Please comment in this issue with a reproducible example and we will reopen the issue. 🙏

[SeanTechArt]

I am running into this issue as well and created a very simple test to demonstrate what I am seeing. It does not seem possible to set a value into local storage for a site on a domain that is different from the baseUrl cypress started with until after cy.visit() is called.

With baseUrl set to anything other than github.com in cypress.json (example: "baseUrl": "http://localhost"):

it('setLocalStorage', () => {
        Cypress.config("baseUrl", "https://github.com");
        cy.log(Cypress.config().baseUrl);
        //cy.visit('');   // uncomment this to setItem on https://github.com
        window.localStorage.setItem('session_item', "Where will this go?");
    });

Without calling cy.visit() the item is set on http://localhost. If I call cy.visit() the item is set on https://github.com as viewed through Chrome's Application Storage - Local Storage.

[robinclaes]

Same issue here as in example above. Cypress doesn't target the right localStorage after setting baseUrl - it needs a visit.

Can this be reopened?

Thanks!

[jennifer-shehane]

@Sean-WadeAndWendy Yeah, there wouldn't be a window to set localStorage on if you have not called cy.visit().

window.localStorage will set to the current origin (which if you haven't visited will be the localhost url that the main window is on).

Also, if you want to set localStorage, you'll always want to call it off of the window object returned from Cypress like cy.window() or cy.visit().

We could maybe make this behavior clearer since it seems to have confused some people.

it('setLocalStorage', () => {
  // this is the Cypress window, at http://localhost:60354/__cypress/iframes/integration/spec.js
  window

  cy.visit('https://www.example.com').then((win) => {
    // this is the application under test window, https://www.example.com
    win
  })
});

If you want to set localStorage before the page has loaded, you'll want to set it in the onBeforeLoad of the cy.visit().

cy.visit('https://www.example.com', {
  onBeforeLoad: (win) => {
    // this is the application under test window, https://www.example.com
    win.localStorage.setItem('session_item', "abc123");
  }
})

Edited for clarity