CRM/Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CFE-3 solve problem of select box

Browse Source
This commit is contained in:
Mohammad Jalali
2023-10-11 15:17:12 +03:30
parent 45f2597dac
commit a76c50b59f
2 changed files with 35 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/__tests__/index.test.js
View File

@@ -1,10 +1,11 @@
import {act, fireEvent, render, screen, waitFor} from "@testing-library/react";
import {act, findByRole, findByText, fireEvent, render, screen, waitFor} from "@testing-library/react";
import React from 'react';
import {useTranslations} from "next-intl";
import * as Yup from "yup";
import {Formik} from "formik";
import MockAppWithProviders from "../../../../../../../../../../mocks/AppWithProvider";
import PositionAndRole from "../../PositionAndRole";
import {MenuItem, Select} from "@mui/material";
const CreateFormMock = ({Component}) => {
const t = useTranslations();
@@ -38,9 +39,9 @@ describe("CreateContent Component From Expert Management", () => {
});
it("Role Select Box Rendered", async () => {
render(<MockAppWithProviders><CreateFormMock Component={PositionAndRole}/></MockAppWithProviders>);
const roleSelect = screen.getByTestId('select-box');
await waitFor(() => {
const roleSelectBox = screen.getByTestId('role-select');
expect(roleSelectBox).toBeInTheDocument();
expect(roleSelect).toBeInTheDocument();
});
});
});
@@ -53,13 +54,18 @@ describe("CreateContent Component From Expert Management", () => {
expect(positionTextField).toHaveValue('examplePosition');
})
});
// it("Role Select Box Work Correctly", async () => {
// render(<MockAppWithProviders><CreateFormMock Component={PositionAndRole}/></MockAppWithProviders>);
// await waitFor(() => {
// expect(screen.queryByText("ادمین")).toBeInTheDocument();
// }, {timeout: 3000});
// const roleSelectBox = screen.getByTestId('role-select');
// });
it("Role Select Box Work Correctly", async () => {
render(<MockAppWithProviders><CreateFormMock Component={PositionAndRole}/></MockAppWithProviders>);
const roleSelect = screen.getByTestId("option-opener");
await waitFor(() => {
expect(roleSelect).toBeInTheDocument();
});
fireEvent.mouseDown(roleSelect);
await waitFor(() => {
const selectItem = screen.queryByText("ادمین");
expect(selectItem).toBeInTheDocument();
});
});
});
describe("validation", () => {
it('Should See Error When Position Input Is Empty', async () => {
@@ -74,17 +80,19 @@ describe("CreateContent Component From Expert Management", () => {
expect(screen.queryByText("سمت خود را وارد کنید")).toBeInTheDocument()
});
});
// it('Should See Error When Role Select Is Empty', async () => {
// render(<MockAppWithProviders><CreateFormMock Component={PositionAndRole}/></MockAppWithProviders>);
//
// const roleSelect = screen.queryByLabelText('نقش');
//
// fireEvent.change(roleSelect, {target: {value: 1}});
// fireEvent.blur(roleSelect);
//
// await waitFor(() => {
// expect(screen.queryByText("نقش خود را وارد کنید")).toBeInTheDocument()
// });
// });
it('Should See Error When Role Select Is Empty', async () => {
render(<MockAppWithProviders><CreateFormMock Component={PositionAndRole}/></MockAppWithProviders>);
const roleInput = screen.getByTestId("input-role-id")
const roleSelectOpener = await waitFor(() => screen.getByTestId("option-opener"));
fireEvent.mouseDown(roleSelectOpener);
const selectItem = await waitFor(() => screen.queryByText("ادمین"));
expect(selectItem).toBeInTheDocument();
fireEvent.click(selectItem);
await waitFor(() => {
expect(roleInput.value).toBe('1')
});
});
})
});

6
src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/index.jsx
View File

@@ -36,11 +36,15 @@ const PositionAndRole = ({formik}) => {
<Select
name="role_id"
label={t("ExpertMangement.text_field_role_id")}
data-testid="role-select"
value={formik.values.role_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
inputProps={{
"data-testid": "input-role-id"
}}
data-testid="select-box"
SelectDisplayProps={{"data-testid": 'option-opener'}}
variant="outlined"
>
{isLoadingRoleList ? (