Replace "cypress-file-upload" with cypress selectFile

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

cypress/integration/fileUpload.spec.ts

@@ -9,6 +9,7 @@ const imageUrl = 'http://example.com/non-existing.png'
 describe('File upload', () => {
   beforeEach(() => {
     cy.visitTestNote()
+    cy.fixture('demo.png').as('demoImage')
   })
 
   it("doesn't prevent drag'n'drop of plain text", () => {
@@ -41,10 +42,14 @@ describe('File upload', () => {
     })
     it('via button', () => {
       cy.getByCypressId('editor-toolbar-upload-image-button').should('be.visible')
-      cy.getByCypressId('editor-toolbar-upload-image-input').attachFixture({
-        filePath: 'demo.png',
-        mimeType: 'image/png'
-      })
+      cy.getByCypressId('editor-toolbar-upload-image-input').selectFile(
+        {
+          contents: '@demoImage',
+          fileName: 'demo.png',
+          mimeType: 'image/png'
+        },
+        { force: true }
+      )
       cy.get('.CodeMirror-activeline').contains(`![](${imageUrl})`)
     })
 
@@ -62,17 +67,15 @@ describe('File upload', () => {
     })
 
     it('via drag and drop', () => {
-      cy.fixture('demo.png').then((image: string) => {
-        const dropEvent = {
-          dataTransfer: {
-            files: [Cypress.Blob.base64StringToBlob(image, 'image/png')],
-            effectAllowed: 'uninitialized'
-          }
-        }
-        cy.get('.CodeMirror-scroll').trigger('dragenter', dropEvent)
-        cy.get('.CodeMirror-scroll').trigger('drop', dropEvent)
-        cy.get('.CodeMirror-activeline').contains(`![](${imageUrl})`)
-      })
+      cy.get('.CodeMirror-scroll').selectFile(
+        {
+          contents: '@demoImage',
+          fileName: 'demo.png',
+          mimeType: 'image/png'
+        },
+        { action: 'drag-drop', force: true }
+      )
+      cy.get('.CodeMirror-activeline').contains(`![](${imageUrl})`)
     })
   })
 
@@ -87,10 +90,14 @@ describe('File upload', () => {
       }
     )
     cy.getByCypressId('editor-toolbar-upload-image-button').should('be.visible')
-    cy.getByCypressId('editor-toolbar-upload-image-input').attachFixture({
-      filePath: 'demo.png',
-      mimeType: 'image/png'
-    })
+    cy.getByCypressId('editor-toolbar-upload-image-input').selectFile(
+      {
+        contents: '@demoImage',
+        fileName: 'demo.png',
+        mimeType: 'image/png'
+      },
+      { force: true }
+    )
     cy.get('.CodeMirror-activeline').contains('![upload of demo.png failed]()')
   })
 

cypress/integration/history.spec.ts

@@ -133,39 +133,58 @@ describe('History', () => {
       })
       cy.visitHistory()
       cy.logout()
+
+      cy.fixture('history.json').as('history')
+      cy.fixture('history-2.json').as('history-2')
+      cy.fixture('invalid-history.txt').as('invalid-history')
     })
 
     it('works with valid file', () => {
       cy.getByCypressId('import-history-file-button').should('be.visible')
-      cy.getByCypressId('import-history-file-input').attachFixture({
-        filePath: 'history.json',
-        mimeType: 'application/json'
-      })
+      cy.getByCypressId('import-history-file-input').selectFile(
+        {
+          contents: '@history',
+          fileName: 'history.json',
+          mimeType: 'application/json'
+        },
+        { force: true }
+      )
       cy.getByCypressId('history-entry-title').should('have.length', 1).contains('cy-Test')
     })
 
     it('fails on invalid file', () => {
       cy.getByCypressId('import-history-file-button').should('be.visible')
-      cy.getByCypressId('import-history-file-input').attachFixture({
-        filePath: 'invalid-history.txt',
-        mimeType: 'text/plain'
-      })
+      cy.getByCypressId('import-history-file-input').selectFile(
+        {
+          contents: '@invalid-history',
+          fileName: 'invalid-history.txt',
+          mimeType: 'text/plain'
+        },
+        { force: true }
+      )
       cy.getByCypressId('notification-toast').should('be.visible')
     })
 
     it('works when selecting two files with the same name', () => {
       cy.getByCypressId('import-history-file-button').should('be.visible')
-      cy.getByCypressId('import-history-file-input').attachFixture({
-        filePath: 'history.json',
-        mimeType: 'application/json'
-      })
+      cy.getByCypressId('import-history-file-input').selectFile(
+        {
+          contents: '@history',
+          fileName: 'history.json',
+          mimeType: 'application/json'
+        },
+        { force: true }
+      )
       cy.getByCypressId('history-entry-title').should('have.length', 1).contains('cy-Test')
       cy.getByCypressId('import-history-file-button').should('be.visible')
-      cy.getByCypressId('import-history-file-input').attachFixture({
-        filePath: 'history-2.json',
-        fileName: 'history.json',
-        mimeType: 'application/json'
-      })
+      cy.getByCypressId('import-history-file-input').selectFile(
+        {
+          contents: '@history-2',
+          fileName: 'history.json',
+          mimeType: 'application/json'
+        },
+        { force: true }
+      )
       cy.getByCypressId('history-entry-title').should('have.length', 2).contains('cy-Test2')
     })
   })

