fixed tests and Code edit and delete Name in TatortList
This commit is contained in:
@@ -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);
|
||||
// });
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
@@ -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" ],
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user