typescript - Kan inte få cypress nya plats/href efter sidladdning

Jag försöker köra detta test på Cypress:

  1. hämta URL-parameter/fråga från den aktuella sidan t.ex.: localhost:3000/?redirect_link=X

  2. Klicka på hoppa över-knappen på den aktuella sidan

  3. Omdirigerar till en annan sida (det är en sida, inte en komponent, så den är extern/tvärs över domäner)

  4. Platsen ska vara lika med X

Men assert på steg 4 misslyckas, jag vill testa om den nya omdirigerade sidan är lika med den som passerades i query string-parametern.

Jag gör:

  beforeEach(() => {
    cy.visit('/?redirect_link=X')
  })

  it('it skips and then redirects to another page', () => {
    cy.location().then((local) => {
      const arr = local.search.split('?')[1].split('&')
      const paramObj = {} as any
      arr.forEach((param) => {
        const [key, value] = param.split('=')
        if (key === 'redirect_link') {
          paramObj[key] = value
          cy.wrap(paramObj.redirect_link).as('redirect_link')
        }
      })
    })

    cy.get('[data-testid="button"]').click()

    cy.get('@redirect_link').then((redirect_link: string) => {
        cy.location('href').should('eq', '{PAGE X HERE}')
      })
    })

I cypress körs detta "should" tidigare än förväntat:

location
wrap redirect link
get button
click
location href
expected 'LOCALHOST' to equal PAGE X

Om jag sätter wait(10000) eller timeout i location, efter att ha laddat PAGE X, ändras värdet på LOCALHOST till null i location href-stadiet medan väntan körs, vilket misslyckas efter att sidan laddats: assert expected null to PAGE X

Jag försökte också att använda:

cy.url().then(() => )  // same return since it's same to cy location href
cy.on('window:load') // returns null when try to get the url
cy.on('url:changed) // returns null when try to get the url

Försökte sätta timeout på allt i testet, sedan efter klicket men det fungerar fortfarande inte.

Redigera :

När jag gör:

cy.get('@redirect_link').then((redirect_link: string) => {
   cy.location('href').then((a) => console.log(a))
})
// it returns the current location href

wait(10000)
cy.get('@redirect_link').then((redirect_link: string) => {
   cy.location('href').then((a) => console.log(a))
})
// it returns null

Eftersom det är korsdomän, försökte jag också att sätta en händelselyssnare på fönsterändring, men det visar inte PAGE X-länken i något fält (väg: null, målplats: null)

    cy.on('window:before:unload', (e) => {
      console.log(e)
    })
   // doesn't return any page X link

Svar #1

Eftersom omdirigeringen är till en tvärdomän-plats, kommer du måste använda cy.origin()-omslutning för att verifiera något om den nya domänen. Att vänta kommer inte att vara tillräckligt.

Problemet då är att den nya domänen måste hårdkodas, den kan inte beräknas från de gamla domänparametrarna som du försöker göra i början av testet.

Till exempel, detta fungerar

const redirect = 'http://example.com'

it('it redirects to another page', () => {

  cy.visit(`/?redirect_link=${redirect}`)

  cy.get('[data-testid="button"]').click()

  // pass the expected url string in to the sandbox
  cy.origin(redirect, { args: {redirect} }, ({redirect}) => {
    cy.location()
      .should('eq', redirect)
  })
})

Du kan sedan testa platsparametrarna separat, utan att göra omdirigeringen, på detta sätt

const redirect = 'http://example.com/'

it('it has the redirect in the location parameter', () => {

  cy.visit(`/?redirect_link=${redirect}`)

  cy.location().then((local) => {
    const arr = local.search.split('?')[1].split('&')
    const paramObj = {} 
    arr.forEach((param) => {
      const [key, value] = param.split('=')
      if (key === 'redirect_link') {
        paramObj[key] = value
        cy.wrap(paramObj.redirect_link).as('redirect_link')
      }
    })
  })

  cy.get('@redirect_link')
    .should('eq', redirect)
})

Relaterade artiklar