Ku6epXBOCTuK/twitch-panels
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

test: fix tests and typescript typechecks

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-02-08 14:02:52 +05:00
parent 1b0675e4b2
commit 81771970c7
16 changed files with 56 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/unit/components/layout/AppHeader.test.ts
+1
View File
@@ -26,6 +26,7 @@ describe("AppHeader.svelte", () => {
const { container } = render(AppHeader);
const toggleButton = container.querySelector(".theme-toggle");
if (!toggleButton) throw new Error("Toggle button not found");
themeState.theme = "dark";
await fireEvent.click(toggleButton);
tests/unit/components/layout/InputGroup.test.ts
+1 -1
View File
@@ -1,6 +1,6 @@
import InputGroupTest from "$components/layout/InputGroupTest.svelte";
import { render, screen } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
import InputGroupTest from "./InputGroupTest.svelte";
describe("InputGroup.svelte", () => {
it("should render multiple children using a wrapper component", () => {
tests/unit/components/layout/InputGroupTest.svelte
+10
View File
@@ -0,0 +1,10 @@
<!-- InputGroupTest.svelte -->
<script>
import InputGroup from "$components/layout/InputGroup.svelte";
</script>
<InputGroup>
<input type="text" data-testid="input1" />
<input type="text" data-testid="input2" />
<button data-testid="button">Кнопка</button>
</InputGroup>
tests/unit/components/layout/SettingsGrid.test.ts
+3 -2
View File
@@ -1,6 +1,6 @@
import { render, screen } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
import SettingsGridTest from "$components/layout/SettingsGridTest.svelte";
import SettingsGridTest from "./SettingsGridTest.svelte";
describe("SettingsGrid.svelte", () => {
it("should render multiple children using a wrapper component", () => {
@@ -8,12 +8,13 @@ describe("SettingsGrid.svelte", () => {
const settingsGrid = document.querySelector(".settings-grid");
expect(settingsGrid).toBeInTheDocument();
if (!settingsGrid) throw new Error("SettingsGrid element not found");
expect(screen.getByTestId("item1")).toBeInTheDocument();
expect(screen.getByTestId("item2")).toBeInTheDocument();
expect(screen.getByTestId("item3")).toBeInTheDocument();
const items = settingsGrid.querySelectorAll('div[data-testid]');
const items = settingsGrid.querySelectorAll("div[data-testid]");
expect(items.length).toBe(3);
});
});
tests/unit/components/layout/SettingsGridTest.svelte
+10
View File
@@ -0,0 +1,10 @@
<!-- SettingsGridTest.svelte -->
<script>
import SettingsGrid from "$components/layout/SettingsGrid.svelte";
</script>
<SettingsGrid>
<div data-testid="item1">Item 1</div>
<div data-testid="item2">Item 2</div>
<div data-testid="item3">Item 3</div>
</SettingsGrid>
tests/unit/components/layout/SettingsRow.test.ts
+4 -1
View File
@@ -1,6 +1,6 @@
import { render, screen } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
import SettingsRowTest from "$components/layout/SettingsRowTest.svelte";
import SettingsRowTest from "./SettingsRowTest.svelte";
describe("SettingsRow.svelte", () => {
it("should render label and children using a wrapper component", () => {
@@ -8,16 +8,19 @@ describe("SettingsRow.svelte", () => {
const settingRow = document.querySelector(".setting-row");
expect(settingRow).toBeInTheDocument();
if (!settingRow) throw new Error("SettingRow element not found");
expect(screen.getByText("Test Label")).toBeInTheDocument();
expect(screen.getByTestId("test-input")).toBeInTheDocument();
const label = settingRow.querySelector(".setting-label");
expect(label).toBeInTheDocument();
if (!label) throw new Error("Label element not found");
expect(label.textContent).toBe("Test Label");
const control = settingRow.querySelector(".setting-control");
expect(control).toBeInTheDocument();
if (!control) throw new Error("Control element not found");
expect(control.querySelector('input[data-testid="test-input"]')).toBeInTheDocument();
});
});
tests/unit/components/layout/SettingsRowTest.svelte
+8
View File
@@ -0,0 +1,8 @@
<!-- SettingsRowTest.svelte -->
<script>
import SettingsRow from "$components/layout/SettingsRow.svelte";
</script>
<SettingsRow label="Test Label">
<input type="text" data-testid="test-input" />
</SettingsRow>
tests/unit/components/text/TextInput.test.ts
+3
View File
@@ -25,6 +25,7 @@ describe("TextInput.svelte", () => {
});
const input = container.querySelector(".text-input");
if (!input) throw new Error("Input element not found");
await fireEvent.input(input, { target: { value: "Updated text" } });
expect(input).toHaveValue("Updated text");
@@ -40,6 +41,7 @@ describe("TextInput.svelte", () => {
});
const input = container.querySelector(".text-input");
if (!input) throw new Error("Input element not found");
await fireEvent.keyDown(input, { key: "Enter" });
expect(onenter).toHaveBeenCalledTimes(1);
@@ -55,6 +57,7 @@ describe("TextInput.svelte", () => {
});
const input = container.querySelector(".text-input");
if (!input) throw new Error("Input element not found");
await fireEvent.keyDown(input, { key: "Escape" });
await fireEvent.keyDown(input, { key: "Tab" });
tests/unit/components/ui/Button.test.ts
+1
View File
@@ -38,6 +38,7 @@ describe("Button.svelte", () => {
});
const button = container.querySelector("button");
if (!button) throw new Error("Button element not found");
await fireEvent.click(button);
expect(onclick).toHaveBeenCalledTimes(1);
tests/unit/components/ui/ColorPicker.test.ts
+3 -2
View File
@@ -1,6 +1,6 @@
import { render, screen, fireEvent } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
import ColorPicker from "$components/ui/ColorPicker.svelte";
import { fireEvent, render, screen } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
describe("ColorPicker.svelte", () => {
it("should render with initial value", () => {
@@ -23,6 +23,7 @@ describe("ColorPicker.svelte", () => {
});
const input = container.querySelector(".color-input");
if (!input) throw new Error("Input element not found");
await fireEvent.input(input, { target: { value: "#ff0000" } });
expect(screen.getByText("#ff0000")).toBeInTheDocument();
tests/unit/components/ui/RangeSlider.test.ts
+4 -2
View File
@@ -1,6 +1,6 @@
import { render, screen, fireEvent } from "@testing-library/svelte";
import { describe, expect, it, vi } from "vitest";
import RangeSlider from "$components/ui/RangeSlider.svelte";
import { fireEvent, render, screen } from "@testing-library/svelte";
import { describe, expect, it, vi } from "vitest";
describe("RangeSlider.svelte", () => {
it("should render with default props", () => {
@@ -39,6 +39,7 @@ describe("RangeSlider.svelte", () => {
});
const slider = container.querySelector(".slider");
if (!slider) throw new Error("Slider element not found");
await fireEvent.input(slider, { target: { value: "75" } });
expect(screen.getByText("75")).toBeInTheDocument();
@@ -54,6 +55,7 @@ describe("RangeSlider.svelte", () => {
});
const slider = container.querySelector(".slider");
if (!slider) throw new Error("Slider element not found");
await fireEvent.change(slider, { target: { value: "75" } });
expect(onchange).toHaveBeenCalled();
tests/unit/components/ui/SelectFont.test.ts
+5 -3
View File
@@ -1,6 +1,6 @@
import { render, screen, fireEvent } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
import SelectFont from "$components/ui/SelectFont.svelte";
import { fireEvent, render, screen } from "@testing-library/svelte";
import { describe, expect, it } from "vitest";
describe("SelectFont.svelte", () => {
const fonts = [
@@ -33,7 +33,7 @@ describe("SelectFont.svelte", () => {
},
});
fonts.forEach(font => {
fonts.forEach((font) => {
const options = screen.queryAllByText(font);
expect(options.length).toBeGreaterThan(0);
});
@@ -47,6 +47,7 @@ describe("SelectFont.svelte", () => {
});
const select = container.querySelector(".select-input");
if (!select) throw new Error("Select element not found");
await fireEvent.change(select, { target: { value: "Verdana" } });
expect(select).toHaveValue("Verdana");
@@ -60,6 +61,7 @@ describe("SelectFont.svelte", () => {
});
const select = container.querySelector(".select-input");
if (!select) throw new Error("Select element not found");
await fireEvent.change(select, { target: { value: "Georgia" } });
expect(select).toHaveValue("Georgia");