How to use waitForRoute method in Cypress
Best JavaScript code snippet using cypress
literature.test.js
Source:literature.test.js 
...3 onlyOn('headless', () => {4 it('matches image snapshot', () => {5 cy.registerRoute();6 cy.visit('/literature?ui-citation-summary=true');7 cy.waitForRoute();8 cy.waitForSearchResults();9 cy.matchSnapshots('LiteratureSearch');10 });11 it('matches image snapshot for cataloger', () => {12 cy.login('cataloger');13 cy.registerRoute();14 cy.visit('/literature?ui-citation-summary=true');15 cy.waitForRoute();16 cy.waitForSearchResults();17 cy.matchSnapshots('LiteratureSearchCataloger');18 cy.logout();19 });20 it('matches image snapshot for searchRank', () => {21 cy.registerRoute();22 cy.visit('/literature?ui-citation-summary=true');23 cy.waitForRoute();24 cy.waitForSearchResults();25 cy.get('[data-test-id="literature-result-rank"]')26 .first()27 .should('have.text', '#1');28 });29 });30});31describe('Literature Detail', () => {32 onlyOn('headless', () => {33 it('matches image snapshot', () => {34 cy.registerRoute();35 cy.visit('/literature/1235543');36 cy.waitForRoute();37 cy.matchSnapshots('LiteratureDetail');38 });39 it('number of references per page', () => {40 cy.on('uncaught:exception', (err, runnable) => {41 return false;42 });43 cy.registerRoute();44 cy.visit('/literature/1374620');45 cy.waitForRoute();46 cy.get('[data-test-id="pagination-list"]').as('paginationList');47 cy.get('@paginationList')48 .find('.ant-list-items')49 .children()50 .as('referenceListItems');51 cy.get('@paginationList')52 .find('span[class="ant-select-selection-item"]')53 .as('selectionItem');54 cy.get('@referenceListItems').should('have.length', 25);55 cy.get('@selectionItem').should('be.visible');56 cy.get('@paginationList')57 .find('.ant-select-selection-search-input')58 .click();59 cy.get('@paginationList').find('div').contains('50 / page').click();60 cy.waitForRoute();61 cy.get('@referenceListItems').should('have.length', 50);62 cy.get('@selectionItem').should('be.visible');63 cy.get('a[href="/literature"]').click();64 cy.waitForRoute();65 cy.get('a[href="/literature/1598135"]').click();66 cy.waitForRoute();67 cy.get('@referenceListItems').should('have.length', 50);68 });69 });70});71describe.skip('Literature Editor', () => {72 beforeEach(() => {73 cy.login('cataloger');74 });75 afterEach(() => {76 cy.logout();77 });78 it('edits a literature record', () => {79 const RECORD_ID = '1787272';80 const API = '/api/**';81 const SAVE_CALLBACK = '/callback/workflows/**';82 const SCHEMAS = '/schemas/**';83 cy.registerRoute(API);84 cy.registerRoute(SCHEMAS);85 cy.visit(`/workflows/edit_article/${RECORD_ID}`);86 cy.waitForRoute(API);87 cy.waitForRoute(SCHEMAS);88 cy.registerRoute({89 url: SAVE_CALLBACK,90 method: 'POST',91 });92 cy.get('[data-path="/publication_info/0/journal_title"]').type(93 'Updated by Cypress Test{enter}'94 );95 cy.contains('button', 'Save').click();96 cy.waitForRoute(SAVE_CALLBACK);97 cy.waitForRoute(API);98 cy.get('.record-pub-info').should('contain.text', 'Updated by Cypress');99 });100});101describe('Literature Submission', () => {102 beforeEach(() => {103 cy.login('cataloger');104 });105 onlyOn('headless', () => {106 it('matches image snapshot for article form', () => {107 cy.visit('/submissions/literature');108 cy.selectLiteratureDocType('article');109 cy.matchSnapshots('ArticleSubmission', { skipMobile: true });110 });111 it('matches image snapshot for thesis form', () => {...
institutions.test.js
Source:institutions.test.js
...3 onlyOn('headless', () => {4 it('matches image snapshot', () => {5 cy.registerRoute();6 cy.visit('/institutions/902858?ui-citation-summary=true');7 cy.waitForRoute();8 cy.waitForSearchResults();9 cy.matchSnapshots('InstitutionDetail');10 });11 });12});13describe('Institutions Editor', () => {14 beforeEach(() => {15 cy.login('cataloger');16 });17 afterEach(() => {18 cy.logout();19 });20 it('edits an institution', () => {21 const RECORD_URL = '/institutions/902858';22 const RECORD_API = `/api${RECORD_URL}`;23 const API = '/api/**';24 cy.registerRoute(API);25 cy.visit(`/editor/record${RECORD_URL}`);26 cy.waitForRoute(API);27 cy.registerRoute({28 url: RECORD_API,29 method: 'PUT',30 });31 cy.get('[data-path="/legacy_ICN"]').type('Updated by Cypress Test{enter}');32 cy.contains('button', 'Save').click();33 cy.waitForRoute(RECORD_API);34 cy.visit(RECORD_URL);35 cy.waitForRoute(API);36 cy.get('h2').should('contain.text', 'Updated by Cypress');37 });38 it.only('does not save stale institution', () => {39 const RECORD_URL = '/institutions/902858';40 const RECORD_API = `/api${RECORD_URL}`;41 const RECORD_AND_SCHEMA_API = `/api/editor${RECORD_URL}`;42 const API = '/api/**';43 cy.registerRoute(RECORD_AND_SCHEMA_API);44 cy.visit(`/editor/record${RECORD_URL}`);45 cy.waitForRoute(RECORD_AND_SCHEMA_API).then(xhr => {46 // Do a PUT right after GETing record data to make it stale (by increasing the revision)47 cy48 .request({49 url: `${Cypress.env('inspirehep_url')}/api${RECORD_URL}`,50 method: 'PUT',51 body: xhr.response.body.record.metadata,52 headers: {53 "If-Match": '"0"'54 }55 })56 .its('status')57 .should('equal', 200);58 });59 cy.registerRoute({60 url: RECORD_API,61 method: 'PUT',62 });63 cy64 .get('[data-path="/legacy_ICN"]')65 .type('Stale Update by Cypress Test{enter}');66 cy.contains('button', 'Save').click();67 cy.waitForRoute(RECORD_API).then(xhr => {68 // Check Precondition for SAVE failed (revision does not match)69 cy70 .wrap(xhr)71 .its('status')72 .should('equal', 412);73 });74 cy.registerRoute(API);75 cy.visit(RECORD_URL);76 cy.waitForRoute(API);77 // Check if record is actually not modified just in case78 cy.get('h2').should('not.contain.text', 'Stale Update by Cypress Test');79 });...
client.js
Source:client.js
1window.emit = function emit() {2 if(window.callPhantom) {3 //we need comverts arguments object into a array to be stringified in phantomjs4 arguments = Array.prototype.slice.call(arguments, 0);5 payload = JSON.stringify(arguments);6 window.callPhantom(payload);7 }8};9window.waitForDOM = function(selector, callback) {10 var checker, observer, checkDOM;11 if(typeof selector === 'function') {12 checkDOM = selector;13 } else if(window.$ === undefined) {14 // You can use this without jQuery, but then you're limited to IDs or15 // passing a function16 if(selector[0] === '#') {17 checkDOM = function() {18 return document.getElementById(selector.substr(1)) !== null;19 }20 } else {21 throw new TypeError("When jQuery isn't installed, you're limited to selectors in the #id form. Or pass your own function!")22 }23 } else {24 checkDOM = function() {25 return $(selector).length !== 0;26 }27 }28 if(checkDOM()) {29 callback();30 } else if(window.MutationObserver !== undefined) {31 observer = new MutationObserver(function() {32 if(checkDOM()) {33 callback();34 observer.disconnect();35 }36 });37 observer.observe(document.body, {38 childList: true,39 subtree: true,40 attributes: true,41 characterData: false42 });43 } else {44 checker = function() {45 if(checkDOM()) {46 return callback();47 } else {48 return Meteor.setTimeout(checker, 50);49 }50 };51 checker();52 }53};54window.waitForRoute = function(path, callback) {55 if (!Router || !Router.current) {56 throw new Error('waitForRoute currently only works with iron router');57 }58 if (Router.current().path == path) {59 callback();60 }61 else {62 Deps.autorun(function() {63 if (Router.current().path == path) {64 this.stop();65 callback();66 }67 });68 Router.go(path);69 }...
adminUsers.js
Source:adminUsers.js
...22 'Admin user can create a new user': function (browser) {23 const adminUsersCreate = browser.page.adminUsersCreate();24 adminUsersCreate.login(credentials.admin).navigate()25 .waitForElementVisible('#app', 2000)26 .waitForRoute('admin_users_create')27 .setValue('@name', 'Gary the newcomer')28 .setValue('@email', 'newcomer@pillar.science')29 .click('@submit')30 .waitForRoute('admin_users')31 const adminUsers = browser.page.adminUsers();32 adminUsers.navigate()33 .waitForRoute('admin_users')34 adminUsers.expect.section('@users').to.be.visible.before(2000)35 adminUsers.section.users.expect.element('@gary').text.contains('Gary the newcomer')36 adminUsers.section.users.expect.element('@gary').text.contains('newcomer@pillar.science')37 browser.end()38 }...
join.js
Source:join.js
2 '@tags': ['active'],3 'Invalid token shows 404': function (browser) {4 const page = browser.page.joinInvitation();5 page.navigate('invalid-token')6 browser.waitForRoute('app_invitation')7 .expect.element('h1.title').text.to.equal('404 - Page not found').before(2000)8 browser.end()9 },10 'Valid token': function (browser) {11 const page = browser.page.joinInvitation();12 page.navigate('94a08da1fecbb6e8b46990538c7b50b2')13 browser.waitForRoute('app_invitation')14 page.expect.element('@subtitle').text.to.equal('Scott the invited')15 },16 'Password too short': function (browser) {17 const page = browser.page.joinInvitation();18 page.setValue('@password', 'short')19 page.click('@subtitle') // This will trigger blur on @password20 page.expect.element('@passwordMessage').text.to.contain('The password should be at least 8 characters').before(2000)21 },22 'Invalid confirm password': function (browser) {23 const page = browser.page.joinInvitation();24 page.setValue('@password', 'valid-password')25 .setValue('@passwordConfirm', 'invalid')26 .click('@submit')27 page.expect.element('@passwordConfirmMessage').text.to.equal('The confirmation password must match the password').before(2000)28 },29 'New user accepts invitation': function (browser) {30 const page = browser.page.joinInvitation();31 page.clearValue('@password')32 .setValue('@password', 'my-secure-password')33 .clearValue('@passwordConfirm')34 .setValue('@passwordConfirm', 'my-secure-password')35 .click('@submit')36 browser37 .pause(2000)38 .waitForRoute('home')39 .end()40 }...
adminTeams.js
Source:adminTeams.js
...19 'Admin user can create a new team': function (browser) {20 const adminTeamsCreate = browser.page.adminTeamsCreate();21 adminTeamsCreate.login(credentials.admin).navigate()22 .waitForElementVisible('#app', 2000)23 .waitForRoute('admin_teams_create')24 .setValue('@name', 'Nightwatch laboratories')25 .click('@submit')26 .waitForRoute('admin_teams')27 const adminTeams = browser.page.adminTeams();28 adminTeams.navigate()29 .waitForRoute('admin_teams')30 adminTeams.expect.section('@teams').to.be.visible.before(2000)31 adminTeams.section.teams.expect.element('@nightwatch').text.contains('Nightwatch laboratories')32 browser.end()33 }...
helpersRouter.js
Source:helpersRouter.js
2 var server = meteor();3 var client = browser(server);4 it('should change the route and load correct template', function () {5 return client6 .waitForRoute('/test')7 .waitForDOM('#testRouteDiv')8 .getText('#testRouteDiv')9 .then(function(res) {10 expect(res).to.contain('Testing Iron Router');11 });12 });13 it('should be ok if routing to the current route', function () {14 return client15 .waitForRoute('/test') 16 .getText('#testRouteDiv') // we shouldn't need to waitForDOM here17 .then(function(res) {18 expect(res).to.contain('Testing Iron Router');19 });20 });21 it('should be ok returning to previous route', function () {22 return client23 .waitForRoute('/')24 .waitForDOM('#getText')25 });26 it('should work with a specified timeout', function () {27 return client28 .waitForRoute('/test',3000)29 .waitForDOM('#testRouteDiv')30 });...
setup.js
Source:setup.js
...9//const waitForRoute = require('hfdm-private-tools').waitForRoute;10const waitForDeps = function(urls, done) {11 asyncEach(12 urls,13 (url, cb) => { waitForRoute(`${url}/health`, 20000, true, cb); },14 (err) => {15 if (err) {16 console.error(`Error: failed witing for: ${JSON.stringify(urls)}`);17 } else {18 console.log(`Done waiting for: ${JSON.stringify(urls)}`);19 }20 done(err);21 }22 );23};24require('./setup_common');25before(function(done) {26 done();27});
Using AI Code Generation
1describe('My First Test', function() {2 it('Does not do much!', function() {3 cy.contains('type').click()4 cy.url().should('include', '/commands/actions')5 cy.get('.action-email')6 .type('fake@email')7 .should('have.value', 'fake@email')8 })9})10describe('My First Test', function() {11 it('Does not do much!', function() {12 cy.contains('type').click()13 cy.url().should('include', '/commands/actions')14 cy.get('.action-email')15 .type('fake@email')16 .should('have.value', 'fake@email')17 cy.waitForRoute('POST', '/api/v1/users')18 })19})20describe('My First Test', function() {21 it('Does not do much!', function() {22 cy.contains('type').click()23 cy.url().should('include', '/commands/actions')24 cy.get('.action-email')25 .type('fake@email')26 .should('have.value', 'fake@email')27 cy.waitForRoute('POST', '/api/v1/users', {28 })29 })30})31describe('My First Test', function() {32 it('Does not do much!', function() {33 cy.contains('type').click()34 cy.url().should('include', '/commands/actions')35 cy.get('.action-email')36 .type('fake@email')37 .should('have.value', 'fake@email')38 cy.waitForRoute('POST', '/api/v1/users', {39 }, (route) => {
Using AI Code Generation
1describe('My First Test', () => {2 it('Visits the Kitchen Sink', () => {3 cy.contains('type').click()4 cy.url().should('include', '/commands/actions')5 cy.get('.action-email')6 .type('fake@email')7 .should('have.value', 'fake@email')8 })9})10describe('My First Test', () => {11 it('Visits the Kitchen Sink', () => {12 cy.contains('type').click()13 cy.url().should('include', '/commands/actions')14 cy.get('.action-email')15 .type('fake@email')16 .should('have.value', 'fake@email')17 })18})19describe('My First Test', () => {20 it('Visits the Kitchen Sink', () => {21 cy.contains('type').click()22 cy.url().should('include', '/commands/actions')23 cy.get('.action-email')24 .type('fake@email')25 .should('have.value', 'fake@email')26 })27})28describe('My First Test', () => {29 it('Visits the Kitchen Sink', () => {30 cy.contains('type').click()31 cy.url().should('include', '/commands/actions')32 cy.get('.action-email')33 .type('fake@email')34 .should('have.value', 'fake@email')35 })36})37describe('My First Test', () => {38 it('Visits the Kitchen Sink', () => {39 cy.contains('type').click()40 cy.url().should('include', '/commands/actions')41 cy.get('.action-email')42 .type('fake@email')43 .should('have.value', 'fake@email')44 })45})46describe('My First Test', () => {47 it('Visits the Kitchen Sink', ()
Using AI Code Generation
1describe('My First Test', () => {2 it('Does not do much!', () => {3 cy.url().should('include', 'example.cypress.io');4 cy.get('.home-list > :nth-child(1) > a').click();5 cy.url().should('include', 'commands/actions');6 cy.get('.action-email')7 .type('
Using AI Code Generation
1describe("Testing the route", () => {2 it("should wait for the route", () => {3 cy.server();4 cy.route("POST", "/comments").as("getComment");5 cy.get(".network-post").click();6 cy.wait("@getComment").its("response.statusCode").should("eq", 201);7 });8});9### 5.5.5. Using cy.intercept()10describe("Testing the route", () => {11 it("should wait for the route", () => {12 cy.intercept("POST", "/comments").as("getComment");13 cy.get(".network-post").click();14 cy.wait("@getComment").its("response.statusCode").should("eq", 201);15 });16});17### 5.5.6. Using cy.route2()18describe("Testing the route", () => {19 it("should wait for the route", () => {20 cy.route2("POST", "/comments").as("getComment");21 cy.get(".network-post").click();22 cy.wait("@getComment").its("response.statusCode").should("eq", 201);23 });24});25### 5.6.1. Using cy.server() and cy.route()26describe("Testing the network request", () => {27 it("should wait for
Using AI Code Generation
1describe('My First Test', function() {2 it('Does not do much!', function() {3 cy.get('a[href="/about"]').click()4 cy.url().should('include', '/about')5 cy.get('a[href="/"]').click()6 cy.url().should('not.include', '/about')7 })8})
Using AI Code Generation
1Cypress.Commands.add('waitForRoute', (route) => {2 cy.window().then((win) => {3 return new Cypress.Promise((resolve, reject) => {4 .getTestability(win.document.querySelector('app-root'))5 .whenStable(() => {6 cy.wait(500);7 resolve();8 });9 });10 });11});12Cypress.Commands.add('waitForRoute', (route) => {13 cy.window().then((win) => {14 return new Cypress.Promise((resolve, reject) => {15 .getTestability(win.document.querySelector('app-root'))16 .whenStable(() => {17 cy.wait(500);18 resolve();19 });20 });21 });22});23Cypress.Commands.add('waitForRoute', (route) => {24 cy.window().then((win) => {25 return new Cypress.Promise((resolve, reject) => {26 .getTestability(win.document.querySelector('app-root'))27 .whenStable(() => {28 cy.wait(500);29 resolve();30 });31 });32 });33});34Cypress.Commands.add('waitForRoute', (route) => {35 cy.window().then((win) => {36 return new Cypress.Promise((resolve, reject) => {37 .getTestability(win.document.querySelector('app-root'))38 .whenStable(() => {39 cy.wait(500);40 resolve();41 });42 });43 });44});45Cypress.Commands.add('waitForRoute', (route) => {46 cy.window().then((win) => {47 return new Cypress.Promise((resolve, reject) => {48 .getTestability(win.document.querySelector('app-root'))49 .whenStable(() => {50 cy.wait(500);51 resolve();52 });53 });54 });55});
Using AI Code Generation
1describe('My First Test', function() {2 it('Does not do much!', function() {3 cy.get('button').click()4 cy.url().should('include', '/result')5 cy.get('h1').should('have.text', 'Result')6 })7 })
Using AI Code Generation
1Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {2 cy.server()3 cy.route(path).as('route')4 cy.wait('@route', { timeout: timeout })5})6Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {7 cy.server()8 cy.route(path).as('route')9 cy.wait('@route', { timeout: timeout })10})11Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {12 cy.server()13 cy.route(path).as('route')14 cy.wait('@route', { timeout: timeout })15})16Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {17 cy.server()18 cy.route(path).as('route')19 cy.wait('@route', { timeout: timeout })20})21Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {22 cy.server()23 cy.route(path).as('route')24 cy.wait('@route', { timeout: timeout })25})26Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {27 cy.server()28 cy.route(path).as('route')29 cy.wait('@route', { timeout: timeout })30})31Cypress.Commands.add('waitForRoute', (path, timeout = 5000) => {32 cy.server()33 cy.route(path).as('route')34 cy.wait('@route', { timeout: timeout })35})
Using AI Code Generation
1describe('Testing the route', () => {2 it('Should go to the route', () => {3 cy.contains('type').click();4 cy.url().should('include', '/commands/actions');5 cy.get('.action-email')6 .type('
Cypress Tutorial
Cypress is a renowned Javascript-based open-source, easy-to-use end-to-end testing framework primarily used for testing web applications. Cypress is a relatively new player in the automation testing space and has been gaining much traction lately, as evidenced by the number of Forks (2.7K) and Stars (42.1K) for the project. LambdaTest’s Cypress Tutorial covers step-by-step guides that will help you learn from the basics till you run automation tests on LambdaTest.
Chapters:
- What is Cypress? -
- Why Cypress? - Learn why Cypress might be a good choice for testing your web applications.
- Features of Cypress Testing - Learn about features that make Cypress a powerful and flexible tool for testing web applications.
- Cypress Drawbacks - Although Cypress has many strengths, it has a few limitations that you should be aware of.
- Cypress Architecture - Learn more about Cypress architecture and how it is designed to be run directly in the browser, i.e., it does not have any additional servers.
- Browsers Supported by Cypress - Cypress is built on top of the Electron browser, supporting all modern web browsers. Learn browsers that support Cypress.
- Selenium vs Cypress: A Detailed Comparison - Compare and explore some key differences in terms of their design and features.
- Cypress Learning: Best Practices - Take a deep dive into some of the best practices you should use to avoid anti-patterns in your automation tests.
- How To Run Cypress Tests on LambdaTest? - Set up a LambdaTest account, and now you are all set to learn how to run Cypress tests.
Certification
You can elevate your expertise with end-to-end testing using the Cypress automation framework and stay one step ahead in your career by earning a Cypress certification. Check out our Cypress 101 Certification.
YouTube
Watch this 3 hours of complete tutorial to learn the basics of Cypress and various Cypress commands with the Cypress testing at LambdaTest.
Run Cypress automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
