fixed tests and Code edit and delete Name in TatortList

This commit is contained in:
2025-09-11 16:52:54 +02:00
parent 47ca05f2d4
commit bcf24122bc
4 changed files with 139 additions and 128 deletions

View File

@@ -1,94 +1,103 @@
import { fireEvent, getByTestId, queryAllByTestId, render, screen, within } from '@testing-library/svelte';
import { describe, expect, it, test, vi } from "vitest";
import TatortListPage from "../src/routes/(token-based)/list/[vorgang]/+page.svelte";
// @vitest-environment jsdom
import { render, fireEvent, screen, within } from '@testing-library/svelte';
import { describe, it, expect, vi, test } from 'vitest';
import * as nav from '$app/navigation';
import TatortListPage from '../src/routes/(token-based)/list/[vorgang]/+page.svelte';
import { baseData } from './fixtures';
import { invalidateAll } from '$app/navigation';
import { tick } from 'svelte';
// Mock für invalidateAll
vi.mock('$app/navigation', () => ({
invalidateAll: vi.fn()
}));
vi.spyOn(nav, 'invalidateAll').mockResolvedValue();
global.fetch = vi.fn().mockResolvedValue({ ok: true });
describe('Seite: Vorgangsansicht', () => {
test.todo('Share Link disabled wenn Liste leer');
describe('Szenario: Admin + Liste gefüllt', () => {
describe('Szenario: Admin + Liste gefüllt - Funktionalität', () => {
test.todo('Share Link Link generierung richtig');
it('ändert den Namen nach Speichern', async () => {
const testData = structuredClone(baseData);
const oldName = testData.crimesList[0].name;
const newName = 'Fall-B';
const list = testData.crimesList
const vorgangToken = testData.vorgang.vorgangToken
// Minimaler fetch-Mock
global.fetch = vi.fn().mockResolvedValue({ ok: true }) as typeof fetch;
const { getAllByTestId } = render(TatortListPage, { props: { data: testData } });
it('führt PUT-Request aus und aktualisiert UI nach onSave', async () => {
const data = structuredClone(baseData);
const oldName = data.crimesList[0].name;
const newName = 'Fall-C';
const firstItem = getAllByTestId('test-list-item')[0];
const editButton = within(firstItem).getByTestId('edit-button');
await fireEvent.click(editButton);
render(TatortListPage, { props: { data } });
const listItem = screen.getAllByTestId('test-list-item')[0];
// teste ob alter Name angezeigt:
expect(listItem).toHaveTextContent(oldName);
const input = within(firstItem).getByTestId('test-input');
expect(input).toHaveValue(oldName)
await fireEvent.input(input, { target: { value: newName } });
// Editmodus
await fireEvent.click(within(listItem).getByTestId('edit-button'));
const input = within(listItem).getByTestId('test-input');
await fireEvent.input(input, { target: { value: newName } });
const commitButton = within(firstItem).getByTestId('commit-button');
await fireEvent.click(commitButton);
// Commit
await fireEvent.click(within(listItem).getByTestId('commit-button'));
await Promise.resolve(); // wartet reaktive Updates ab
// const fetchMock = global.fetch as ReturnType<typeof vi.fn>;
// console.log('Fetch calls:', fetchMock.mock.calls);
// FETCH-CHECK
expect(global.fetch).toHaveBeenCalledWith(
`/api/list/${data.vorgang.vorgangToken}/${oldName}`,
expect.objectContaining({
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
vorgangToken: data.vorgang.vorgangToken,
oldName,
newName
})
})
);
// // Erwartung: fetch wurde aufgerufen
// expect(global.fetch).toHaveBeenCalledWith(
// expect.stringContaining(`/api/list/${vorgangToken}/${oldName}`),
// expect.objectContaining({
// method: 'PUT',
// headers: { 'Content-Type': 'application/json' },
// body: JSON.stringify({vorgangToken, oldName, newName})
// })
// );
// INVALIDATE-CHECK
expect(nav.invalidateAll).toHaveBeenCalled();
// expect(invalidateAll).toHaveBeenCalled();
// Erwartung: neuer Name ist sofort im DOM sichtbar
// expect(within(firstItem).getByRole('textbox')).toHaveValue(newName);
// const editedLink = within(firstItem).getByRole('link');
// const editedExpectedHref = `/view/${vorgangToken}/${newName}?pin=${testData.vorgang.vorgangPIN}`;
// expect(editedLink).toBeInTheDocument();
// expect(editedLink).toHaveAttribute('href', editedExpectedHref);
// expect(editedLink).toHaveAttribute('title', newName);
// UI-UPDATE
expect(within(listItem).getByText(newName)).toBeInTheDocument();
});
// it('entfernt das Listenelement nach Löschen', async () => {
// const testData = structuredClone(baseData);
// testData.url = new URL('https://example.com/vorgang-1'); // Fix für Invalid URL
// const toDelete = testData.crimesList[0];
it('führt DELETE-Request aus und entfernt Element aus UI', async () => {
const testData = structuredClone(baseData);
const oldName = testData.crimesList[0].name;
// global.fetch = vi.fn().mockResolvedValue({ ok: true });
// Rendern und initiale Liste prüfen
render(TatortListPage, { props: { data: testData } });
const initialItems = screen.getAllByTestId('test-list-item');
expect(initialItems).toHaveLength(testData.crimesList.length);
// render(TatortListPage, { props: { data: testData } });
// const deletedFirstItem = screen.getAllByTestId('test-list-item')[0];
// const deletedLink = within(deletedFirstItem).getByRole('link');
// const deletedExpectedHref = `/view/${testData.vorgang.vorgangToken}/${toDelete.name}?pin=${testData.vorgang.vorgangPIN}`;
const listItem = screen.getAllByTestId('test-list-item')[0];
// teste ob alter Name angezeigt:
expect(listItem).toHaveTextContent(oldName);
// Delete-Button klicken
const del = within(listItem).getByTestId('delete-button');
expect(del).toBeInTheDocument()
await fireEvent.click(within(listItem).getByTestId('delete-button'));
// auf reaktive Updates warten
await tick();
// expect(deletedLink).toBeInTheDocument();
// expect(deletedLink).toHaveAttribute('href', deletedExpectedHref);
// expect(deletedLink).toHaveAttribute('title', toDelete.name);
// await fireEvent.click(within(deletedFirstItem).getByTestId('delete-button'));
// FETCH-CHECK: URL & Payload
// entspricht: new URL(data.url).pathname + '/' + oldName
const expectedPath = new URL(testData.url).pathname;
expect(global.fetch).toHaveBeenCalledWith(
`/api${expectedPath}/${oldName}`,
expect.objectContaining({
method: 'DELETE',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
vorgangToken: testData.vorgang.vorgangToken,
tatort: oldName
})
})
);
// INVALIDATE-CHECK
expect(nav.invalidateAll).toHaveBeenCalled();
// // Erwartung: fetch wurde aufgerufen
// expect(global.fetch).toHaveBeenCalledWith(
// expect.stringContaining(`/api/vorgang-1/${toDelete.name}`),
// expect.any(Object)
// );
// UI-UPDATE: Element entfernt
const updatedItems = screen.queryAllByTestId('test-list-item');
expect(updatedItems).toHaveLength(testData.crimesList.length - 1);
expect(screen.queryByText(oldName)).toBeNull();
// // Erwartung: Element ist nicht mehr im DOM
// expect(within(deletedFirstItem).getByRole('textbox')).toHaveValue(toDelete.name);
// });
});
});
});

View File

@@ -6,7 +6,7 @@ id: "admin",
}
const testCrimesList = [
{
name: 'modell-A',
name: 'Fall-A',
lastModified: '2025-08-28T09:44:12.453Z',
etag: '558f35716f6af953f9bb5d75f6d77e6a',
size: 8947140,
@@ -14,7 +14,7 @@ const testCrimesList = [
show_button: true
},
{
name: 'Fall-A',
name: 'Fall-B',
lastModified: '2025-08-28T10:37:20.142Z',
etag: '43e3989c32c4682bee407baaf83b6fa0',
size: 35788560,
@@ -42,6 +42,6 @@ export const baseData = {
vorgang: testVorgangsList[0],
vorgangList: testVorgangsList,
crimesList: testCrimesList,
url: new URL(`https://example.com/${testVorgangsList[0].vorgangToken}`),
url: `https://example.com/${testVorgangsList[0].vorgangToken}`,
crimeNames: [ "modell-A", "Fall-A" ],
}