refactor(fileloader): extract createFileLoader hook from document/enrich pages

Move blob URL lifecycle management into a reusable createFileLoader()
hook that owns revoke-before-create and revoke-on-destroy. Replace
identical inline logic in documents/[id] and enrich/[id] with the hook.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-15 13:20:32 +02:00
parent dbf7f0bc16
commit 34e7436fdc
4 changed files with 154 additions and 62 deletions

View File

@@ -0,0 +1,98 @@
import { describe, it, expect, vi, afterEach } from 'vitest';
import { createFileLoader } from '../useFileLoader.svelte';
const FAKE_URL = 'blob:fake-url';
function setupFetch(ok: boolean, body?: Blob) {
const blob = body ?? new Blob(['fake'], { type: 'application/pdf' });
vi.stubGlobal(
'fetch',
vi.fn().mockResolvedValue({
ok,
blob: vi.fn().mockResolvedValue(blob)
})
);
}
afterEach(() => {
vi.unstubAllGlobals();
vi.restoreAllMocks();
});
describe('createFileLoader', () => {
it('sets fileUrl after a successful fetch', async () => {
vi.stubGlobal('URL', {
createObjectURL: vi.fn().mockReturnValue(FAKE_URL),
revokeObjectURL: vi.fn()
});
setupFetch(true);
const loader = createFileLoader();
await loader.loadFile('/api/documents/1/file');
expect(loader.fileUrl).toBe(FAKE_URL);
expect(loader.isLoading).toBe(false);
expect(loader.fileError).toBe('');
});
it('sets fileError on a failed fetch (non-ok response)', async () => {
vi.stubGlobal('URL', {
createObjectURL: vi.fn(),
revokeObjectURL: vi.fn()
});
setupFetch(false);
const loader = createFileLoader();
await loader.loadFile('/api/documents/1/file');
expect(loader.fileUrl).toBe('');
expect(loader.fileError).not.toBe('');
expect(loader.isLoading).toBe(false);
});
it('revokes the previous URL before creating a new one', async () => {
const revokeObjectURL = vi.fn();
vi.stubGlobal('URL', {
createObjectURL: vi.fn().mockReturnValue(FAKE_URL),
revokeObjectURL
});
setupFetch(true);
const loader = createFileLoader();
await loader.loadFile('/api/documents/1/file');
// First load: no previous URL to revoke
expect(revokeObjectURL).not.toHaveBeenCalled();
await loader.loadFile('/api/documents/2/file');
// Second load: previous URL should be revoked
expect(revokeObjectURL).toHaveBeenCalledWith(FAKE_URL);
});
it('revokes the URL on destroy', async () => {
const revokeObjectURL = vi.fn();
vi.stubGlobal('URL', {
createObjectURL: vi.fn().mockReturnValue(FAKE_URL),
revokeObjectURL
});
setupFetch(true);
const loader = createFileLoader();
await loader.loadFile('/api/documents/1/file');
loader.destroy();
expect(revokeObjectURL).toHaveBeenCalledWith(FAKE_URL);
});
it('does not revoke when no URL has been set', () => {
const revokeObjectURL = vi.fn();
vi.stubGlobal('URL', {
createObjectURL: vi.fn(),
revokeObjectURL
});
const loader = createFileLoader();
loader.destroy();
expect(revokeObjectURL).not.toHaveBeenCalled();
});
});

View File

@@ -0,0 +1,41 @@
export function createFileLoader() {
let fileUrl = $state('');
let isLoading = $state(false);
let fileError = $state('');
async function loadFile(url: string): Promise<void> {
isLoading = true;
fileError = '';
if (fileUrl) URL.revokeObjectURL(fileUrl);
fileUrl = '';
try {
const response = await fetch(url);
if (!response.ok) throw new Error('Failed to load file');
const blob = await response.blob();
fileUrl = URL.createObjectURL(blob);
} catch {
fileError = 'Vorschau konnte nicht geladen werden.';
} finally {
isLoading = false;
}
}
function destroy(): void {
if (fileUrl) URL.revokeObjectURL(fileUrl);
}
return {
get fileUrl() {
return fileUrl;
},
get isLoading() {
return isLoading;
},
get fileError() {
return fileError;
},
loadFile,
destroy
};
}