javascript - How to assert page doesnt reload with Cypress - Stack Overflow

admin管理员组

文章数量:1023153

I am running a test that assures a page does not reload when a button is clicked. So far, I have not found the best way to assert on this. I initially thought to create a route and wait for the xhr request that I don't want to happen, and if it happens, to fail the test. However, there does not appear to be a way to catch an error from a cy.wait() which makes it impossible for me to pass the test once the timeout occurs. My current solution is to ensure that the href for the given element starts with "#", but that seems to have the shorting of someone potentially attaching an event to it that would in-fact reload the page and it would not be caught by my test.

I am running a test that assures a page does not reload when a button is clicked. So far, I have not found the best way to assert on this. I initially thought to create a route and wait for the xhr request that I don't want to happen, and if it happens, to fail the test. However, there does not appear to be a way to catch an error from a cy.wait() which makes it impossible for me to pass the test once the timeout occurs. My current solution is to ensure that the href for the given element starts with "#", but that seems to have the shorting of someone potentially attaching an event to it that would in-fact reload the page and it would not be caught by my test.

• javascript
• testing
• cypress

Share Improve this question Follow asked Dec 24, 2018 at 0:03 displayName0101displayName0101 5111 silver badge77 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You could use the Navigation Timing API:

In your test you will need to assert something like:

expect(performance.navigation.type).to.equal(performance.navigation.TYPE_RELOAD);

Using A Flag on the Window Object

In my tests, I used the method described in Detect page reload from Cypress test by adding a new property shouldNotReloadOnFirefox to the window object, then cheking it's still present (i.e. no reload):

// arrange
cy.window().then((win) => (win.shouldNotReloadOnFirefox = true));

// act 
cy.whateverYouAreTesting()

// assert
cy.window().should('have.prop', 'shouldNotReloadOnFirefox');

Using Browser API

As of 2021-05-27

performance.navigation was deprecated.

You should use PerformanceNavigationTiming instead and the getEntriesByType method:

expect(performance.getEntriesByType('navigation')[0].type).to.equal(
  'reload'
);

I am running a test that assures a page does not reload when a button is clicked. So far, I have not found the best way to assert on this. I initially thought to create a route and wait for the xhr request that I don't want to happen, and if it happens, to fail the test. However, there does not appear to be a way to catch an error from a cy.wait() which makes it impossible for me to pass the test once the timeout occurs. My current solution is to ensure that the href for the given element starts with "#", but that seems to have the shorting of someone potentially attaching an event to it that would in-fact reload the page and it would not be caught by my test.

I am running a test that assures a page does not reload when a button is clicked. So far, I have not found the best way to assert on this. I initially thought to create a route and wait for the xhr request that I don't want to happen, and if it happens, to fail the test. However, there does not appear to be a way to catch an error from a cy.wait() which makes it impossible for me to pass the test once the timeout occurs. My current solution is to ensure that the href for the given element starts with "#", but that seems to have the shorting of someone potentially attaching an event to it that would in-fact reload the page and it would not be caught by my test.

• javascript
• testing
• cypress

Share Improve this question Follow asked Dec 24, 2018 at 0:03 displayName0101displayName0101 5111 silver badge77 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You could use the Navigation Timing API:

In your test you will need to assert something like:

expect(performance.navigation.type).to.equal(performance.navigation.TYPE_RELOAD);

Using A Flag on the Window Object

In my tests, I used the method described in Detect page reload from Cypress test by adding a new property shouldNotReloadOnFirefox to the window object, then cheking it's still present (i.e. no reload):

// arrange
cy.window().then((win) => (win.shouldNotReloadOnFirefox = true));

// act 
cy.whateverYouAreTesting()

// assert
cy.window().should('have.prop', 'shouldNotReloadOnFirefox');

Using Browser API

As of 2021-05-27

performance.navigation was deprecated.

You should use PerformanceNavigationTiming instead and the getEntriesByType method:

expect(performance.getEntriesByType('navigation')[0].type).to.equal(
  'reload'
);

本文标签： javascriptHow to assert page doesnt reload with CypressStack Overflow