feat: Retain fileName when working with aliased fixtures and files (c…

…ypress-io#19820)

* Retain fileName when working with aliased fixtures and files
* Move to getter/setter for fileName attribute

packages/driver/cypress/integration/commands/actions/selectFile_spec.js

@@ -218,6 +218,10 @@ describe('src/cy/commands/actions/selectFile', () => {
         cy.fixture('valid.json').as('myFixture')
 
         cy.get('#basic').selectFile('@myFixture')
+        .then((input) => {
+          expect(input[0].files[0].name).to.eq('valid.json')
+          expect(input[0].files[0].type).to.eq('application/json')
+        })
         .then(getFileContents)
         .then((contents) => {
           // Because json files are loaded as objects, they get reencoded before
@@ -232,6 +236,10 @@ describe('src/cy/commands/actions/selectFile', () => {
         cy.readFile('cypress/fixtures/valid.json', { encoding: null }).as('myFile')
 
         cy.get('#basic').selectFile('@myFile')
+        .then((input) => {
+          expect(input[0].files[0].name).to.eq('valid.json')
+          expect(input[0].files[0].type).to.eq('application/json')
+        })
         .then(getFileContents)
         .then((contents) => {
           expect(contents[0]).to.eql(validJsonString)
@@ -251,6 +259,32 @@ describe('src/cy/commands/actions/selectFile', () => {
         .then((input) => {
           expect(input[0].files[0].name).to.eq('valid.json')
           expect(input[0].files[1].name).to.eq('app.js')
+          expect(input[0].files[0].type).to.eq('application/json')
+          expect(input[0].files[1].type).to.eq('application/javascript')
+        })
+      })
+
+      it('allows users to override the inferred filenames and mimetypes', () => {
+        cy.fixture('valid.json').as('myFixture')
+
+        cy.get('#multiple').selectFile([{
+          contents: 'cypress/fixtures/valid.json',
+          fileName: '1.png',
+        },
+        {
+          contents: '@myFixture',
+          fileName: '2.png',
+          mimeType: 'text/plain',
+        }])
+        .then((input) => {
+          expect(input[0].files[0].name).to.eq('1.png')
+          expect(input[0].files[1].name).to.eq('2.png')
+          // The mimetype should be inferred from the user-supplied filename,
+          // rather than the actual path
+          expect(input[0].files[0].type).to.eq('image/png')
+          // And ever if they supply a filename, explicit mimetype
+          // should always take precedent.
+          expect(input[0].files[1].type).to.eq('text/plain')
         })
       })
     })

packages/driver/src/cy/commands/actions/selectFile.ts

@@ -142,6 +142,7 @@ export default (Commands, Cypress, cy, state, config) => {
     }
 
     return {
+      fileName: aliasObj.fileName,
       ...file,
       contents: aliasObj.subject,
     }

packages/driver/src/cy/commands/aliasing.ts

@@ -42,7 +42,9 @@ export default function (Commands, Cypress, cy, state) {
         }
       }
 
-      cy.addAlias(ctx, { subject, command: prev, alias: str })
+      const fileName = prev.get('fileName')
+
+      cy.addAlias(ctx, { subject, command: prev, alias: str, fileName })
 
       return subject
     },

packages/driver/src/cy/commands/files.ts

@@ -1,9 +1,10 @@
 // @ts-nocheck
 import _ from 'lodash'
+import { basename } from 'path'
 
 import $errUtils from '../../cypress/error_utils'
 
-export default (Commands, Cypress, cy) => {
+export default (Commands, Cypress, cy, state) => {
   Commands.addAll({
     readFile (file, encoding, options = {}) {
       let userOptions = options
@@ -78,6 +79,9 @@ export default (Commands, Cypress, cy) => {
             contents = Buffer.from(contents)
           }
 
+          // Add the filename as a symbol, in case we need it later (such as when storing an alias)
+          state('current').set('fileName', basename(filePath))
+
           consoleProps['File Path'] = filePath
           consoleProps['Contents'] = contents
 

packages/driver/src/cy/commands/fixtures.ts

@@ -2,6 +2,7 @@
 
 import _ from 'lodash'
 import Promise from 'bluebird'
+import { basename } from 'path'
 
 import $errUtils from '../../cypress/error_utils'
 
@@ -84,6 +85,9 @@ export default (Commands, Cypress, cy, state, config) => {
         // so it can just be returned next time
         cache[fixture] = response
 
+        // Add the filename as a symbol, in case we need it later (such as when storing an alias)
+        state('current').set('fileName', basename(fixture))
+
         // return the cloned response
         return clone(response)
       }).catch(Promise.TimeoutError, () => {