Lagt til test for FlyttPersoner og endret en god del på oppsett for C…

…ypress
navikt · Jan 4, 2024 · a98c0bc · a98c0bc
1 parent d7e8917
commit a98c0bc
Show file tree

Hide file tree

Showing 12 changed files with 159 additions and 157 deletions.
diff --git a/apps/dolly-frontend/src/main/js/cypress/e2e/FlyttPersoner.cy.ts b/apps/dolly-frontend/src/main/js/cypress/e2e/FlyttPersoner.cy.ts
@@ -0,0 +1,27 @@
+import { CypressSelector } from '../mocks/Selectors'
+
+describe('Dolly flyttPersoner testing', () => {
+	it('passes', () => {
+		cy.visit('http://localhost:5678/gruppe')
+
+		cy.get('div').contains('Testytest').click()
+
+		cy.dollyGet(CypressSelector.BUTTON_FLYTT_PERSONER).click()
+
+		cy.dollyGet(CypressSelector.TOGGLE_ALLE_GRUPPER).click()
+		cy.dollyGet(CypressSelector.TOGGLE_EKSISTERENDE_GRUPPE).click()
+		cy.dollyGet(CypressSelector.TOGGLE_NY_GRUPPE).click()
+
+		cy.dollyGet(CypressSelector.INPUT_NY_GRUPPE_NAVN).type('TestNavn')
+		cy.dollyGet(CypressSelector.INPUT_NY_GRUPPE_HENSIKT).type('TestHensikt')
+		cy.dollyGet(CypressSelector.BUTTON_NY_GRUPPE_OPPRETT).click()
+
+		cy.get('.navds-checkbox__label').contains('12345678912').click()
+
+		cy.dollyGet(CypressSelector.CONTAINER_VALGTE_PERSONER).should('contain', '12345678912')
+		cy.dollyGet(CypressSelector.BUTTON_FLYTT_PERSONER_NULLSTILL).click()
+		cy.dollyGet(CypressSelector.CONTAINER_VALGTE_PERSONER).should('not.contain', '12345678912')
+
+		cy.dollyGet(CypressSelector.BUTTON_FLYTT_PERSONER_AVBRYT).click()
+	})
+})
diff --git a/apps/dolly-frontend/src/main/js/cypress/e2e/Gruppe.cy.ts b/apps/dolly-frontend/src/main/js/cypress/e2e/Gruppe.cy.ts
@@ -1,48 +1,18 @@
 import { CypressSelector } from '../mocks/Selectors'
 import {
 	avbruttBestillingMock,
-	personFragmentNavigerMock,
 	uferdigBestillingMock,
 	uferdigeBestillingerMock,
 } from '../mocks/BasicMocks'
-import { ERROR_NAVIGATE_IDENT } from '../../src/ducks/errors/ErrorMessages'
 
 const uferdigBestilling = new RegExp(/dolly-backend\/api\/v1\/bestilling\/2$/)
 const uferdigeBestillinger = new RegExp(/dolly-backend\/api\/v1\/bestilling\/gruppe\/2\/ikkeferdig/)
 const personFragmentNaviger = new RegExp(/dolly-backend\/api\/v1\/ident\/naviger\/12345678912/)
 
