question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

History navigate method

See original GitHub issue

Description

cypress.visit reset state between pages, but if your application is isomorphic (universal), you should test application in two modes (prerendered and SPA). It’s painful if your work with stubbed API, because cypress can stub only xhr requests. In this situation, i create blank page that contains only assets, wait until application will be ready for SPA mode, and navigate to test target page.

In this situation will be nice if cypress expose cy.navigate method that just write record in history.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:11 (7 by maintainers)

github_iconTop GitHub Comments

8reactions
brian-manncommented, Jul 19, 2018

@vjpr Cypress is just javascript - you have native access to everything. You don’t ever need Cypress to create special commands in order to interact with native JS API’s.

For instance… if you wanted to invoke pushState

cy.window().then((win) => {
  win.history.pushState(...)
})

// or even more terse

cy.window().its('history').invoke('pushState', ...)

Nothing special is needed. You can interact with anything you want natively.

7reactions
KhodeNcommented, Jun 20, 2018

Most of routing systems, e.g. stock Angular routing, is based on HistoryAPI feature. Clicking on link a[href] is captured and translated to pushState of HistoryAPI.

So, URL of page changes without page reloading. It’s very usefull for SPA.

cy.visit is the functional equivalent to opening a new tab in your browser and typing in a fresh url

Opening new tab is not common way to use SPA. Navigation in SPA is always programatic.

I think, it would be great, if you can extend visit with option like state:true that will be translated to pushState if a “previous” page has already opened.

Read more comments on GitHub >

github_iconTop Results From Across the Web

History API - MDN Web Docs - Mozilla
Chrome Edge Firefox History Full support. Chrome1. Toggle history Full support. Edge12. Toggle history Full sup... back Full support. Chrome1. Toggle history Full support. Edge12....
Read more >
History go() Method - W3Schools
The history.go() method loads a URL (page) from the history list. The history.go() method only works if the page exist in the history...
Read more >
How to Navigate using History Push in React Router - Sabe.io
The history.push function takes in the path you want to navigate to, and then and state that you want to pass along. Let's...
Read more >
Programmatic Navigation - Vue Router
This method pushes a new entry into the history stack, so when the user clicks the browser back button they will be taken...
Read more >
Using the Browser History API - Level Up Coding
To navigate back and forth between pages, we can use the History API that comes with most modern browsers. We can use the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found