diff --git a/src/elements/content-sidebar/SidebarNavSign.tsx b/src/elements/content-sidebar/SidebarNavSign.tsx index 46a0981af3..7a104f123f 100644 --- a/src/elements/content-sidebar/SidebarNavSign.tsx +++ b/src/elements/content-sidebar/SidebarNavSign.tsx @@ -25,40 +25,27 @@ export function SidebarNavSign() { onClickSignMyself: onBoxClickSignMyself, status: boxSignStatus, targetingApi: boxSignTargetingApi, - isSignRemoveInterstitialEnabled, } = useFeatureConfig('boxSign'); return ( - <> - {isSignRemoveInterstitialEnabled ? ( - - - - - - - - - - - - - - ) : ( - - )} - + + + + + + + + + + + + + ); } diff --git a/src/elements/content-sidebar/__tests__/SidebarNavSign.test.tsx b/src/elements/content-sidebar/__tests__/SidebarNavSign.test.tsx index 35a1792279..32e5175f5e 100644 --- a/src/elements/content-sidebar/__tests__/SidebarNavSign.test.tsx +++ b/src/elements/content-sidebar/__tests__/SidebarNavSign.test.tsx @@ -1,80 +1,58 @@ import * as React from 'react'; -import { render, fireEvent } from '@testing-library/react'; + +import { userEvent } from '@testing-library/user-event'; +import { render, screen } from '../../../test-utils/testing-library'; import SidebarNavSign from '../SidebarNavSign'; -// @ts-ignore Module is written in Flow -import FeatureProvider from '../../common/feature-checking/FeatureProvider'; describe('elements/content-sidebar/SidebarNavSign', () => { const onClickRequestSignature = jest.fn(); const onClickSignMyself = jest.fn(); const renderComponent = (props = {}, features = {}) => - render( - - - , - ); + render(, { + wrapperProps: { features }, + }); - test.each([true, false])('should render sign button', isRemoveInterstitialEnabled => { - const features = { - boxSign: { - isSignRemoveInterstitialEnabled: isRemoveInterstitialEnabled, - }, - }; + test('should render sign button', async () => { + renderComponent(); - const wrapper = renderComponent({}, features); - expect(wrapper.getByTestId('sign-button')).toBeVisible(); + expect(screen.getByRole('button', { name: 'Request Signature' })).toBeInTheDocument(); }); - test('should call correct handler when sign button is clicked', () => { - const features = { - boxSign: { - isSignRemoveInterstitialEnabled: false, - onClick: onClickRequestSignature, - }, - }; - const { getByTestId } = renderComponent({}, features); - - fireEvent.click(getByTestId('sign-button')); + test('should open dropdown with 2 menu items when sign button is clicked', async () => { + renderComponent(); - expect(onClickRequestSignature).toBeCalled(); - }); + await userEvent.click(screen.getByRole('button', { name: 'Request Signature' })); - test('should open dropdown with 2 menu items when sign button is clicked', () => { - const features = { - boxSign: { - isSignRemoveInterstitialEnabled: true, - }, - }; - const { getByTestId } = renderComponent({}, features); - fireEvent.click(getByTestId('sign-button')); - expect(getByTestId('sign-request-signature-button')).toBeVisible(); - expect(getByTestId('sign-sign-myself-button')).toBeVisible(); + expect(screen.getByRole('menuitem', { name: 'Request Signature' })).toBeVisible(); + expect(screen.getByRole('menuitem', { name: 'Sign Myself' })).toBeVisible(); }); - test('should call correct handler when request signature option is clicked', () => { + test('should call correct handler when request signature option is clicked', async () => { const features = { boxSign: { - isSignRemoveInterstitialEnabled: true, onClick: onClickRequestSignature, }, }; - const { getByTestId } = renderComponent({}, features); - fireEvent.click(getByTestId('sign-button')); - fireEvent.click(getByTestId('sign-request-signature-button')); - expect(onClickRequestSignature).toBeCalled(); + renderComponent({}, features); + + await userEvent.click(screen.getByRole('button', { name: 'Request Signature' })); + await userEvent.click(screen.getByRole('menuitem', { name: 'Request Signature' })); + + expect(onClickRequestSignature).toHaveBeenCalled(); }); - test('should call correct handler when sign myself option is clicked', () => { + test('should call correct handler when sign myself option is clicked', async () => { const features = { boxSign: { - isSignRemoveInterstitialEnabled: true, onClickSignMyself, }, }; - const { getByTestId } = renderComponent({}, features); - fireEvent.click(getByTestId('sign-button')); - fireEvent.click(getByTestId('sign-sign-myself-button')); - expect(onClickSignMyself).toBeCalled(); + renderComponent({}, features); + + await userEvent.click(screen.getByRole('button', { name: 'Request Signature' })); + await userEvent.click(screen.getByRole('menuitem', { name: 'Sign Myself' })); + + expect(onClickSignMyself).toHaveBeenCalled(); }); });