user2367924
user2367924

Reputation: 75

Cypress; After adding an MP4 to a modal box, the "add" button won't dismiss the modal box

I updated this question. What I'm trying to do:

  1. Click add video, modal box appears.
  2. Select MP4 and add MP4 to the modal box.
  3. Click the "Add" button, dismiss modal box and continue test.

Issue: after Cypress adds the MP4, cypress tries to do a .click() on the "add" button. But for an unknown reason to me, the "add" button does not dismiss the modal box, blocking part of the page, Cypress can't verify the next step, causing my test to fail.

newStoryPage.getAddVideoToStory().click({force: true}) //this clicks the add video button. 
cy.wait(2000)
//here I add the video to the modal box: 
cy.fixture('sample-mp4.mp4','binary').then(mp4 => {
  const files = [
  { fileName: 'sample-mp4.mp4', fileContent: mp4, mimeType: 'video/mp4', encoding: 'utf8' }]
   cy.wait(2000)
 newStoryPage.getDragAndDropFiles().attachFile(files, {subjectType: 'drag-n-drop', events: ['dragenter', 'drop'] })
})

//here I click the add button, which won't do anything
newStoryPage.getAddButton().click()

Upvotes: 0

Views: 197

Answers (1)

Narretz
Narretz

Reputation: 4993

This simply isn't possible. You can't test a real file picker with Cypress. The file picker is part of the operating system user interface, which can't be tested with Cypress / isn't accessible to the browser. You just have to "trust" that the OS is doing the right thing, and test that your app is doing the right thing when presented with a File.

Upvotes: 2

Related Questions