diff --git a/test/onBlur.test.tsx b/test/onBlur.test.tsx new file mode 100644 index 0000000..c503be0 --- /dev/null +++ b/test/onBlur.test.tsx @@ -0,0 +1,60 @@ +import { cleanup, render, waitFor, fireEvent } from '@testing-library/react'; +import { ReactMultiEmail } from '../react-multi-email'; +import React from 'react'; +import '@testing-library/jest-dom/extend-expect'; + +afterEach(cleanup); + +describe('ReactMultiEmail onBlur Tests', () => { + it('does not call onBlur if the input was never focused', async () => { + const onBlurMockFunc = jest.fn(); + + render( + { + return ( +
+
{email}
+ removeEmail(index)}> + × + +
+ ); + }} + />, + ); + + expect(onBlurMockFunc).not.toHaveBeenCalled(); + }); + + it('call the onBlur when the input area is blurred', async () => { + const onBlurMockFunc = jest.fn(); + + const { getByRole } = render( + { + return ( +
+
{email}
+ removeEmail(index)}> + × + +
+ ); + }} + />, + ); + + const input: HTMLElement | null = getByRole('textbox'); + + await waitFor(() => { + fireEvent.focus(input); + fireEvent.blur(input); + }); + + expect(onBlurMockFunc).toHaveBeenCalledTimes(1); + expect(input).not.toHaveFocus(); + }); +});