From 19313e75fd1860f7da56fd23dc9f3dabfe9478b6 Mon Sep 17 00:00:00 2001 From: Mees Frensel <33722705+meesfrensel@users.noreply.github.com> Date: Fri, 10 Jul 2026 14:30:12 +0200 Subject: [PATCH] chore(web): fix testing deprecations (#29799) --- .../asset-viewer/AssetViewerNavBar.spec.ts | 19 ++++++++++--------- .../asset-viewer/actions/DeleteAction.spec.ts | 12 +++++------- .../thumbnail/__test__/Thumbnail.spec.ts | 9 +++++---- .../side-bar/RecentAlbums.spec.ts | 2 +- .../elements/__test__/FormatMessage.spec.ts | 2 +- .../timeline-manager.svelte.spec.ts | 18 +++++++++--------- .../lib/services/shared-link.service.spec.ts | 18 ++++++++---------- web/src/lib/utils/date-time.spec.ts | 8 ++++---- web/src/lib/utils/executor-queue.spec.ts | 2 +- 9 files changed, 44 insertions(+), 46 deletions(-) diff --git a/web/src/lib/components/asset-viewer/AssetViewerNavBar.spec.ts b/web/src/lib/components/asset-viewer/AssetViewerNavBar.spec.ts index 3ba6be59b1..7c2c3a6bee 100644 --- a/web/src/lib/components/asset-viewer/AssetViewerNavBar.spec.ts +++ b/web/src/lib/components/asset-viewer/AssetViewerNavBar.spec.ts @@ -7,6 +7,16 @@ import { preferencesFactory } from '@test-data/factories/preferences-factory'; import { userAdminFactory } from '@test-data/factories/user-factory'; import AssetViewerNavBar from './AssetViewerNavBar.svelte'; +vi.mock(import('$lib/managers/feature-flags-manager.svelte'), function () { + return { + featureFlagsManager: { + init: vi.fn(), + loadFeatureFlags: vi.fn(), + value: { smartSearch: true, trash: true }, + } as never, + }; +}); + describe('AssetViewerNavBar component', () => { const additionalProps = { preAction: () => {}, @@ -24,15 +34,6 @@ describe('AssetViewerNavBar component', () => { }; }); vi.stubGlobal('ResizeObserver', getResizeObserverMock()); - vi.mock(import('$lib/managers/feature-flags-manager.svelte'), function () { - return { - featureFlagsManager: { - init: vi.fn(), - loadFeatureFlags: vi.fn(), - value: { smartSearch: true, trash: true }, - } as never, - }; - }); }); afterEach(() => { diff --git a/web/src/lib/components/asset-viewer/actions/DeleteAction.spec.ts b/web/src/lib/components/asset-viewer/actions/DeleteAction.spec.ts index 6cd95ab02a..d715540d3d 100644 --- a/web/src/lib/components/asset-viewer/actions/DeleteAction.spec.ts +++ b/web/src/lib/components/asset-viewer/actions/DeleteAction.spec.ts @@ -4,16 +4,14 @@ import { renderWithTooltips } from '$tests/helpers'; import { assetFactory } from '@test-data/factories/asset-factory'; import DeleteAction from './DeleteAction.svelte'; +vi.mock(import('$lib/managers/feature-flags-manager.svelte'), () => { + // eslint-disable-next-line @typescript-eslint/no-explicit-any + return { featureFlagsManager: { init: vi.fn(), loadFeatureFlags: vi.fn(), value: { trash: true } } as any }; +}); + let asset: AssetResponseDto; describe('DeleteAction component', () => { - beforeEach(() => { - vi.mock(import('$lib/managers/feature-flags-manager.svelte'), () => { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - return { featureFlagsManager: { init: vi.fn(), loadFeatureFlags: vi.fn(), value: { trash: true } } as any }; - }); - }); - describe('given an asset which is not trashed yet', () => { beforeEach(() => { asset = assetFactory.build({ isTrashed: false }); diff --git a/web/src/lib/components/assets/thumbnail/__test__/Thumbnail.spec.ts b/web/src/lib/components/assets/thumbnail/__test__/Thumbnail.spec.ts index 8b4e346ee3..c65f286ddf 100644 --- a/web/src/lib/components/assets/thumbnail/__test__/Thumbnail.spec.ts +++ b/web/src/lib/components/assets/thumbnail/__test__/Thumbnail.spec.ts @@ -4,6 +4,11 @@ import Thumbnail from '$lib/components/assets/thumbnail/Thumbnail.svelte'; import { getTabbable } from '$lib/utils/focus-util'; import { assetFactory } from '@test-data/factories/asset-factory'; +vi.mock('$lib/utils/navigation', () => ({ + currentUrlReplaceAssetId: vi.fn(), + isSharedLinkRoute: vi.fn().mockReturnValue(false), +})); + vi.hoisted(() => { Object.defineProperty(globalThis, 'matchMedia', { writable: true, @@ -26,10 +31,6 @@ vi.hoisted(() => { describe('Thumbnail component', () => { beforeAll(() => { vi.stubGlobal('IntersectionObserver', getIntersectionObserverMock()); - vi.mock('$lib/utils/navigation', () => ({ - currentUrlReplaceAssetId: vi.fn(), - isSharedLinkRoute: vi.fn().mockReturnValue(false), - })); }); it('should only contain a single tabbable element (the container)', () => { diff --git a/web/src/lib/components/shared-components/side-bar/RecentAlbums.spec.ts b/web/src/lib/components/shared-components/side-bar/RecentAlbums.spec.ts index fef8d5b1f2..1745aa022c 100644 --- a/web/src/lib/components/shared-components/side-bar/RecentAlbums.spec.ts +++ b/web/src/lib/components/shared-components/side-bar/RecentAlbums.spec.ts @@ -16,7 +16,7 @@ describe('RecentAlbums component', () => { sdkMock.getAllAlbums.mockResolvedValueOnce([...albums]); render(RecentAlbums); - expect(sdkMock.getAllAlbums).toBeCalledTimes(1); + expect(sdkMock.getAllAlbums).toHaveBeenCalledOnce(); // wtf await tick(); diff --git a/web/src/lib/elements/__test__/FormatMessage.spec.ts b/web/src/lib/elements/__test__/FormatMessage.spec.ts index 92db70a486..af51b66f45 100644 --- a/web/src/lib/elements/__test__/FormatMessage.spec.ts +++ b/web/src/lib/elements/__test__/FormatMessage.spec.ts @@ -35,7 +35,7 @@ describe('FormatMessage component', () => { it('throws an error when locale is empty', async () => { await locale.set(undefined); - expect(() => render(FormatMessage, { key: '' as Translations })).toThrowError(); + expect(() => render(FormatMessage, { key: '' as Translations })).toThrow(); await locale.set('en'); }); diff --git a/web/src/lib/managers/timeline-manager/timeline-manager.svelte.spec.ts b/web/src/lib/managers/timeline-manager/timeline-manager.svelte.spec.ts index 193b0b07f5..1762553897 100644 --- a/web/src/lib/managers/timeline-manager/timeline-manager.svelte.spec.ts +++ b/web/src/lib/managers/timeline-manager/timeline-manager.svelte.spec.ts @@ -70,7 +70,7 @@ describe('TimelineManager', () => { }); it('should load months in viewport', () => { - expect(sdkMock.getTimeBuckets).toBeCalledTimes(1); + expect(sdkMock.getTimeBuckets).toHaveBeenCalledOnce(); expect(sdkMock.getTimeBucket).toHaveBeenCalledTimes(2); }); @@ -133,13 +133,13 @@ describe('TimelineManager', () => { it('loads a month', async () => { expect(getTimelineMonthByDate(timelineManager, { year: 2024, month: 1 })?.getAssets().length).toEqual(0); await timelineManager.loadTimelineMonth({ year: 2024, month: 1 }); - expect(sdkMock.getTimeBucket).toBeCalledTimes(1); + expect(sdkMock.getTimeBucket).toHaveBeenCalledOnce(); expect(getTimelineMonthByDate(timelineManager, { year: 2024, month: 1 })?.getAssets().length).toEqual(3); }); it('ignores invalid months', async () => { await timelineManager.loadTimelineMonth({ year: 2023, month: 1 }); - expect(sdkMock.getTimeBucket).toBeCalledTimes(0); + expect(sdkMock.getTimeBucket).not.toHaveBeenCalled(); }); it('cancels month loading', async () => { @@ -147,7 +147,7 @@ describe('TimelineManager', () => { void timelineManager.loadTimelineMonth({ year: 2024, month: 1 }); const abortSpy = vi.spyOn(month!.loader!.cancelToken!, 'abort'); month?.cancel(); - expect(abortSpy).toBeCalledTimes(1); + expect(abortSpy).toHaveBeenCalledOnce(); await timelineManager.loadTimelineMonth({ year: 2024, month: 1 }); expect(getTimelineMonthByDate(timelineManager, { year: 2024, month: 1 })?.getAssets().length).toEqual(3); }); @@ -157,10 +157,10 @@ describe('TimelineManager', () => { timelineManager.loadTimelineMonth({ year: 2024, month: 1 }), timelineManager.loadTimelineMonth({ year: 2024, month: 1 }), ]); - expect(sdkMock.getTimeBucket).toBeCalledTimes(1); + expect(sdkMock.getTimeBucket).toHaveBeenCalledOnce(); await timelineManager.loadTimelineMonth({ year: 2024, month: 1 }); - expect(sdkMock.getTimeBucket).toBeCalledTimes(1); + expect(sdkMock.getTimeBucket).toHaveBeenCalledOnce(); }); it('allows loading a canceled month', async () => { @@ -283,7 +283,7 @@ describe('TimelineManager', () => { const asset = deriveLocalDateTimeFromFileCreatedAt(timelineAssetFactory.build()); timelineManager.upsertAssets([asset]); - expect(updateAssetsSpy).toBeCalledWith([asset]); + expect(updateAssetsSpy).toHaveBeenCalledWith([asset]); expect(timelineManager.assetCount).toEqual(1); }); @@ -642,8 +642,8 @@ describe('TimelineManager', () => { const previousMonthSpy = vi.spyOn(previousMonth!.loader!, 'execute'); const previous = await timelineManager.getLaterAsset(a); expect(previous).toEqual(b); - expect(loadTimelineMonthSpy).toBeCalledTimes(0); - expect(previousMonthSpy).toBeCalledTimes(0); + expect(loadTimelineMonthSpy).not.toHaveBeenCalled(); + expect(previousMonthSpy).not.toHaveBeenCalled(); }); it('skips removed assets', async () => { diff --git a/web/src/lib/services/shared-link.service.spec.ts b/web/src/lib/services/shared-link.service.spec.ts index a2761d2eea..e59b527245 100644 --- a/web/src/lib/services/shared-link.service.spec.ts +++ b/web/src/lib/services/shared-link.service.spec.ts @@ -2,17 +2,15 @@ import type { ServerConfigDto } from '@immich/sdk'; import { asUrl } from '$lib/services/shared-link.service'; import { sharedLinkFactory } from '@test-data/factories/shared-link-factory'; -describe('SharedLinkService', () => { - beforeAll(() => { - vi.mock(import('$lib/managers/server-config-manager.svelte'), () => ({ - serverConfigManager: { - value: { externalDomain: 'http://localhost:2283' } as ServerConfigDto, - init: vi.fn(), - loadServerConfig: vi.fn(), - }, - })); - }); +vi.mock(import('$lib/managers/server-config-manager.svelte'), () => ({ + serverConfigManager: { + value: { externalDomain: 'http://localhost:2283' } as ServerConfigDto, + init: vi.fn(), + loadServerConfig: vi.fn(), + }, +})); +describe('SharedLinkService', () => { describe('asUrl', () => { it('should properly encode characters in slug', () => { expect(asUrl(sharedLinkFactory.build({ slug: 'foo/bar' }))).toBe('http://localhost:2283/s/foo%2Fbar'); diff --git a/web/src/lib/utils/date-time.spec.ts b/web/src/lib/utils/date-time.spec.ts index f91a74c6b9..555c9b82be 100644 --- a/web/src/lib/utils/date-time.spec.ts +++ b/web/src/lib/utils/date-time.spec.ts @@ -1,6 +1,10 @@ import { writable } from 'svelte/store'; import { getAlbumDateRange, getShortDateRange } from './date-time'; +vitest.mock('$lib/stores/preferences.store', () => ({ + locale: writable('en'), +})); + describe('getShortDateRange', () => { beforeEach(() => { vi.stubEnv('TZ', 'UTC'); @@ -41,10 +45,6 @@ describe('getShortDateRange', () => { describe('getAlbumDate', () => { beforeAll(() => { process.env.TZ = 'UTC'; - - vitest.mock('$lib/stores/preferences.store', () => ({ - locale: writable('en'), - })); }); it('should work with only a start date', () => { diff --git a/web/src/lib/utils/executor-queue.spec.ts b/web/src/lib/utils/executor-queue.spec.ts index 434263a182..867cc78448 100644 --- a/web/src/lib/utils/executor-queue.spec.ts +++ b/web/src/lib/utils/executor-queue.spec.ts @@ -34,7 +34,7 @@ describe('Executor Queue test', function () { // The last task will be executed after 200ms and will finish at 400ms void eq.addTask(() => timeoutPromiseBuilder(200, 'T4')); - expect(finished).not.toBeCalled(); + expect(finished).not.toHaveBeenCalled(); expect(started).toHaveBeenCalledTimes(3); vi.advanceTimersByTime(100);