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:
@@ -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();
|
||||
});
|
||||
});
|
||||
41
frontend/src/lib/hooks/useFileLoader.svelte.ts
Normal file
41
frontend/src/lib/hooks/useFileLoader.svelte.ts
Normal 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
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user