diff --git a/packages/account/src/Components/api-token/_tests_/api-token-article.spec.tsx b/packages/account/src/Components/api-token/_tests_/api-token-article.spec.tsx index 4a45145d1a8b..c85e3ddc3130 100644 --- a/packages/account/src/Components/api-token/_tests_/api-token-article.spec.tsx +++ b/packages/account/src/Components/api-token/_tests_/api-token-article.spec.tsx @@ -7,7 +7,7 @@ it('should render ApiTokenArticle', () => { expect(screen.getByText('API token')); expect( screen.getByText( - `To access your mobile apps and other third-party apps, you'll first need to generate an API token.` + /To access your mobile apps and other third-party apps, you'll first need to generate an API token./i ) ).toBeInTheDocument(); }); diff --git a/packages/account/src/Components/api-token/_tests_/api-token-card.spec.tsx b/packages/account/src/Components/api-token/_tests_/api-token-card.spec.tsx index 69c35893f127..a5bccfe7c186 100644 --- a/packages/account/src/Components/api-token/_tests_/api-token-card.spec.tsx +++ b/packages/account/src/Components/api-token/_tests_/api-token-card.spec.tsx @@ -1,53 +1,35 @@ import React from 'react'; +import { Formik, Form } from 'formik'; import { screen, render } from '@testing-library/react'; -import userEvent from '@testing-library/user-event'; import ApiTokenCard from '../api-token-card'; -import { Formik, Form } from 'formik'; describe('', () => { const mock_props = { name: 'Api_token_card_test_case', value: false, - display_name: 'API Token Card', - description: 'API Token Description', - setFieldValue: jest.fn(), + display_name:
API Token Card
, + description:
API Token Description
, }; - it('should render ApiTokenCard', () => { + const renderComponent = (children?: JSX.Element) => { render(
- + {children}
); + }; + + it('should render ApiTokenCard', () => { + renderComponent(); expect(screen.getByText('API Token Card')).toBeInTheDocument(); expect(screen.getByText('API Token Description')).toBeInTheDocument(); }); it('should render ApiTokenCard with children', () => { const children =
API Token Children
; - - render( - -
- {children} -
-
- ); + renderComponent(children); expect(screen.getByText('API Token Children')).toBeInTheDocument(); }); - - it('should run setFieldValue after clicking on checkbox', () => { - render( - -
- - -
- ); - const message = screen.getByText('API Token Card'); - userEvent.click(message); - expect(mock_props.setFieldValue).toBeCalled(); - }); }); diff --git a/packages/account/src/Components/api-token/_tests_/api-token-delete-button.spec.tsx b/packages/account/src/Components/api-token/_tests_/api-token-delete-button.spec.tsx index b714513d0b32..8e9857ef5a60 100644 --- a/packages/account/src/Components/api-token/_tests_/api-token-delete-button.spec.tsx +++ b/packages/account/src/Components/api-token/_tests_/api-token-delete-button.spec.tsx @@ -10,7 +10,14 @@ document.body.appendChild(modal_root_el); describe('ApiTokenDeleteButton', () => { const mock_props = { - api_tokens: undefined, + api_tokens: [ + { + display_name: '', + last_used: '', + scopes: [], + token: '', + }, + ], deleteToken: jest.fn(() => Promise.resolve()), footer_ref: document.createElement('div'), overlay_ref: document.createElement('div'), @@ -25,7 +32,7 @@ describe('ApiTokenDeleteButton', () => { }, }; - const renderAPiDeleteButton = () => { + const renderAPIDeleteButton = () => { render( @@ -34,20 +41,20 @@ describe('ApiTokenDeleteButton', () => { }; it('should render ApiTokenDeleteButton', () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); expect(screen.getByTestId('dt_token_delete_icon')).toBeInTheDocument(); expect(screen.queryByText('Delete this token')).not.toBeInTheDocument(); }); it('should display Delete this token when mouse enter', () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); const delete_icon = screen.getByTestId('dt_token_delete_icon'); userEvent.hover(delete_icon); expect(screen.getByText('Delete this token')).toBeInTheDocument(); }); it('should not Delete this token when mouse leave', () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); const delete_icon = screen.getByTestId('dt_token_delete_icon'); userEvent.hover(delete_icon); expect(screen.getByText('Delete this token')).toBeInTheDocument(); @@ -56,7 +63,7 @@ describe('ApiTokenDeleteButton', () => { }); it('should display Popup when delete icon is clicked', () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); const delete_icon = screen.getByTestId('dt_token_delete_icon'); userEvent.click(delete_icon); expect(screen.getByText('Delete token')).toBeInTheDocument(); @@ -66,7 +73,7 @@ describe('ApiTokenDeleteButton', () => { }); it('should close the modal when clicked on Cancel', async () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); const delete_icon = screen.getByTestId('dt_token_delete_icon'); userEvent.click(delete_icon); expect(screen.getByRole('button', { name: 'Cancel' })).toBeInTheDocument(); @@ -79,7 +86,7 @@ describe('ApiTokenDeleteButton', () => { }); it('should should trigger deleteToken when clicked on Yes, delete', async () => { - renderAPiDeleteButton(); + renderAPIDeleteButton(); const delete_icon = screen.getByTestId('dt_token_delete_icon'); userEvent.click(delete_icon); expect(screen.getByRole('button', { name: 'Cancel' })).toBeInTheDocument();