devsyncwrld/backspace
1
0
Fork 0
Code Issues Pull Requests Actions 26 Packages Projects Releases Wiki Activity

feat(web): saveImage routes through transferStore

Browse Source
This commit is contained in:
Jannis Braun
2026-05-02 17:05:51 +02:00
parent 2be243336b
commit d3f45dbda4
2 changed files with 86 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/utils/imageActions.test.ts
+61 -24
View File
@@ -8,58 +8,95 @@ vi.mock('../stores/uiStore', () => ({
},
}));
const mockStartDownload = vi.fn();
const mockGet = vi.fn();
vi.mock('../stores/transferStore', () => ({
useTransferStore: {
getState: vi.fn(() => ({
startDownload: mockStartDownload,
get: mockGet,
})),
},
}));
import { saveImage, copyImageToClipboard } from './imageActions';
import { useUIStore } from '../stores/uiStore';
describe('saveImage', () => {
let createElementSpy: ReturnType<typeof vi.spyOn>;
let mockAnchor: { href: string; download: string; click: ReturnType<typeof vi.fn>; remove: ReturnType<typeof vi.fn> };
beforeEach(() => {
mockAnchor = { href: '', download: '', click: vi.fn(), remove: vi.fn() };
createElementSpy = vi.spyOn(document, 'createElement').mockReturnValue(mockAnchor as any);
vi.spyOn(document.body, 'appendChild').mockImplementation((node) => node);
vi.spyOn(URL, 'createObjectURL').mockReturnValue('blob:mock-url');
vi.spyOn(URL, 'revokeObjectURL').mockImplementation(() => {});
mockStartDownload.mockReset();
mockGet.mockReset();
});
afterEach(() => {
vi.restoreAllMocks();
});
it('fetches image as blob and triggers download for same-origin URLs', async () => {
const mockBlob = new Blob(['img'], { type: 'image/png' });
vi.spyOn(globalThis, 'fetch').mockResolvedValue(new Response(mockBlob));
it('routes downloads through transferStore.startDownload with derived filename', async () => {
mockStartDownload.mockResolvedValue('transfer-id-1');
mockGet.mockReturnValue({ id: 'transfer-id-1', state: 'completed' });
await saveImage('/api/uploads/abc123_photo.png');
expect(fetch).toHaveBeenCalledWith('/api/uploads/abc123_photo.png');
expect(URL.createObjectURL).toHaveBeenCalledWith(mockBlob);
expect(mockAnchor.download).toBe('abc123_photo.png');
expect(mockAnchor.click).toHaveBeenCalled();
expect(URL.revokeObjectURL).toHaveBeenCalledWith('blob:mock-url');
expect(mockStartDownload).toHaveBeenCalledWith('/api/uploads/abc123_photo.png', {
filename: 'abc123_photo.png',
mimetype: 'image/*',
tray: true,
});
});
it('uses provided filename when given', async () => {
const mockBlob = new Blob(['img'], { type: 'image/png' });
vi.spyOn(globalThis, 'fetch').mockResolvedValue(new Response(mockBlob));
mockStartDownload.mockResolvedValue('transfer-id-2');
mockGet.mockReturnValue({ id: 'transfer-id-2', state: 'completed' });
await saveImage('/api/uploads/abc123.png', 'my-photo.png');
expect(mockAnchor.download).toBe('my-photo.png');
expect(mockStartDownload).toHaveBeenCalledWith('/api/uploads/abc123.png', {
filename: 'my-photo.png',
mimetype: 'image/*',
tray: true,
});
});
it('falls back to window.open on CORS/fetch error and shows toast', async () => {
vi.spyOn(globalThis, 'fetch').mockRejectedValue(new TypeError('Failed to fetch'));
it('falls back to window.open and toast when startDownload throws', async () => {
mockStartDownload.mockRejectedValue(new TypeError('Failed to fetch'));
const openSpy = vi.spyOn(window, 'open').mockImplementation(() => null);
const mockAddToast = vi.fn();
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as any);
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as ReturnType<typeof useUIStore.getState>);
await saveImage('https://media.tenor.com/abc/tenor.gif');
expect(openSpy).toHaveBeenCalledWith('https://media.tenor.com/abc/tenor.gif', '_blank', 'noopener');
expect(mockAddToast).toHaveBeenCalledWith('Opened in new tab', 'info', 3000);
});
it('falls back to window.open when transfer ends in failed state', async () => {
mockStartDownload.mockResolvedValue('transfer-id-3');
mockGet.mockReturnValue({
id: 'transfer-id-3',
state: 'failed',
error: { message: 'HTTP 404', permanent: true },
});
const openSpy = vi.spyOn(window, 'open').mockImplementation(() => null);
const mockAddToast = vi.fn();
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as ReturnType<typeof useUIStore.getState>);
await saveImage('https://external.com/img.png');
expect(openSpy).toHaveBeenCalledWith('https://external.com/img.png', '_blank', 'noopener');
expect(mockAddToast).toHaveBeenCalledWith('Opened in new tab', 'info', 3000);
});
it('stays silent when user cancels (state aborted)', async () => {
mockStartDownload.mockResolvedValue('transfer-id-4');
mockGet.mockReturnValue({ id: 'transfer-id-4', state: 'aborted' });
const openSpy = vi.spyOn(window, 'open').mockImplementation(() => null);
await saveImage('/api/uploads/cancelled.png');
expect(openSpy).not.toHaveBeenCalled();
});
});
describe('copyImageToClipboard', () => {
@@ -89,7 +126,7 @@ describe('copyImageToClipboard', () => {
clipboard: { write: vi.fn(), writeText: mockWriteText },
});
const mockAddToast = vi.fn();
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as any);
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as ReturnType<typeof useUIStore.getState>);
await copyImageToClipboard('https://media.tenor.com/abc/tenor.gif');
@@ -104,7 +141,7 @@ describe('copyImageToClipboard', () => {
clipboard: { write: vi.fn(), writeText: mockWriteText },
});
const mockAddToast = vi.fn();
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as any);
vi.mocked(useUIStore.getState).mockReturnValue({ addToast: mockAddToast } as ReturnType<typeof useUIStore.getState>);
await copyImageToClipboard('https://external.com/image.jpg');