From 8db3c7f66f423fadc2d05d967264eaf2073483b4 Mon Sep 17 00:00:00 2001
From: Henning Bang Halvorsen <henning.bang.halvorsen@sparebank1.no>
Date: Mon, 6 Nov 2023 14:33:01 +0100
Subject: [PATCH] fix(ffe-file-upload-react): fikse sletting av opplastede
 filer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

versjon 10 innførte bug som gjorde at man ikke kunne slette opplastede filer.
det skyltes at brukeren sitt klikk blir registrert på et element inni button-elementet
 som har lytteren for click-eventet,men slettingen baserte seg på id-en som
 lå på elementet som ble klikket på, ikke selve knappen.
denne commiten bytter "target" med "currentTarget" som vil bruke targeten til lytteren,
 ikke targeten som faktisk ble trykket på.
---
 .../ffe-file-upload-react/src/FileUpload.js   |  2 +-
 .../src/FileUpload.spec.js                    | 32 ++++++++++++++++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/packages/ffe-file-upload-react/src/FileUpload.js b/packages/ffe-file-upload-react/src/FileUpload.js
index b705ea9266..c3a031c84d 100644
--- a/packages/ffe-file-upload-react/src/FileUpload.js
+++ b/packages/ffe-file-upload-react/src/FileUpload.js
@@ -43,7 +43,7 @@ class FileUpload extends React.Component {
     }
 
     onFileDeleted(event) {
-        this.props.onFileDeleted(this.props.files[event.target.id]);
+        this.props.onFileDeleted(this.props.files[event.currentTarget.id]);
     }
 
     render() {
diff --git a/packages/ffe-file-upload-react/src/FileUpload.spec.js b/packages/ffe-file-upload-react/src/FileUpload.spec.js
index 4d38e41698..30524cd72d 100644
--- a/packages/ffe-file-upload-react/src/FileUpload.spec.js
+++ b/packages/ffe-file-upload-react/src/FileUpload.spec.js
@@ -48,7 +48,7 @@ describe('<FileUpload/>', () => {
         });
 
         it('should extract and return files when user finishes selecting files', () => {
-            component.find('#file-upload').simulate('change', {
+            component.find('input#file-upload').simulate('change', {
                 target: {
                     files: {
                         filename: {
@@ -60,5 +60,35 @@ describe('<FileUpload/>', () => {
 
             expect(onFilesSelected.calledOnce).toBe(true);
         });
+
+        it('should remove file from files when delete button is clicked', () => {
+            // Component needs to be mounted for this test because we must render children.
+            component = mount(
+                <FileUpload
+                    id="file-upload"
+                    label="label"
+                    title="title"
+                    infoText="infoText"
+                    uploadTitle="uploadTitle"
+                    uploadMicroText="uploadMicroText"
+                    uploadSubText="uploadSubText"
+                    files={{
+                        fileToDelete: {
+                            name: 'fileToDelete',
+                        },
+                    }}
+                    onFilesSelected={onFilesSelected}
+                    onFileDeleted={onFileDeleted}
+                    onFilesDropped={onFilesDropped}
+                />,
+            );
+            // Do click on span inside button with event listener instead of actual button to catch nested clicks.
+            component
+                .find('.ffe-file-upload__file-item-delete-button-text')
+                .simulate('click');
+            expect(onFileDeleted.calledWith({ name: 'fileToDelete' })).toBe(
+                true,
+            );
+        });
     });
 });