Modal
unknown
javascript
a month ago
13 kB
2
Indexable
Never
import { describe, expect, it } from '@jest/globals'; import { fireEvent, screen, waitFor } from '@testing-library/react'; import React from 'react'; import i18n from 'config/translations/i18n'; import { renderWithProviders } from 'utils/test-utils'; import { StoreDataBuilder } from 'utils/test-utils/StoreDataBuilder'; import ReasonForNonAvailabilityModal from '.'; // Arrange global const preloadedState = new StoreDataBuilder().getStoreData(); const record = { id: 1, name: 'Motivo 1', active: true, byDefault: null, createdBy: '0', createdDate: null, lastModifiedBy: 'system', lastModifiedDate: '2024-08-19T19:34:24.602241' }; describe(`src/modules/NewAdministrator/catalogs/ReasonForNonAvailability/ConfigModal`, () => { describe('WHEN click button to open modal', () => { it('THEN show modal', async () => { // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); // Assert await waitFor(() => { expect(screen.getByTestId('modal-reason-for-non-availability')).toBeInTheDocument(); }); }); describe('WHEN render modal to add record', () => { it('THEN show title, label, placeholder and button in spanish', () => { // Arrange i18n.changeLanguage('es'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); // Assert expect(screen.getByText(/Agregar motivo de no disponibilidad/i)).toBeInTheDocument(); expect(screen.getByText(/Nombre de motivo de no disponibilidad/i)).toBeInTheDocument(); expect(screen.getByPlaceholderText(/Ingrese motivo de no disponibilidad/i)).toBeInTheDocument(); expect(screen.getByText(/Guardar/i)).toBeInTheDocument(); }); it('THEN show title, label, placeholder and button in english', () => { // Arrange i18n.changeLanguage('en'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); // Assert expect(screen.getByText(/Add reason for non-availability/i)).toBeInTheDocument(); expect(screen.getByText(/Reason for Non-Availability Name/i)).toBeInTheDocument(); expect(screen.getByPlaceholderText(/Enter reason for Non-Availability/i)).toBeInTheDocument(); expect(screen.getByText(/Save/i)).toBeInTheDocument(); }); it('THEN show title, label, placeholder and button in portuguese', () => { // Arrange i18n.changeLanguage('pt'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); // Assert expect(screen.getByText(/Adicionar motivo de indisponibilidade/i)).toBeInTheDocument(); expect(screen.getByText(/Nome do Motivo de Indisponibilidade/i)).toBeInTheDocument(); expect(screen.getByPlaceholderText(/Insira o motivo de Indisponibilidade/i)).toBeInTheDocument(); expect(screen.getByText(/Guardar/i)).toBeInTheDocument(); }); describe('WHEN validate input rules', () => { describe('WHEN validate whitespace before and at the end of input', () => { it('THEN render warning in spanish', async () => { // Arrange i18n.changeLanguage('es'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: ' espacion ' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText(/Debe ir sin espacios al principio/i)).toBeInTheDocument(); expect(screen.getByText(/Debe ir sin espacios al Final/i)).toBeInTheDocument(); }); }); it('THEN render warning in english', async () => { // Arrange i18n.changeLanguage('en'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: ' espacion ' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText(/Must not have spaces at the beginning/i)).toBeInTheDocument(); expect(screen.getByText(/Must not have spaces at the end/i)).toBeInTheDocument(); }); }); it('THEN render warning in porguese', async () => { // Arrange i18n.changeLanguage('pt'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: ' espacion ' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText(/Não deve conter espaços no início/i)).toBeInTheDocument(); expect(screen.getByText(/Não deve conter espaços no final/i)).toBeInTheDocument(); }); }); }); describe('WHEN no add value', () => { it('THEN show warning required field in spanish', async () => { // Arrange i18n.changeLanguage('es'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: '' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Campo obligatorio')).toBeInTheDocument(); }); }); it('THEN show warning required field in english', async () => { // Arrange i18n.changeLanguage('en'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: '' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Required Field')).toBeInTheDocument(); }); }); it('THEN show warning required field in portuguese', async () => { // Arrange i18n.changeLanguage('pt'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: '' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Campo Obrigatório')).toBeInTheDocument(); }); }); }); describe('WHEN type to text on input', () => { it('THEN change text to uppercase', async () => { // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: 'texto minusculas' } }); // Assert await waitFor(() => { expect(screen.getByTestId('name-reason-for-non-availability').value).toBe('TEXTO MINUSCULAS'); }); }); it('THEN count characters', async () => { // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: 'contar caracteres' } }); // Assert await waitFor(() => { expect(screen.getByText('17 / 30')).toBeInTheDocument(); }); }); it('THEN input have attribute max lenght of 30', () => { // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); // Assert expect(screen.getByTestId('name-reason-for-non-availability')).toHaveAttribute('maxlength', '30'); }); describe('WHEN try yo add text with more than 30 characters', () => { it('THEN show warning in spanish', async () => { // Arrange i18n.changeLanguage('es'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: 'Un texto con mas de 30 caracteres' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Máximo 30 caracteres')).toBeInTheDocument(); }); }); it('THEN show warning in english', async () => { // Arrange i18n.changeLanguage('en'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: 'Un texto con mas de 30 caracteres' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Maximum 30 characters')).toBeInTheDocument(); }); }); it('THEN show warning in portuguese', async () => { // Arrange i18n.changeLanguage('pt'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open />, { preloadedState }); fireEvent.change(screen.getByTestId('name-reason-for-non-availability'), { target: { value: 'Un texto con mas de 30 caracteres' } }); fireEvent.click(screen.getByTestId('btn-submit')); // Assert await waitFor(() => { expect(screen.getByText('Máximo de 30 caracteres')).toBeInTheDocument(); }); }); }); }); }); }); describe('WHEN render modal to update record', () => { it('THEN show title in spanish', async () => { // Arrange i18n.changeLanguage('es'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open isEdition={true} entityToEdit={record} />, { preloadedState }); // Assert await waitFor(() => { expect(screen.getByText('Editar motivo de no disponibilidad')).toBeInTheDocument(); }); }); it('THEN show title in english', async () => { // Arrange i18n.changeLanguage('en'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open isEdition={true} entityToEdit={record} />, { preloadedState }); // Assert await waitFor(() => { expect(screen.getByText('Edit Reason for Non-Availability')).toBeInTheDocument(); }); }); it('THEN show title in spanish', async () => { // Arrange i18n.changeLanguage('pt'); // Act renderWithProviders(<ReasonForNonAvailabilityModal open isEdition={true} entityToEdit={record} />, { preloadedState }); // Assert await waitFor(() => { expect(screen.getByText('Editar Motivo de Indisponibilidade')).toBeInTheDocument(); }); }); it(`THEN render record's name in the input`, async () => { // Act renderWithProviders(<ReasonForNonAvailabilityModal open isEdition={true} entityToEdit={record} />, { preloadedState }); // Assert await waitFor(() => { expect(screen.getByTestId('name-reason-for-non-availability').value).toBe('Motivo 1'); }); }); }); }); });
Leave a Comment