-describe('Navigering, Opprett gruppe og start bestilling med alle mulige tilvalg', () => {
+describe('Opprett gruppe og start bestilling med alle mulige tilvalg', () => {
 	it('passes', () => {
 		cy.visit('http://localhost:5678/gruppe')
 
-		//Midlertidig not found på navigering til ident etter søk
-		cy.intercept({ method: 'GET', url: personFragmentNaviger }, { statusCode: 404 })
-
-		cy.dollyType(CypressSelector.INPUT_DOLLY_SOEK, '12345')
-		cy.dollyGet(CypressSelector.BUTTON_NAVIGER_DOLLY).click()
-		cy.wait(400)
-
-		cy.dollyGet(CypressSelector.ERROR_MESSAGE_NAVIGERING).should(
-			'contains.text',
-			ERROR_NAVIGATE_IDENT,
-		)
-
-		//Korrekt navigering igjen
-		cy.intercept({ method: 'GET', url: personFragmentNaviger }, personFragmentNavigerMock)
-
-		cy.dollyGet(CypressSelector.TOGGLE_SEARCH_BESTILLING).click()
-		cy.dollyType(CypressSelector.INPUT_DOLLY_SOEK, '1')
-		cy.dollyGet(CypressSelector.BUTTON_NAVIGER_DOLLY).click()
-		cy.dollyGet(CypressSelector.TOGGLE_SEARCH_PERSON).click()
-
-		cy.dollyType(CypressSelector.INPUT_DOLLY_SOEK, '12345')
-		cy.dollyGet(CypressSelector.BUTTON_NAVIGER_DOLLY).click()
-		cy.wait(400)
-
-		cy.url().should('include', '/gruppe/1')
-
-		cy.dollyGet(CypressSelector.BUTTON_HEADER_PERSONER).click()
-
 		// Naviger mellom tabs
 		cy.dollyGet(CypressSelector.TOGGLE_FAVORITTER).click()
 		cy.dollyGet(CypressSelector.TOGGLE_ALLE).click()

diff --git a/apps/dolly-frontend/src/main/js/cypress/mocks/BasicMocks.tsx b/apps/dolly-frontend/src/main/js/cypress/mocks/BasicMocks.tsx
@@ -881,6 +881,8 @@ export const pensjonMock = [
 
 export const pensjonTpMock = [{ ordning: '4095' }, { ordning: '3010' }]
 
+export const tagsMock = [{ tag: 'DUMMY', beskrivelse: 'Dummy' }]
+
 export const kontoregisterMock = {
 	kontohaver: '12345678912',
 	kontonummer: '99999999999',

diff --git a/apps/dolly-frontend/src/main/js/cypress/support/e2e.ts b/apps/dolly-frontend/src/main/js/cypress/support/e2e.ts
@@ -35,6 +35,7 @@ import {
 	personFragmentSearchMock,
 	sigrunstubMock,
 	skjermingMock,
+	tagsMock,
 	tpsMessagingMock,
 	udistubMock,
 } from '../mocks/BasicMocks'
@@ -120,7 +121,7 @@ beforeEach(() => {
 	cy.intercept({ method: 'GET', url: pdlPersonEnkelt }, pdlPersonEnkeltMock)
 	cy.intercept({ method: 'GET', url: pdlForvalter }, pdlForvalterMock)
 	cy.intercept({ method: 'POST', url: kontoregister }, kontoregisterMock)
-	cy.intercept({ method: 'GET', url: tags }, { body: {} })
+	cy.intercept({ method: 'GET', url: tags }, tagsMock)
 	cy.intercept({ method: 'GET', url: backendTransaksjon }, backendTransaksjonMock)
 	cy.intercept({ method: 'GET', url: brukerMaler }, brukerMalerMock)
 	cy.intercept({ method: 'GET', url: oppsummeringsdokService }, oppsummeringsdokumentServiceMock)

diff --git a/apps/dolly-frontend/src/main/js/package-lock.json b/apps/dolly-frontend/src/main/js/package-lock.json
diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/krrstub/form/KrrForm.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/krrstub/form/KrrForm.tsx
@@ -94,18 +94,4 @@ export const KrrstubForm = () => {
 	)
 }
 
-KrrstubForm.validation = {
-	krrstub: Yup.object({
-		epost: Yup.string(),
-		gyldigFra: Yup.date().nullable(),
-		mobil: Yup.string().matches(/^\+?\d{8,14}$/, {
-			message: 'Ugyldig telefonnummer',
-			excludeEmptyString: true,
-		}),
-		sdpAdresse: Yup.string(),
-		sdpLeverandoer: Yup.string().nullable(),
-		spraak: Yup.string(),
-		registrert: ifPresent('$krrstub.registrert', requiredBoolean),
-		reservert: Yup.boolean().nullable(),
-	}),
-}
+KrrstubForm.validation = KrrValidation
diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/krrstub/form/KrrValidation.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/krrstub/form/KrrValidation.tsx
@@ -7,7 +7,10 @@ export const KrrValidation = {
 		Yup.object({
 			epost: Yup.string(),
 			gyldigFra: Yup.date().nullable(),
-			mobil: Yup.string().matches(/^\+?\d*$/, 'Ugyldig mobilnummer'),
+			mobil: Yup.string().matches(/^\+?\d{8,14}$/, {
+				message: 'Ugyldig telefonnummer',
+				excludeEmptyString: true,
+			}),
 			sdpAdresse: Yup.string(),
 			sdpLeverandoer: Yup.string().nullable(),
 			spraak: Yup.string(),

diff --git a/...olly-frontend/src/main/js/src/components/ui/button/FlyttPersonButton/FlyttPersonModal.tsx b/...olly-frontend/src/main/js/src/components/ui/button/FlyttPersonButton/FlyttPersonModal.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react'
+import React, { useState } from 'react'
 import * as Yup from 'yup'
 import Button from '@/components/ui/button/Button'
 import DollyModal from '@/components/ui/modal/DollyModal'
@@ -135,7 +135,7 @@ const StyledErrorMessageWithFocus = styled(DollyErrorMessage)`
 
 export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPersonButtonTypes) => {
 	const formMethods = useForm({
-		defaultValues: { identer: [], gruppeId: null },
+		defaultValues: { identer: [], gruppeId: '' },
 		resolver: yupResolver(validation),
 	})
 	const [loading, setLoading] = useState(false)
@@ -169,7 +169,10 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 	const gruppeOptions = getGruppeOptions()
 
 	const gruppeIdenterListe = Array.isArray(gruppeOptions)
-		? gruppeOptions?.map((person) => person?.value).filter((person) => person)
+		? gruppeOptions
+				?.map((person) => person?.value)
+				.filter((person) => person)
+				.map((person) => ({ fnr: person }))
 		: []
 
 	const getRelatertePersoner = (identer: Array<string>, identerHentet = [] as Array<string>) => {
@@ -182,7 +185,7 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 			)
 			if (funnetIdent) {
 				relatertePersonerHentet.push(funnetIdent.value)
-				identerNye.push(...funnetIdent.relasjoner)
+				funnetIdent.relasjoner && identerNye.push(...funnetIdent.relasjoner)
 			}
 		})
 		if (identerNye.length > 0) {
@@ -206,31 +209,22 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 		return relatert
 	}
 
-	const mountedRef = useRef(true)
-
-	const handleSubmit = useCallback(
-		(formMethods: any) => {
-			const submit = async () => {
-				setLoading(true)
-				const { gruppeId, identer } = formMethods
-				const relasjoner = getRelatertePersoner(identer)
-				const identerSamlet = Array.from(new Set([...identer, ...relasjoner]))
-				await DollyApi.flyttPersonerTilGruppe(gruppeId, identerSamlet)
-					.then(() => {
-						closeModal()
-						setLoading(false)
-						navigate(`../gruppe/${gruppeId}`)
-					})
-					.catch((e: Error) => {
-						setError(e.message)
-						setLoading(false)
-					})
-			}
-			mountedRef.current = false
-			return submit()
-		},
-		[gruppeOptions],
-	)
+	const handleSubmit = () => {
+		const { identer, gruppeId } = formMethods.getValues()
+		const identerFormatert = identer.map((ident) => ident.fnr)
+		const relasjoner = getRelatertePersoner(identerFormatert)
+		const identerSamlet = Array.from(new Set([...identerFormatert, ...relasjoner]))
+		DollyApi.flyttPersonerTilGruppe(gruppeId, identerSamlet)
+			.then(() => {
+				closeModal()
+				setLoading(false)
+				navigate(`../gruppe/${gruppeId}`)
+			})
+			.catch((e: Error) => {
+				setError(e.message)
+				setLoading(false)
+			})
+	}
 
 	const handleClose = () => {
 		closeModal()
@@ -241,12 +235,16 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 	const FlyttPersonForm = () => {
 		const formMethods = useFormContext()
 		const [searchText, setSearchText] = useState('')
-		const fieldMethods = useFieldArray({ control: formMethods.control, name: 'identer' })
-		const values = fieldMethods.fields.values?.identer
-		const isChecked = (id: string) => values?.includes(id)
+		const fieldMethods = useFieldArray({
+			control: formMethods.control,
+			name: 'identer',
+		})
+		const isChecked = (id: string) => fieldMethods.fields?.find((i) => i.fnr === id)
 		const onClick = (e: { target: any }) => {
-			const { id } = e.target
-			isChecked(id) ? fieldMethods.remove(values?.indexOf(id)) : fieldMethods.append(id)
+			const id = e.target.id
+			isChecked(id)
+				? fieldMethods.remove(fieldMethods.fields?.map((value) => value.fnr).indexOf(id))
+				: fieldMethods.append({ fnr: id })
 		}
 
 		return (
@@ -301,7 +299,9 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 													key={person.value}
 													id={person.value}
 													label={person.label}
-													checked={values?.includes(person.value)}
+													checked={fieldMethods.fields
+														.map((val) => val.fnr)
+														?.includes(person.value)}
 													onChange={onClick}
 													size="small"
 													attributtCheckbox
@@ -325,6 +325,7 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 								VELG ALLE
 							</Button>
 							<Button
+								data-cy={CypressSelector.BUTTON_FLYTT_PERSONER_NULLSTILL}
 								onClick={() => {
 									formMethods.setValue('identer', [])
 									formMethods.trigger()
@@ -343,12 +344,12 @@ export const FlyttPersonModal = ({ gruppeId, modalIsOpen, closeModal }: FlyttPer
 								flyttes.
 							</Alert>
 						)}
-						<ValgtePersonerList>
-							{_.get(formMethods.getValues(), 'identer')?.length > 0 ? (
+						<ValgtePersonerList data-cy={CypressSelector.CONTAINER_VALGTE_PERSONER}>
+							{fieldMethods.fields.length > 0 ? (
 								<ul>
-									{_.get(formMethods.getValues(), 'identer')?.map((ident: string) => (
-										<li key={ident}>
-											{gruppeOptions?.find((person: Option) => person?.value === ident)?.label}
+									{fieldMethods.fields?.map((field) => (
+										<li key={field.id}>
+											{gruppeOptions?.find((person: Option) => person?.value === field.fnr)?.label}
 										</li>
 									))}
 								</ul>

diff --git a/apps/dolly-frontend/src/main/js/src/components/ui/form/inputs/label/Label.tsx b/apps/dolly-frontend/src/main/js/src/components/ui/form/inputs/label/Label.tsx
@@ -3,7 +3,7 @@ import * as _ from 'lodash'
 import styled from 'styled-components'
 import './Label.less'
 import { Hjelpetekst } from '@/components/hjelpetekst/Hjelpetekst'
-import { useFormContext } from 'react-hook-form'
+import { useForm, useFormContext } from 'react-hook-form'
 import { useContext } from 'react'
 import {
 	ShowErrorContext,
@@ -19,7 +19,7 @@ export const Label = ({ name, label, info = null, containerClass = null, childre
 	const {
 		getFieldState,
 		formState: { touchedFields },
-	} = useFormContext()
+	} = useFormContext() || useForm()
 	const { error } = getFieldState(name)
 	const isTouched = _.has(touchedFields, name)
 	const errorContext: ShowErrorContextType = useContext(ShowErrorContext)