c-l/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2024-12-28 06:31:58 +00:00
Code Releases Activity

fix(web): clear combobox value when selectedOption is undefined (#14334)

Browse source
This commit is contained in:
Michel Heusschen 2024-11-25 15:14:21 +01:00 committed by GitHub
parent b9e98d2706
commit 447ff6fcb3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 42 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
web/src/lib/__mocks__/visual-viewport.mock.ts Normal file
View file

@ -0,0 +1,9 @@
export const getVisualViewportMock = () => ({
height: window.innerHeight,
width: window.innerWidth,
scale: 1,
offsetLeft: 0,
offsetTop: 0,
addEventListener: vi.fn(),
removeEventListener: vi.fn(),
});

30
web/src/lib/components/shared-components/__test__/combobox.spec.ts Normal file
View file

@ -0,0 +1,30 @@
import { getIntersectionObserverMock } from '$lib/__mocks__/intersection-observer.mock';
import { getVisualViewportMock } from '$lib/__mocks__/visual-viewport.mock';
import Combobox from '$lib/components/shared-components/combobox.svelte';
import { render, screen } from '@testing-library/svelte';
describe('Combobox component', () => {
beforeAll(() => {
vi.stubGlobal('IntersectionObserver', getIntersectionObserverMock());
vi.stubGlobal('visualViewport', getVisualViewportMock());
});
it('shows selected option', () => {
render(Combobox, {
label: 'test',
selectedOption: { label: 'option-1', value: 'option-1' },
});
expect(screen.getByRole('combobox')).toHaveValue('option-1');
});
it('clears the selected option when set to undefined', async () => {
const { rerender } = render(Combobox, {
label: 'test',
selectedOption: { label: 'option-1', value: 'option-1' },
});
await rerender({ selectedOption: undefined });
expect(screen.getByRole('combobox')).toHaveValue('');
});
});

12
web/src/lib/components/shared-components/change-date.spec.ts
View file

@ -1,4 +1,5 @@
import { getIntersectionObserverMock } from '$lib/__mocks__/intersection-observer.mock';
import { getVisualViewportMock } from '$lib/__mocks__/visual-viewport.mock';
import { fireEvent, render, screen } from '@testing-library/svelte';
import { DateTime } from 'luxon';
import ChangeDate from './change-date.svelte';
@ -16,16 +17,7 @@ describe('ChangeDate component', () => {
beforeEach(() => {
vi.stubGlobal('IntersectionObserver', getIntersectionObserverMock());
vi.stubGlobal('visualViewport', {
height: window.innerHeight,
width: window.innerWidth,
scale: 1,
offsetLeft: 0,
offsetTop: 0,
addEventListener: vi.fn(),
removeEventListener: vi.fn(),
});
vi.stubGlobal('visualViewport', getVisualViewportMock());
});
afterEach(() => {

2
web/src/lib/components/shared-components/combobox.svelte
View file

@ -218,7 +218,7 @@
const getInputPosition = () => input?.getBoundingClientRect();
$effect(() => {
// searchQuery = selectedOption ? selectedOption.label : '';
searchQuery = selectedOption ? selectedOption.label : '';
});
let filteredOptions = $derived(