Disable attachmentInput when file is attached (with tests this time)

js/components/__tests__/upload_input.test.js

@@ -1,6 +1,7 @@
 import { mount } from '@vue/test-utils'
 
 import uploadinput from '../upload_input'
+import { MockUploader } from '../../lib/upload'
 
 import { makeTestWrapper } from '../../test_utils/component_test_helpers'
 
@@ -60,4 +61,39 @@ describe('UploadInput Test', () => {
     const messageArea = wrapper.find('.usa-input__message')
     expect(messageArea.html()).toContain('Test Error Message')
   })
+
+  it('should disable the file input when a file is uploaded', done => {
+    const wrapper = mount(UploadErrorWrapper, {
+      propsData: {
+        initialData: {},
+      },
+    })
+
+    const component = wrapper.find(uploadinput)
+    const event = { target: { value: '', files: [{ name: '' }] } }
+
+    component.setMethods({
+      getUploader: async () => new MockUploader('token', 'objectName'),
+    })
+
+    component.vm.addAttachment(event).then(() => {
+      expect(component.vm.$refs.attachmentInput.disabled).toBe(true)
+      done()
+    })
+  })
+
+  it('should enable the file input when the attachment is removed', () => {
+    const wrapper = mount(UploadErrorWrapper, {
+      propsData: {
+        initialData: { filename: 'filename.pdf', objectName: 'abcd' },
+      },
+    })
+
+    const event = { preventDefault: () => {}, target: { value: 'val' } }
+    const component = wrapper.find(uploadinput)
+
+    component.vm.removeAttachment(event)
+
+    expect(component.vm.$refs.attachmentInput.disabled).toBe(false)
+  })
 })

js/components/upload_input.js

@@ -81,6 +81,8 @@ export default {
         this.attachment = e.target.value
         this.$refs.attachmentFilename.value = file.name
         this.$refs.attachmentObjectName.value = response.objectName
+        this.$refs.attachmentInput.disabled = true
+
         this.downloadLink = await this.getDownloadLink(
           file.name,
           response.objectName

js/lib/upload.js

@@ -77,7 +77,7 @@ class AwsUploader {
   }
 }
 
-class MockUploader {
+export class MockUploader {
   constructor(token, objectName) {
     this.token = token
     this.objectName = objectName