src/lib/components/TimerControls.test.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

// @vitest-environment jsdom
import { describe, it, expect, afterEach } from "vitest";
import { render, screen, fireEvent } from "@testing-library/svelte";
import TimerControls from "./TimerControls.svelte";
import { stopTimer } from "../stores/timer.svelte.js";

describe("TimerControls", () => {
  afterEach(() => {
    stopTimer();
  });

  it("shows the resting display for the default minutes", () => {
    render(TimerControls);
    expect(screen.getByTitle("Time display")).toHaveValue("12:00");
  });

  it("disables inc/dec while running, and re-enables on stop", async () => {
    render(TimerControls);
    const startBtn = screen.getByTitle("Timer start");
    const stopBtn = screen.getByTitle("Timer stop");
    const incBtn = screen.getByTitle("Timer increment");
    const decBtn = screen.getByTitle("Timer decrement");

    expect(incBtn).not.toBeDisabled();
    expect(decBtn).not.toBeDisabled();

    await fireEvent.click(startBtn);
    expect(incBtn).toBeDisabled();
    expect(decBtn).toBeDisabled();

    await fireEvent.click(stopBtn);
    expect(incBtn).not.toBeDisabled();
    expect(decBtn).not.toBeDisabled();
  });
});