-
Notifications
You must be signed in to change notification settings - Fork 14
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(admin-ui): ui & client component tests added
- Loading branch information
1 parent
962d6c0
commit d721edc
Showing
11 changed files
with
203 additions
and
28 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| import { fireEvent, screen } from '@testing-library/dom' | ||
| import GluuSelectRow from '../GluuSelectRow' | ||
| import { render } from '@testing-library/react' | ||
|
|
||
| const label = 'Select Option:' | ||
| const name = 'selectName' | ||
| const value = 'option2' | ||
| const values = ['option1', 'option2', 'option3'] | ||
|
|
||
| describe('GluuSelectRow', () => { | ||
| // Mock the formik object and its handleChange method | ||
| const formikHandleChangeMock = jest.fn() | ||
| const formikMock = { | ||
| handleChange: formikHandleChangeMock, | ||
| } | ||
|
|
||
| test('renders select with formik handle change & update value', () => { | ||
| render( | ||
| <GluuSelectRow | ||
| label={label} | ||
| name={name} | ||
| value={value} | ||
| values={values} | ||
| formik={formikMock} | ||
| /> | ||
| ) | ||
|
|
||
| const selectElement = screen.getByTestId(name) | ||
|
|
||
| expect(selectElement.value).toBe(value) | ||
|
|
||
| const newValue = 'option3' | ||
| fireEvent.change(selectElement, { target: { value: newValue } }) | ||
|
|
||
| // Ensure that the handleChange method from formikMock was called with the correct arguments | ||
| expect(formikHandleChangeMock).toHaveBeenCalledTimes(1) | ||
| expect(formikHandleChangeMock).toHaveBeenCalledWith( | ||
| expect.objectContaining({ | ||
| target: expect.objectContaining({ | ||
| name, | ||
| value: newValue, | ||
| }), | ||
| }) | ||
| ) | ||
| }) | ||
|
|
||
| test('renders select with prop handle change method & update value', () => { | ||
| // Mock handleChange method | ||
| const handleChangeMock = jest.fn() | ||
|
|
||
| render( | ||
| <GluuSelectRow | ||
| label={label} | ||
| name={name} | ||
| value={value} | ||
| values={values} | ||
| formik={formikMock} | ||
| handleChange={handleChangeMock} | ||
| /> | ||
| ) | ||
|
|
||
| const selectElement = screen.getByTestId(name) | ||
|
|
||
| expect(selectElement.value).toBe(value) | ||
|
|
||
| const newValue = 'option1' | ||
|
|
||
| // Ensure that the props handleChange method was called | ||
| fireEvent.change(selectElement, { target: { value: newValue } }) | ||
|
|
||
| // Retrieve the event | ||
| const eventArgument = handleChangeMock.mock.calls[0][0] | ||
|
|
||
| expect(handleChangeMock).toHaveBeenCalledTimes(1) | ||
| expect(handleChangeMock).toHaveBeenCalledWith(eventArgument) | ||
|
|
||
| // updates with new value option1 | ||
| expect(selectElement.value).toBe(newValue) | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| import { fireEvent, screen } from '@testing-library/dom' | ||
| import GluuToogle from '../GluuToogle' | ||
| import { render } from '@testing-library/react' | ||
|
|
||
| describe('Toggle switch', () => { | ||
| it('should update the state and UI when toggled', () => { | ||
| // Set up initial values | ||
| const initialChecked = true | ||
| const name = 'switch' | ||
| const handlerMock = jest.fn() // Create a mock function for the handler | ||
|
|
||
| // Render the component with initial props and state | ||
| render( | ||
| <GluuToogle name={name} value={initialChecked} handler={handlerMock} /> | ||
| ) | ||
|
|
||
| // Find the Toggle component in the DOM | ||
| const toggleElement = screen.getByTestId(name) | ||
|
|
||
| // Assert that the Toggle is initially checked | ||
| expect(toggleElement.checked).toBe(initialChecked) | ||
|
|
||
| // Simulate a click on the Toggle | ||
| fireEvent.click(toggleElement) | ||
|
|
||
| // Assert that the handler function was called | ||
| expect(handlerMock).toHaveBeenCalledTimes(1) | ||
|
|
||
| // Assert that the state has been updated correctly after the click | ||
| expect(toggleElement.checked).toBe(!initialChecked) | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
61 changes: 61 additions & 0 deletions
61
admin-ui/plugins/auth-server/_tests_/clients/components/ClientWizardForm.test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| import React from 'react' | ||
| import { fireEvent, render, screen } from '@testing-library/react' | ||
| import ClientWizardForm from 'Plugins/auth-server/components/Clients/ClientWizardForm' | ||
| import AppTestWrapper from 'Routes/Apps/Gluu/Tests/Components/AppTestWrapper.test' | ||
| import { Provider } from 'react-redux' | ||
| import { combineReducers, configureStore } from '@reduxjs/toolkit' | ||
| import clients from './clients.test' | ||
| import { reducer as scopeReducer } from 'Plugins/auth-server/redux/features/scopeSlice' | ||
| import oidcDiscoveryReducer from 'Redux/features/oidcDiscoverySlice' | ||
| import { t } from 'i18next' | ||
|
|
||
| const initReducer = { | ||
| scripts: [], | ||
| } | ||
|
|
||
| const store = configureStore({ | ||
| reducer: combineReducers({ | ||
| initReducer: (state = initReducer) => state, | ||
| scopeReducer: scopeReducer, | ||
| oidcDiscoveryReducer: oidcDiscoveryReducer, | ||
| }), | ||
| }) | ||
|
|
||
| const Wrapper = ({ children }) => ( | ||
| <AppTestWrapper> | ||
| <Provider store={store}>{children}</Provider> | ||
| </AppTestWrapper> | ||
| ) | ||
|
|
||
| function hasInputValue(e, inputValue) { | ||
| return screen.getByDisplayValue(inputValue) === e | ||
| } | ||
|
|
||
| describe('Should render client add/edit form properly', () => { | ||
| test('render and update input fields', async () => { | ||
| const { container } = render( | ||
| <ClientWizardForm scripts={[]} client_data={clients[0]} />, | ||
| { | ||
| wrapper: Wrapper, | ||
| } | ||
| ) | ||
| screen.debug(container, Infinity) | ||
| const clientNameInput = screen.getByTestId('clientName') | ||
| fireEvent.change(clientNameInput, { target: { value: 'test' } }) | ||
| expect(hasInputValue(clientNameInput, 'test')).toBe(true) | ||
|
|
||
| const applicationType = screen.getByTestId('applicationType') | ||
| fireEvent.change(applicationType, { target: { value: 'web' } }) | ||
| expect(hasInputValue(applicationType, 'web')).toBe(true) | ||
|
|
||
| const redirectUris = screen.getByTestId('new_entry') | ||
| fireEvent.change(redirectUris, { target: { value: 'www.gluu.org' } }) | ||
| const addButton = screen.getByTestId(t('actions.add')) | ||
| fireEvent.click(addButton) | ||
| screen.debug(await screen.findByText('www.gluu.org'), Infinity) | ||
|
|
||
| fireEvent.change(redirectUris, { target: { value: 'www.google.com' } }) | ||
| fireEvent.click(addButton) | ||
| screen.debug(await screen.findByText('www.google.com'), Infinity) | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters