javascript - How Can I Test A File Download Using Cypress When Running In Chrome - Stack Overflow

admin管理员组

文章数量:1289829

I have the following test that needs to verify that clicking a link downloads a PDF. This is especially important as we are using Gatsby, which in turn uses Reach Router's Link Component, and it is relatively easy to misconfigure things so that the router takes over the link and navigates to a 404 page instead of initiating a download.

describe.skip(`Downloads`, () => {
  it(`Downloads the expected file`, () => {
    cy.visit(pagePath)
    cy.getByHref(downloadPath)
      .should(`have.attr`, `target`, `_blank`)
      .click()
    cy.location(`pathname`).should(`eq`, pagePath)
  })
})

While this isn't perfect, it does at least check that there is no navigation as a result of clicking the link.

The problem is that when running this test using cy run, which runs the tests in Chrome, the test hangs, due to Chrome's download dialogue.

How can I prevent the test from hanging?

Note that the downloadPath resolves to a pdf in the static directory, for example /static/example.pdf. There is no server ponent.

Also note that this is a different question to: How can I use Cypress.io to assert that a file download has been initiated without actually downloading?

I have the following test that needs to verify that clicking a link downloads a PDF. This is especially important as we are using Gatsby, which in turn uses Reach Router's Link Component, and it is relatively easy to misconfigure things so that the router takes over the link and navigates to a 404 page instead of initiating a download.

describe.skip(`Downloads`, () => {
  it(`Downloads the expected file`, () => {
    cy.visit(pagePath)
    cy.getByHref(downloadPath)
      .should(`have.attr`, `target`, `_blank`)
      .click()
    cy.location(`pathname`).should(`eq`, pagePath)
  })
})

While this isn't perfect, it does at least check that there is no navigation as a result of clicking the link.

The problem is that when running this test using cy run, which runs the tests in Chrome, the test hangs, due to Chrome's download dialogue.

How can I prevent the test from hanging?

Note that the downloadPath resolves to a pdf in the static directory, for example /static/example.pdf. There is no server ponent.

Also note that this is a different question to: How can I use Cypress.io to assert that a file download has been initiated without actually downloading?

• javascript
• google-chrome
• testing
• download
• cypress

Share Improve this question Follow edited May 2, 2019 at 17:20 Undistraction asked Apr 24, 2019 at 10:09 UndistractionUndistraction 43.4k6262 gold badges205205 silver badges336336 bronze badges 4

• Have you checked this issue ? I think it is exactly what you are describing github./cypress-io/cypress/issues/433 – Apolo Commented May 3, 2019 at 8:05
• 1 Also, this is being worked on: github./cypress-io/cypress/issues/311 – Apolo Commented May 3, 2019 at 8:14
• May be this can help dev.to/viveknayyar/… – VivekN Commented Apr 8, 2020 at 23:15
• @VivekN Thanks. I hadn't considered checking the file, but this relies on using wait with a fixed time which is a recipe for flaky tests in my experience. – Undistraction Commented Apr 9, 2020 at 8:15

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 1 +50

Actually I searched alot about it and found that It is not possible to run tests in headless mode with browser extensions installed, because the only supported browser in headless mode is Electron, and Electron doesn't support extensions as stated in the documentation.

Running headless Chrome is not supported yet. See this issue: #488 https://github./cypress-io/cypress/issues/488

And this is a an issue not so old it was tagged in Feb 2019

https://github./cypress-io/cypress/issues/832 https://github./cypress-io/cypress/issues/1235

There are a lot of ways to test this, so it depends. You’ll need to be aware of what actually causes the download, then think of a way to test that mechanism.

If your server sends specific disposition headers which cause a browser to prompt for download, you can figure out what URL this request is made to, and use cy.request() to hit that directly. Then you can test that the server send the right response headers.

If it’s an anchor that initiates the download, you could test that it has the right href property. As long as you can verify that clicking the button is going to make the right HTTP request, there’s nothing else to test for.

In the end, it’s up to you to know your implementation and to test enough to cover everything.

You can prevent the test from hanging by disabling the dialog asking where to save the file. Once you do that chrome will happily download your file and Cypress can continue running your test.

In chrome go to settings->Advanced->Downloads->Ask where to save each file before downloading and make sure it is off.

There are more plicated solutions in the links Apolo provided but this is a quick workaround.

本文标签： javascriptHow Can I Test A File Download Using Cypress When Running In ChromeStack Overflow