Svelte 애플리케이션을 테스트하기 위해서는 Svelte Testing Library나 Jest와 같은 테스트 도구를 사용할 수 있습니다. 이들 도구를 사용하면 Svelte 컴포넌트의 상태, 프로퍼티, 이벤트 등을 테스트할 수 있습니다. 아래는 Svelte Testing Library를 사용한 테스트 코드의 예시입니다.

import { render, screen, fireEvent } from '@testing-library/svelte';
import Counter from './Counter.svelte';

it('increments the counter when button is clicked', async () => {
  render(Counter);

  const button = screen.getByRole('button');
  const counter = screen.getByText('0');

  expect(counter.textContent).toBe('0');

  await fireEvent.click(button);

  expect(counter.textContent).toBe('1');
});

위의 예시에서는 Counter.svelte라는 Svelte 컴포넌트를 테스트하고 있습니다. 테스트 코드에서는 render 함수를 사용하여 컴포넌트를 렌더링하고, getByRole과 getByText 함수를 사용하여 DOM 요소를 선택합니다. fireEvent 함수를 사용하여 버튼 클릭 이벤트를 시뮬레이트합니다. 마지막으로, expect 함수를 사용하여 특정 조건이 만족되는지를 검증합니다.

이 외에도 Svelte 컴포넌트를 단위 테스트할 수 있는 다른 방법들이 있습니다. Jest와 같은 테스트 프레임워크를 사용하여 테스트할 수도 있습니다. 예를 들어, 아래는 Jest를 사용한 테스트 코드의 예시입니다.

import Counter from './Counter.svelte';

test('increments the counter when button is clicked', () => {
  const component = new Counter({
    target: document.body
  });

  const button = document.querySelector('button');
  const counter = document.querySelector('span');

  expect(counter.textContent).toBe('0');

  button.click();

  expect(counter.textContent).toBe('1');

  component.$destroy();
});

위의 예시에서도 Counter.svelte라는 Svelte 컴포넌트를 테스트하고 있습니다. 테스트 코드에서는 new Counter(...)를 사용하여 컴포넌트 인스턴스를 생성하고, DOM 요소를 선택하여 이벤트를 시뮬레이트하고 결과를 검증합니다. component.$destroy()를 사용하여 컴포넌트 인스턴스를 정리합니다.

Svelte에서는 테스트를 위해 Svelte Testing Library와 Jest를 비롯한 다양한 테스트 도구를 활용할 수 있습니다. 이들 도구를 사용하여 Svelte 애플리케이션을 테스트하면서 코드의 품질과 신뢰성을 유지할 수 있습니다.