From f1d090d25dc2c0b5331270dbff119e9e52a81e2c Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Sat, 4 Nov 2023 09:30:21 +0330 Subject: [PATCH 1/5] CFE-10 disable submit button in role management --- .../dashboard/role-management/Form/CreateForm/CreateContent.jsx | 2 +- .../dashboard/role-management/Form/UpdateForm/UpdateContent.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx b/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx index d06659b..8537aab 100644 --- a/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx +++ b/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx @@ -143,7 +143,7 @@ const CreateContent = ({mutate, setOpenConfirmDialog}) => { {t("AddDialog.button-cancel")} diff --git a/src/components/dashboard/role-management/Form/UpdateForm/UpdateContent.jsx b/src/components/dashboard/role-management/Form/UpdateForm/UpdateContent.jsx index 3fee10a..390d7bb 100644 --- a/src/components/dashboard/role-management/Form/UpdateForm/UpdateContent.jsx +++ b/src/components/dashboard/role-management/Form/UpdateForm/UpdateContent.jsx @@ -143,7 +143,7 @@ const UpdateContent = ({mutate, row, setOpenConfirmDialog}) => { {t("UpdateDialog.button-cancel")} From b7b660cf001454f152d1a129d50a0ad93c992dab Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Sat, 4 Nov 2023 09:54:09 +0330 Subject: [PATCH 2/5] CFE-10 correct tests --- .../CreateForm/__test__/CreateContent.test.js | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js index 610e224..921a3d9 100644 --- a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js +++ b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js @@ -145,23 +145,5 @@ describe("Create Content component from Create Form Component in Role Management expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).not.toBeInTheDocument() }) }) - it('should see errors when click on submit button and field not completed', async () => { - render( - - - - ) - const submitButtonElement = screen.queryByText("ثبت") - fireEvent.click(submitButtonElement) - await waitFor(()=>{ - expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).toBeInTheDocument() - }) - await waitFor(()=>{ - expect(screen.queryByText("وارد کردن نام فارسی الزامیست")).toBeInTheDocument() - }) - await waitFor(()=>{ - expect(screen.queryByText("حداقل باید یک دسترسی انتخاب شود")).toBeInTheDocument() - }) - }); }) }) \ No newline at end of file From 6c571f679005a3eac9bd89623b2c85b853caa248 Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Sat, 4 Nov 2023 10:12:39 +0330 Subject: [PATCH 3/5] CFE-10 test if submit button is disabled at first time --- .../Form/CreateForm/__test__/CreateContent.test.js | 9 +++++++++ .../Form/UpdateForm/__test__/UpdateContent.test.js | 11 ++++++++++- 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js index 921a3d9..af8842b 100644 --- a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js +++ b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js @@ -145,5 +145,14 @@ describe("Create Content component from Create Form Component in Role Management expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).not.toBeInTheDocument() }) }) + it('should submit button be disabled', () => { + render( + + + + ) + const submitButtonElement = screen.queryByText("ثبت") + expect(submitButtonElement).toBeDisabled() + }); }) }) \ No newline at end of file diff --git a/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js b/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js index caaa470..56bbcf1 100644 --- a/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js +++ b/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js @@ -1,4 +1,4 @@ -import {act, fireEvent, render, screen, waitFor} from "@testing-library/react"; +import {fireEvent, render, screen, waitFor} from "@testing-library/react"; import MockAppWithProviders from "../../../../../../../mocks/AppWithProvider"; import UpdateContent from "@/components/dashboard/role-management/Form/UpdateForm/UpdateContent"; const row = { @@ -205,5 +205,14 @@ describe("Create Content component from Create Form Component in Role Management expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).not.toBeInTheDocument() }) }) + it('should submit button be disabled', () => { + render( + + + + ) + const submitButtonElement = screen.queryByText("ثبت") + expect(submitButtonElement).toBeDisabled() + }); }) }) \ No newline at end of file From 18375f1c5ccfacf9c8bea113da3ce9f50f586168 Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Sat, 4 Nov 2023 11:25:18 +0330 Subject: [PATCH 4/5] CFE-10 testing disabled button --- mocks/handlers/roles.js | 4 ++-- .../Form/CreateForm/CreateContent.jsx | 6 +++--- .../CreateForm/__test__/CreateContent.test.js | 19 +++++++++++++++++++ 3 files changed, 24 insertions(+), 5 deletions(-) diff --git a/mocks/handlers/roles.js b/mocks/handlers/roles.js index 1c26ef5..2ab045d 100644 --- a/mocks/handlers/roles.js +++ b/mocks/handlers/roles.js @@ -1,5 +1,5 @@ import {rest} from "msw"; -import {GET_ROLE_LIST, GET_ROLES} from "@/core/data/apiRoutes"; +import {GET_PERMISSIONS_LIST, GET_ROLE_LIST, GET_ROLES} from "@/core/data/apiRoutes"; export const rolesHandler = [ rest.get(GET_ROLES, (req, res, ctx) => { @@ -51,7 +51,7 @@ export const rolesHandler = [ ), ); }), - rest.get(GET_ROLE_LIST, (req, res, ctx) => { + rest.get(GET_PERMISSIONS_LIST, (req, res, ctx) => { return res(ctx.json({ data: [ { diff --git a/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx b/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx index 8537aab..8a8f5e7 100644 --- a/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx +++ b/src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx @@ -108,12 +108,12 @@ const CreateContent = ({mutate, setOpenConfirmDialog}) => { : ( <> - {permissions_list.map((permission) => ( - + {permissions_list.map((permission, index) => ( + { if (e.target.checked) { diff --git a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js index af8842b..2733f9f 100644 --- a/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js +++ b/src/components/dashboard/role-management/Form/CreateForm/__test__/CreateContent.test.js @@ -154,5 +154,24 @@ describe("Create Content component from Create Form Component in Role Management const submitButtonElement = screen.queryByText("ثبت") expect(submitButtonElement).toBeDisabled() }); + + it('should submit button be able if inputs get filled', async () => { + render( + + + + ) + const submitButtonElement = screen.queryByText("ثبت") + expect(submitButtonElement).toBeDisabled() + const nameElement = screen.getByLabelText("نام انگلیسی") + const name_faElement = screen.getByLabelText("نام فارسی") + const roleElement = await screen.findByTestId("PermissionList-checkbox-0"); + fireEvent.change(nameElement, { target: { value: 'amin' } }) + fireEvent.change(name_faElement, { target: { value: 'امین' } }) + fireEvent.click(roleElement) + await waitFor(()=>{ + expect(submitButtonElement).not.toBeDisabled() + }) + }); }) }) \ No newline at end of file From d9a24256659fca995b35243df689b566b1dfc775 Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Sat, 4 Nov 2023 11:38:54 +0330 Subject: [PATCH 5/5] CFE-10 write mock for permission lists --- mocks/handlers/roles.js | 16 +++++ .../UpdateForm/__test__/UpdateContent.test.js | 64 +++++++++---------- 2 files changed, 48 insertions(+), 32 deletions(-) diff --git a/mocks/handlers/roles.js b/mocks/handlers/roles.js index 2ab045d..2760fc2 100644 --- a/mocks/handlers/roles.js +++ b/mocks/handlers/roles.js @@ -51,6 +51,22 @@ export const rolesHandler = [ ), ); }), + rest.get(GET_ROLE_LIST, (req, res, ctx) => { + return res(ctx.json({ + data: [ + { + id: 1, + name: "admin", + name_fa: "ادمین" + }, + { + id: 2, + name: "manager", + name_fa: "مدیر" + } + ] + })) + }), rest.get(GET_PERMISSIONS_LIST, (req, res, ctx) => { return res(ctx.json({ data: [ diff --git a/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js b/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js index 56bbcf1..1130d94 100644 --- a/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js +++ b/src/components/dashboard/role-management/Form/UpdateForm/__test__/UpdateContent.test.js @@ -1,18 +1,18 @@ import {fireEvent, render, screen, waitFor} from "@testing-library/react"; import MockAppWithProviders from "../../../../../../../mocks/AppWithProvider"; import UpdateContent from "@/components/dashboard/role-management/Form/UpdateForm/UpdateContent"; + const row = { - id : 0, - getValue : name => { + id: 0, + getValue: name => { if (name === "name") { return "manage_passenger_office_navgan"; - } - else if (name === "name_fa") { + } else if (name === "name_fa") { return "مدیریت کارتابل رییس اداره مسافری استان"; } }, - original : { - permissions : [ + original: { + permissions: [ { id: 1, name: "manage_passenger_office_navgan", @@ -27,8 +27,8 @@ const row = { } } -describe("Create Content component from Create Form Component in Role Management Component",()=>{ - describe("Rendering", ()=>{ +describe("Create Content component from Create Form Component in Role Management Component", () => { + describe("Rendering", () => { it('should see AddDialog text in the top ', async () => { render( @@ -36,8 +36,8 @@ describe("Create Content component from Create Form Component in Role Management ) const textElement = screen.queryByText("ویرایش") - await waitFor(()=>{ - expect(textElement).toBeInTheDocument() + await waitFor(() => { + expect(textElement).toBeInTheDocument() }) }); it('should see name_en text', async () => { @@ -47,8 +47,8 @@ describe("Create Content component from Create Form Component in Role Management ) const textElement = screen.queryByLabelText("نام انگلیسی") - await waitFor(()=>{ - expect(textElement).toBeInTheDocument() + await waitFor(() => { + expect(textElement).toBeInTheDocument() }) }); it('should see name_fa text', async () => { @@ -58,8 +58,8 @@ describe("Create Content component from Create Form Component in Role Management ) const textElement = screen.queryByLabelText("نام فارسی") - await waitFor(()=>{ - expect(textElement).toBeInTheDocument() + await waitFor(() => { + expect(textElement).toBeInTheDocument() }) }); it('should see update text in the submit button ', async () => { @@ -69,7 +69,7 @@ describe("Create Content component from Create Form Component in Role Management ) const buttonElement = screen.queryByText("ثبت") - await waitFor(()=>{ + await waitFor(() => { expect(buttonElement).toBeInTheDocument() }) }); @@ -80,13 +80,13 @@ describe("Create Content component from Create Form Component in Role Management ) const buttonElement = screen.queryByText("بستن") - await waitFor(()=>{ + await waitFor(() => { expect(buttonElement).toBeInTheDocument() }) }); }) - describe("Behavior", ()=>{ + describe("Behavior", () => { it('should see what fill in the name_en input', async () => { render( @@ -96,7 +96,7 @@ describe("Create Content component from Create Form Component in Role Management const nameEnglishInput = screen.getByLabelText('نام انگلیسی'); fireEvent.change(nameEnglishInput, {target: {value: 'testuser'}}); - await waitFor(()=>{ + await waitFor(() => { // Simulate user input expect(nameEnglishInput).toHaveValue('testuser'); }) @@ -110,7 +110,7 @@ describe("Create Content component from Create Form Component in Role Management const nameFarsiInput = screen.getByLabelText('نام فارسی'); fireEvent.change(nameFarsiInput, {target: {value: 'testuser'}}); - await waitFor(()=>{ + await waitFor(() => { // Simulate user input expect(nameFarsiInput).toHaveValue('testuser'); }) @@ -122,7 +122,7 @@ describe("Create Content component from Create Form Component in Role Management ) const checkboxElement = await screen.findAllByTestId("PermissionList-checkbox") - await waitFor(()=>{ + await waitFor(() => { expect(checkboxElement).toHaveLength(2) }) }); @@ -133,7 +133,7 @@ describe("Create Content component from Create Form Component in Role Management ) const name_enElement = screen.getByLabelText("نام انگلیسی") - await waitFor(()=>{ + await waitFor(() => { expect(name_enElement).toHaveValue("manage_passenger_office_navgan") }) }); @@ -144,7 +144,7 @@ describe("Create Content component from Create Form Component in Role Management ) const name_enElement = screen.getByLabelText("نام فارسی") - await waitFor(()=>{ + await waitFor(() => { expect(name_enElement).toHaveValue("مدیریت کارتابل رییس اداره مسافری استان") }) }); @@ -155,13 +155,13 @@ describe("Create Content component from Create Form Component in Role Management ) const checkboxElement = screen.getByLabelText("مدیریت کارتابل رییس اداره مسافری استان") - await waitFor(()=>{ + await waitFor(() => { expect(checkboxElement).toBeChecked(); }) }); }) - describe("Validation", ()=>{ + describe("Validation", () => { it('should see error text when name_fa input is empty', async () => { render( @@ -170,16 +170,16 @@ describe("Create Content component from Create Form Component in Role Management ) const name_faInput = screen.getByLabelText("نام فارسی") expect(screen.queryByText("وارد کردن نام فارسی الزامیست")).not.toBeInTheDocument() - fireEvent.change(name_faInput, {target : {value : ''}}); + fireEvent.change(name_faInput, {target: {value: ''}}); fireEvent.blur(name_faInput) - await waitFor(()=>{ + await waitFor(() => { expect(screen.queryByText("وارد کردن نام فارسی الزامیست")).toBeInTheDocument() }) - fireEvent.change(name_faInput, {target : {value : "نام فارسی"}}) + fireEvent.change(name_faInput, {target: {value: "نام فارسی"}}) - await waitFor(()=>{ + await waitFor(() => { expect(screen.queryByText("وارد کردن نام فارسی الزامیست")).not.toBeInTheDocument() }) }) @@ -192,16 +192,16 @@ describe("Create Content component from Create Form Component in Role Management const name_enInput = screen.getByLabelText("نام انگلیسی") expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).not.toBeInTheDocument() - fireEvent.change(name_enInput, {target : {value : null}}); + fireEvent.change(name_enInput, {target: {value: null}}); fireEvent.blur(name_enInput) - await waitFor(()=>{ + await waitFor(() => { expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).toBeInTheDocument() }) - fireEvent.change(name_enInput, {target : {value : "english name"}}) + fireEvent.change(name_enInput, {target: {value: "english name"}}) - await waitFor(()=>{ + await waitFor(() => { expect(screen.queryByText("وارد کردن نام انگلیسی الزامیست")).not.toBeInTheDocument() }) })