Skip to content

Commit d9f43fa

Browse files
masiulismasiulis
committed
Add async hook tests
1 parent e78502e commit d9f43fa

File tree

1 file changed

+195
-62
lines changed

1 file changed

+195
-62
lines changed

‎src/steps/ValidationStep/tests/ValidationStep.test.tsx‎

Lines changed: 195 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -513,68 +513,6 @@ describe("Validation step tests", () => {
513513
expect(checkbox).toBeChecked()
514514
})
515515

516-
// test("Init hook transforms data", async () => {
517-
// const NAME = "John"
518-
// const LASTNAME = "Doe"
519-
// const initialData = [
520-
// {
521-
// name: NAME + " " + LASTNAME,
522-
// lastName: undefined,
523-
// },
524-
// ]
525-
// const fields = [
526-
// {
527-
// label: "heyo",
528-
// key: "heyo",
529-
// fieldType: {
530-
// type: "input",
531-
// },
532-
// },
533-
// {
534-
// label: "Name",
535-
// key: "name",
536-
// fieldType: {
537-
// type: "input",
538-
// },
539-
// },
540-
// {
541-
// label: "lastName",
542-
// key: "lastName",
543-
// fieldType: {
544-
// type: "input",
545-
// },
546-
// },
547-
// ] as const
548-
//
549-
// render(
550-
// <Providers
551-
// theme={defaultTheme}
552-
// rsiValues={{
553-
// ...mockValues,
554-
// fields,
555-
// validationStepHook: async (data) =>
556-
// data.map((value) => ({
557-
// name: value.name?.toString()?.split(/(\s+)/)[0],
558-
// lastName: value.name?.toString()?.split(/(\s+)/)[2],
559-
// })),
560-
// }}
561-
// >
562-
// <ModalWrapper isOpen={true} onClose={() => {}}>
563-
// <ValidationStep initialData={initialData} />
564-
// </ModalWrapper>
565-
// </Providers>,
566-
// )
567-
//
568-
// const nameCell = screen.getByRole("gridcell", {
569-
// name: NAME,
570-
// })
571-
// expect(nameCell).toBeInTheDocument()
572-
// const lastNameCell = screen.getByRole("gridcell", {
573-
// name: LASTNAME,
574-
// })
575-
// expect(lastNameCell).toBeInTheDocument()
576-
// })
577-
578516
test("Row hook transforms data", async () => {
579517
const NAME = "John"
580518
const LASTNAME = "Doe"
@@ -721,6 +659,201 @@ describe("Validation step tests", () => {
721659
expect(mockedHook.mock.calls.length).toBe(3)
722660
})
723661

662+
test("Async row hook", async () => {
663+
const NAME = "John"
664+
const LASTNAME = "Doe"
665+
const NEW_NAME = "Johnny"
666+
const NEW_LASTNAME = "CENA"
667+
const TIMEOUT = 200
668+
669+
const fields = [
670+
{
671+
label: "Name",
672+
key: "name",
673+
fieldType: {
674+
type: "input",
675+
},
676+
},
677+
{
678+
label: "lastName",
679+
key: "lastName",
680+
fieldType: {
681+
type: "input",
682+
},
683+
},
684+
] as const
685+
const tableHook: TableHook<fieldKeys<typeof fields>> = async (rows) => {
686+
await new Promise((resolve) => setTimeout(resolve, TIMEOUT))
687+
688+
return rows.map((value) => ({
689+
name: value.name?.toString()?.split(/(\s+)/)[0],
690+
lastName: value.name?.toString()?.split(/(\s+)/)[2],
691+
}))
692+
}
693+
694+
const initialData = await addErrorsAndRunHooks(
695+
[
696+
{
697+
name: NAME + " " + LASTNAME,
698+
lastName: undefined,
699+
},
700+
],
701+
fields,
702+
undefined,
703+
tableHook,
704+
)
705+
await act(async () => {
706+
render(
707+
<Providers
708+
theme={defaultTheme}
709+
rsiValues={{
710+
...mockValues,
711+
fields,
712+
tableHook,
713+
}}
714+
>
715+
<ModalWrapper isOpen={true} onClose={() => {}}>
716+
<ValidationStep<fieldKeys<typeof fields>> initialData={initialData} file={file} />
717+
</ModalWrapper>
718+
</Providers>,
719+
)
720+
})
721+
722+
const nameCell = screen.getByRole("gridcell", {
723+
name: NAME,
724+
})
725+
expect(nameCell).toBeInTheDocument()
726+
const lastNameCell = screen.getByRole("gridcell", {
727+
name: LASTNAME,
728+
})
729+
expect(lastNameCell).toBeInTheDocument()
730+
731+
const NEW_FIRST_NAME_BEFORE_HOOK_RUNS = NEW_NAME + " " + NEW_LASTNAME
732+
733+
// activate input
734+
await userEvent.click(nameCell)
735+
736+
await userEvent.keyboard(NEW_FIRST_NAME_BEFORE_HOOK_RUNS + "{enter}")
737+
// check that the value is updated before the hook runs
738+
await waitFor(() =>
739+
expect(
740+
screen.getByRole("gridcell", {
741+
name: NEW_FIRST_NAME_BEFORE_HOOK_RUNS,
742+
}),
743+
).toBeInTheDocument(),
744+
)
745+
// check that the value is updated after the hook runs
746+
await waitFor(() =>
747+
expect(
748+
screen.getByRole("gridcell", {
749+
name: NEW_NAME,
750+
}),
751+
).toBeInTheDocument(),
752+
)
753+
754+
const newLastNameCell = screen.getByRole("gridcell", {
755+
name: NEW_LASTNAME,
756+
})
757+
expect(newLastNameCell).toBeInTheDocument()
758+
})
759+
760+
test("Async table hook", async () => {
761+
const NAME = "John"
762+
const LASTNAME = "Doe"
763+
const NEW_NAME = "Johnny"
764+
const NEW_LASTNAME = "CENA"
765+
const TIMEOUT = 200
766+
767+
const fields = [
768+
{
769+
label: "Name",
770+
key: "name",
771+
fieldType: {
772+
type: "input",
773+
},
774+
},
775+
{
776+
label: "lastName",
777+
key: "lastName",
778+
fieldType: {
779+
type: "input",
780+
},
781+
},
782+
] as const
783+
const rowHook: RowHook<fieldKeys<typeof fields>> = async (value) => {
784+
await new Promise((resolve) => setTimeout(resolve, TIMEOUT))
785+
786+
return {
787+
name: value.name?.toString()?.split(/(\s+)/)[0],
788+
lastName: value.name?.toString()?.split(/(\s+)/)[2],
789+
}
790+
}
791+
792+
const initialData = await addErrorsAndRunHooks(
793+
[
794+
{
795+
name: NAME + " " + LASTNAME,
796+
lastName: undefined,
797+
},
798+
],
799+
fields,
800+
rowHook,
801+
)
802+
await act(async () => {
803+
render(
804+
<Providers
805+
theme={defaultTheme}
806+
rsiValues={{
807+
...mockValues,
808+
fields,
809+
rowHook,
810+
}}
811+
>
812+
<ModalWrapper isOpen={true} onClose={() => {}}>
813+
<ValidationStep<fieldKeys<typeof fields>> initialData={initialData} file={file} />
814+
</ModalWrapper>
815+
</Providers>,
816+
)
817+
})
818+
819+
const nameCell = screen.getByRole("gridcell", {
820+
name: NAME,
821+
})
822+
expect(nameCell).toBeInTheDocument()
823+
const lastNameCell = screen.getByRole("gridcell", {
824+
name: LASTNAME,
825+
})
826+
expect(lastNameCell).toBeInTheDocument()
827+
828+
const NEW_FIRST_NAME_BEFORE_HOOK_RUNS = NEW_NAME + " " + NEW_LASTNAME
829+
830+
// activate input
831+
await userEvent.click(nameCell)
832+
833+
await userEvent.keyboard(NEW_FIRST_NAME_BEFORE_HOOK_RUNS + "{enter}")
834+
// check that the value is updated before the hook runs
835+
await waitFor(() =>
836+
expect(
837+
screen.getByRole("gridcell", {
838+
name: NEW_FIRST_NAME_BEFORE_HOOK_RUNS,
839+
}),
840+
).toBeInTheDocument(),
841+
)
842+
// check that the value is updated after the hook runs
843+
await waitFor(() =>
844+
expect(
845+
screen.getByRole("gridcell", {
846+
name: NEW_NAME,
847+
}),
848+
).toBeInTheDocument(),
849+
)
850+
851+
const newLastNameCell = screen.getByRole("gridcell", {
852+
name: NEW_LASTNAME,
853+
})
854+
expect(newLastNameCell).toBeInTheDocument()
855+
})
856+
724857
test("Row hook raises error", async () => {
725858
const WRONG_NAME = "Johnny"
726859
const RIGHT_NAME = "Jonathan"

0 commit comments

Comments
 (0)