feat(frontend): Add formSnapshotComparison test, add test setup

This commit is contained in:
2026-03-02 08:49:12 +01:00
parent fea2ca8a3b
commit 7d18824c32
8 changed files with 125 additions and 88 deletions

View File

@@ -0,0 +1,4 @@
{
"extends": "../.nuxt/tsconfig.json",
"include": ["**/*"]
}

View File

@@ -1,5 +1,5 @@
import { describe, it, expect } from 'vitest'
import { compareApplicationFormValues, groupChangesBySection } from '../../app/utils/formDiff'
import { compareApplicationFormValues, groupChangesBySection } from '../../../app/utils/formSnapshotComparison'
import type {
ApplicationFormDto,
ApplicationFormSnapshotDto,
@@ -11,7 +11,7 @@ import type {
FormElementSectionSnapshotDto,
FormElementSubSectionSnapshotDto,
FormElementType
} from '../../.api-client'
} from '../../../.api-client'
// Helper to create a minimal FormOptionDto
function createOption(value: string, label: string): FormOptionDto {
@@ -96,7 +96,7 @@ function createSnapshot(elements: FormElementSnapshotDto[], sectionTitle = 'Test
}
}
describe('formDiff', () => {
describe('formSnapshotComparison', () => {
describe('compareApplicationFormValues', () => {
describe('TEXTFIELD element', () => {
it('should detect new answer (empty → filled)', () => {
@@ -110,9 +110,9 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].elementTitle).toBe('Name')
expect(diff.newAnswers[0].currentLabel).toBe('John Doe')
expect(diff.newAnswers[0].previousLabel).toBeNull()
expect(diff.newAnswers[0]?.elementTitle).toBe('Name')
expect(diff.newAnswers[0]?.currentLabel).toBe('John Doe')
expect(diff.newAnswers[0]?.previousLabel).toBeNull()
expect(diff.changedAnswers).toHaveLength(0)
expect(diff.clearedAnswers).toHaveLength(0)
})
@@ -128,8 +128,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('John Doe')
expect(diff.changedAnswers[0].currentLabel).toBe('Jane Doe')
expect(diff.changedAnswers[0]?.previousLabel).toBe('John Doe')
expect(diff.changedAnswers[0]?.currentLabel).toBe('Jane Doe')
expect(diff.newAnswers).toHaveLength(0)
expect(diff.clearedAnswers).toHaveLength(0)
})
@@ -143,8 +143,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('John Doe')
expect(diff.clearedAnswers[0].currentLabel).toBeNull()
expect(diff.clearedAnswers[0]?.previousLabel).toBe('John Doe')
expect(diff.clearedAnswers[0]?.currentLabel).toBeNull()
expect(diff.newAnswers).toHaveLength(0)
expect(diff.changedAnswers).toHaveLength(0)
})
@@ -179,7 +179,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('This is a long description text.')
expect(diff.newAnswers[0]?.currentLabel).toBe('This is a long description text.')
})
it('should detect changed answer', () => {
@@ -193,8 +193,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('Original text')
expect(diff.changedAnswers[0].currentLabel).toBe('Updated text')
expect(diff.changedAnswers[0]?.previousLabel).toBe('Original text')
expect(diff.changedAnswers[0]?.currentLabel).toBe('Updated text')
})
it('should detect cleared answer', () => {
@@ -206,7 +206,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('Some text')
expect(diff.clearedAnswers[0]?.previousLabel).toBe('Some text')
})
})
@@ -224,7 +224,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('<p>Rich <strong>text</strong> content</p>')
expect(diff.newAnswers[0]?.currentLabel).toBe('<p>Rich <strong>text</strong> content</p>')
})
it('should detect changed answer', () => {
@@ -238,8 +238,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('<p>Original</p>')
expect(diff.changedAnswers[0].currentLabel).toBe('<p>Updated</p>')
expect(diff.changedAnswers[0]?.previousLabel).toBe('<p>Original</p>')
expect(diff.changedAnswers[0]?.currentLabel).toBe('<p>Updated</p>')
})
it('should detect cleared answer', () => {
@@ -264,7 +264,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('2024-01-15')
expect(diff.newAnswers[0]?.currentLabel).toBe('2024-01-15')
})
it('should detect changed answer', () => {
@@ -278,8 +278,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('2024-01-15')
expect(diff.changedAnswers[0].currentLabel).toBe('2024-02-20')
expect(diff.changedAnswers[0]?.previousLabel).toBe('2024-01-15')
expect(diff.changedAnswers[0]?.currentLabel).toBe('2024-02-20')
})
it('should detect cleared answer', () => {
@@ -314,8 +314,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('Medium')
expect(diff.newAnswers[0].previousLabel).toBeNull()
expect(diff.newAnswers[0]?.currentLabel).toBe('Medium')
expect(diff.newAnswers[0]?.previousLabel).toBeNull()
})
it('should detect changed answer (different option selected)', () => {
@@ -337,8 +337,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('Low')
expect(diff.changedAnswers[0].currentLabel).toBe('High')
expect(diff.changedAnswers[0]?.previousLabel).toBe('Low')
expect(diff.changedAnswers[0]?.currentLabel).toBe('High')
})
it('should detect cleared answer (option selected → nothing selected)', () => {
@@ -360,8 +360,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('Medium')
expect(diff.clearedAnswers[0].currentLabel).toBeNull()
expect(diff.clearedAnswers[0]?.previousLabel).toBe('Medium')
expect(diff.clearedAnswers[0]?.currentLabel).toBeNull()
})
})
@@ -385,7 +385,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('Male')
expect(diff.newAnswers[0]?.currentLabel).toBe('Male')
})
it('should detect changed answer', () => {
@@ -407,8 +407,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('Male')
expect(diff.changedAnswers[0].currentLabel).toBe('Female')
expect(diff.changedAnswers[0]?.previousLabel).toBe('Male')
expect(diff.changedAnswers[0]?.currentLabel).toBe('Female')
})
it('should detect cleared answer', () => {
@@ -430,7 +430,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('Other')
expect(diff.clearedAnswers[0]?.previousLabel).toBe('Other')
})
})
@@ -454,7 +454,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('Feature A')
expect(diff.newAnswers[0]?.currentLabel).toBe('Feature A')
})
it('should detect new answer (multiple checkboxes selected)', () => {
@@ -476,7 +476,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('Feature A, Feature B')
expect(diff.newAnswers[0]?.currentLabel).toBe('Feature A, Feature B')
})
it('should detect changed answer (different checkboxes selected)', () => {
@@ -498,8 +498,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].previousLabel).toBe('Feature A')
expect(diff.changedAnswers[0].currentLabel).toBe('Feature B, Feature C')
expect(diff.changedAnswers[0]?.previousLabel).toBe('Feature A')
expect(diff.changedAnswers[0]?.currentLabel).toBe('Feature B, Feature C')
})
it('should detect cleared answer (all checkboxes deselected)', () => {
@@ -521,7 +521,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('Feature A, Feature B')
expect(diff.clearedAnswers[0]?.previousLabel).toBe('Feature A, Feature B')
})
})
@@ -537,7 +537,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('Enabled')
expect(diff.newAnswers[0]?.currentLabel).toBe('Enabled')
})
it('should detect cleared answer (switch turned off)', () => {
@@ -551,7 +551,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('Enabled')
expect(diff.clearedAnswers[0]?.previousLabel).toBe('Enabled')
})
})
@@ -573,11 +573,11 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('2 Zeilen')
expect(diff.newAnswers[0].tableDiff).toBeDefined()
expect(diff.newAnswers[0].tableDiff!.addedCount).toBe(2)
expect(diff.newAnswers[0].tableDiff!.removedCount).toBe(0)
expect(diff.newAnswers[0].tableDiff!.modifiedCount).toBe(0)
expect(diff.newAnswers[0]?.currentLabel).toBe('2 Zeilen')
expect(diff.newAnswers[0]?.tableDiff).toBeDefined()
expect(diff.newAnswers[0]?.tableDiff!.addedCount).toBe(2)
expect(diff.newAnswers[0]?.tableDiff!.removedCount).toBe(0)
expect(diff.newAnswers[0]?.tableDiff!.modifiedCount).toBe(0)
})
it('should detect rows removed', () => {
@@ -594,10 +594,10 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].previousLabel).toBe('2 Zeilen')
expect(diff.clearedAnswers[0].tableDiff).toBeDefined()
expect(diff.clearedAnswers[0].tableDiff!.removedCount).toBe(2)
expect(diff.clearedAnswers[0].tableDiff!.addedCount).toBe(0)
expect(diff.clearedAnswers[0]?.previousLabel).toBe('2 Zeilen')
expect(diff.clearedAnswers[0]?.tableDiff).toBeDefined()
expect(diff.clearedAnswers[0]?.tableDiff!.removedCount).toBe(2)
expect(diff.clearedAnswers[0]?.tableDiff!.addedCount).toBe(0)
})
it('should detect modified rows when row count changes', () => {
@@ -619,12 +619,12 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].tableDiff).toBeDefined()
expect(diff.changedAnswers[0].tableDiff!.addedCount).toBe(1)
expect(diff.changedAnswers[0].tableDiff!.modifiedCount).toBe(1)
expect(diff.changedAnswers[0].tableDiff!.rows[1].changeType).toBe('modified')
expect(diff.changedAnswers[0].tableDiff!.rows[1].previousValues['Name']).toBe('Jane')
expect(diff.changedAnswers[0].tableDiff!.rows[1].currentValues['Name']).toBe('Janet')
expect(diff.changedAnswers[0]?.tableDiff).toBeDefined()
expect(diff.changedAnswers[0]?.tableDiff!.addedCount).toBe(1)
expect(diff.changedAnswers[0]?.tableDiff!.modifiedCount).toBe(1)
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.changeType).toBe('modified')
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.previousValues['Name']).toBe('Jane')
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.currentValues['Name']).toBe('Janet')
})
it('should detect modified rows when row count is the same', () => {
@@ -644,12 +644,12 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].tableDiff).toBeDefined()
expect(diff.changedAnswers[0].tableDiff!.addedCount).toBe(0)
expect(diff.changedAnswers[0].tableDiff!.modifiedCount).toBe(1)
expect(diff.changedAnswers[0].tableDiff!.rows[1].changeType).toBe('modified')
expect(diff.changedAnswers[0].tableDiff!.rows[1].previousValues['Name']).toBe('Jane')
expect(diff.changedAnswers[0].tableDiff!.rows[1].currentValues['Name']).toBe('Janet')
expect(diff.changedAnswers[0]?.tableDiff).toBeDefined()
expect(diff.changedAnswers[0]?.tableDiff!.addedCount).toBe(0)
expect(diff.changedAnswers[0]?.tableDiff!.modifiedCount).toBe(1)
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.changeType).toBe('modified')
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.previousValues['Name']).toBe('Jane')
expect(diff.changedAnswers[0]?.tableDiff!.rows[1]?.currentValues['Name']).toBe('Janet')
})
it('should detect mixed changes (added, removed, modified)', () => {
@@ -669,12 +669,12 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].tableDiff).toBeDefined()
expect(diff.changedAnswers[0]?.tableDiff).toBeDefined()
// Row 0: modified (John → John Updated, Developer → Senior Dev)
// Row 1: modified (Jane → New Person, Designer → Manager)
// Row 2: removed (Bob, Tester)
expect(diff.changedAnswers[0].tableDiff!.modifiedCount).toBe(2)
expect(diff.changedAnswers[0].tableDiff!.removedCount).toBe(1)
expect(diff.changedAnswers[0]?.tableDiff!.modifiedCount).toBe(2)
expect(diff.changedAnswers[0]?.tableDiff!.removedCount).toBe(1)
})
it('should handle single row correctly', () => {
@@ -694,7 +694,7 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].currentLabel).toBe('1 Zeile')
expect(diff.newAnswers[0]?.currentLabel).toBe('1 Zeile')
})
it('should handle boolean values in table cells', () => {
@@ -715,8 +715,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].tableDiff!.rows[0].previousValues['Enabled']).toBe('Nein')
expect(diff.changedAnswers[0].tableDiff!.rows[0].currentValues['Enabled']).toBe('Ja')
expect(diff.changedAnswers[0]?.tableDiff!.rows[0]?.previousValues['Enabled']).toBe('Nein')
expect(diff.changedAnswers[0]?.tableDiff!.rows[0]?.currentValues['Enabled']).toBe('Ja')
})
it('should handle array values in table cells', () => {
@@ -736,8 +736,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].tableDiff!.rows[0].previousValues['Tags']).toBe('Tag1')
expect(diff.changedAnswers[0].tableDiff!.rows[0].currentValues['Tags']).toBe('Tag1, Tag2')
expect(diff.changedAnswers[0]?.tableDiff!.rows[0]?.previousValues['Tags']).toBe('Tag1')
expect(diff.changedAnswers[0]?.tableDiff!.rows[0]?.currentValues['Tags']).toBe('Tag1, Tag2')
})
})
@@ -751,8 +751,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].elementTitle).toBe('Name')
expect(diff.clearedAnswers[0].previousLabel).toBe('John Doe')
expect(diff.clearedAnswers[0]?.elementTitle).toBe('Name')
expect(diff.clearedAnswers[0]?.previousLabel).toBe('John Doe')
})
it('should not report removed element if it had no value', () => {
@@ -777,8 +777,8 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].elementTitle).toBe('Name')
expect(diff.newAnswers[0].currentLabel).toBe('John Doe')
expect(diff.newAnswers[0]?.elementTitle).toBe('Name')
expect(diff.newAnswers[0]?.currentLabel).toBe('John Doe')
})
it('should not report new element if it has no value', () => {
@@ -813,13 +813,13 @@ describe('formDiff', () => {
const diff = compareApplicationFormValues(current, version)
expect(diff.newAnswers).toHaveLength(1)
expect(diff.newAnswers[0].elementTitle).toBe('Name')
expect(diff.newAnswers[0]?.elementTitle).toBe('Name')
expect(diff.changedAnswers).toHaveLength(1)
expect(diff.changedAnswers[0].elementTitle).toBe('Email')
expect(diff.changedAnswers[0]?.elementTitle).toBe('Email')
expect(diff.clearedAnswers).toHaveLength(1)
expect(diff.clearedAnswers[0].elementTitle).toBe('Status')
expect(diff.clearedAnswers[0]?.elementTitle).toBe('Status')
})
})
@@ -1088,8 +1088,8 @@ describe('formDiff', () => {
const grouped = groupChangesBySection(diff)
expect(grouped).toHaveLength(1)
expect(grouped[0].sectionTitle).toBe('Section A')
expect(grouped[0].changes).toHaveLength(3)
expect(grouped[0]?.sectionTitle).toBe('Section A')
expect(grouped[0]?.changes).toHaveLength(3)
})
})
})