diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap index 746d4afdb6e1..761b5a3ee06e 100644 --- a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -3314,9 +3314,7 @@ Map { "render": [Function], }, "FileUploader" => Object { - "contextType": Object { - "$$typeof": Symbol(react.context), - }, + "$$typeof": Symbol(react.forward_ref), "propTypes": Object { "accept": Object { "args": Array [ @@ -3396,6 +3394,7 @@ Map { "type": "oneOf", }, }, + "render": [Function], }, "FileUploaderButton" => Object { "propTypes": Object { diff --git a/packages/react/src/components/FileUploader/FileUploader.tsx b/packages/react/src/components/FileUploader/FileUploader.tsx index 4e38786c14b1..4fbacbabff77 100644 --- a/packages/react/src/components/FileUploader/FileUploader.tsx +++ b/packages/react/src/components/FileUploader/FileUploader.tsx @@ -156,7 +156,7 @@ const FileUploader = React.forwardRef( if (filenameStatus === 'edit') { evt.stopPropagation(); const filteredArray = state.fileNames.filter( - (filename) => filename !== nodes[index].innerText.trim() + (filename) => filename !== nodes[index]?.innerText?.trim() ); updateState({ fileNames: filteredArray }); diff --git a/packages/react/src/components/FileUploader/__tests__/FileUploader-test.js b/packages/react/src/components/FileUploader/__tests__/FileUploader-test.js index 72cf8c1ba114..a3164aed7274 100644 --- a/packages/react/src/components/FileUploader/__tests__/FileUploader-test.js +++ b/packages/react/src/components/FileUploader/__tests__/FileUploader-test.js @@ -10,6 +10,7 @@ import { act, render } from '@testing-library/react'; import React from 'react'; import FileUploader from '../'; import { uploadFiles } from '../test-helpers'; +import { Simulate } from 'react-dom/test-utils'; const iconDescription = 'test description'; const requiredProps = { @@ -48,22 +49,38 @@ describe('FileUploader', () => { it('should clear all uploaded files when `clearFiles` is called on a ref', () => { const ref = React.createRef(); - const { container } = render(); + const onClick = jest.fn(); + let requiredProps1 = { + ...requiredProps, + filenameStatus: 'edit', + }; + const fileUpload = render( + + ); // eslint-disable-next-line testing-library/no-container, testing-library/no-node-access - const input = container.querySelector('input'); + const input = fileUpload.container.querySelector('input'); const filename = 'test.png'; act(() => { uploadFiles(input, [new File(['test'], filename, { type: 'image/png' })]); }); + expect(getByText(fileUpload.container, filename)).toBeInstanceOf( + HTMLElement + ); - // eslint-disable-next-line testing-library/prefer-screen-queries - expect(getByText(container, filename)).toBeInstanceOf(HTMLElement); + const onDelete = jest.fn(); + const description = 'test-description'; + // eslint-disable-next-line testing-library/render-result-naming-convention + + let removeFile = getByLabel( + fileUpload.container, + 'test description - test.png' + ); act(() => { - ref.current.clearFiles(); + Simulate.click(removeFile); }); - // eslint-disable-next-line testing-library/prefer-screen-queries - expect(getByText(container, filename)).not.toBeInstanceOf(HTMLElement); + + expect(onClick).toHaveBeenCalledTimes(1); }); it('should synchronize the filename status state when its prop changes', () => {