cypress/integration/import.spec.ts

@@ -7,15 +7,20 @@
 describe('Import markdown file', () => {
   beforeEach(() => {
     cy.visitTestNote()
+    cy.fixture('import.md').as('import')
   })
 
   it('import on blank note', () => {
     cy.getByCypressId('menu-import').click()
     cy.getByCypressId('menu-import-markdown-button').should('be.visible')
-    cy.getByCypressId('menu-import-markdown-input').attachFixture({
-      filePath: 'import.md',
-      mimeType: 'text/markdown'
-    })
+    cy.getByCypressId('menu-import-markdown-input').selectFile(
+      {
+        contents: '@import',
+        fileName: 'import.md',
+        mimeType: 'text/markdown'
+      },
+      { force: true }
+    )
     cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span').should(
       'have.text',
       '# Some short import test file'
@@ -27,10 +32,14 @@ describe('Import markdown file', () => {
     cy.setCodemirrorContent('test\nabc')
     cy.getByCypressId('menu-import').click()
     cy.getByCypressId('menu-import-markdown-button').should('be.visible')
-    cy.getByCypressId('menu-import-markdown-input').attachFixture({
-      filePath: 'import.md',
-      mimeType: 'text/markdown'
-    })
+    cy.getByCypressId('menu-import-markdown-input').selectFile(
+      {
+        contents: '@import',
+        fileName: 'import.md',
+        mimeType: 'text/markdown'
+      },
+      { force: true }
+    )
     cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span').should('have.text', 'test')
     cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span > span').should('have.text', 'abc')
     cy.get('.CodeMirror-code > div:nth-of-type(3) > .CodeMirror-line > span > span').should(

cypress/support/index.ts

@@ -20,7 +20,6 @@
 // ***********************************************************
 
 import 'cypress-commands'
-import 'cypress-file-upload'
 import './checkLinks'
 import './config'
 import './fill'

package.json

@@ -134,7 +134,6 @@
     "@typescript-eslint/parser": "5.10.2",
     "cypress": "9.4.1",
     "cypress-commands": "2.0.1",
-    "cypress-file-upload": "6.0.0-beta.0",
     "eslint": "8.8.0",
     "eslint-config-next": "12.0.10",
     "eslint-config-prettier": "8.3.0",

yarn.lock

@@ -1714,7 +1714,6 @@ __metadata:
     cross-env: 7.0.3
     cypress: 9.4.1
     cypress-commands: 2.0.1
-    cypress-file-upload: 6.0.0-beta.0
     d3-graphviz: 3.2.0
     diff: 5.0.0
     dompurify: 2.3.5
@@ -6867,15 +6866,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"cypress-file-upload@npm:6.0.0-beta.0":
-  version: 6.0.0-beta.0
-  resolution: "cypress-file-upload@npm:6.0.0-beta.0"
-  peerDependencies:
-    cypress: ">=6.0.0"
-  checksum: 3cb312ab0de1b9501c2dfef2ca45974a168b3ae388213d82ba31f562be65e67c7b145e6066dca29f84dae68d854465c65568e94213b9228fade7d1738643fb25
-  languageName: node
-  linkType: hard
-
 "cypress@npm:9.4.1":
   version: 9.4.1
   resolution: "cypress@npm:9.4.1"