test: refactor tests, format files

tests/unit/components/image/CropInline.test.ts

@@ -7,6 +7,4 @@ describe("CropInline.svelte", () => {
     const { container } = render(CropInline);
     expect(container).toBeInTheDocument();
   });
-
-
 });

tests/unit/components/layout/AppHeader.test.ts

@@ -1,15 +1,13 @@
-import { render, screen, fireEvent } from "@testing-library/svelte";
-import { describe, expect, it, beforeEach } from "vitest";
-import { themeState } from "$states/theme.svelte";
 import AppHeader from "$components/layout/AppHeader.svelte";
+import { themeState } from "$states/theme.svelte";
+import { fireEvent, render } from "@testing-library/svelte";
+import { beforeEach, describe, expect, it } from "vitest";
 
 describe("AppHeader.svelte", () => {
   beforeEach(() => {
     themeState.theme = "dark";
   });
 
-
-
   it("should toggle theme on button click", async () => {
     const { container } = render(AppHeader);
 
@@ -23,6 +21,4 @@ describe("AppHeader.svelte", () => {
     await fireEvent.click(toggleButton);
     expect(themeState.theme).toBe("dark");
   });
-
-
 });

tests/unit/components/layout/Card.test.ts

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
 import CardTest from "./CardTest.svelte";
 

tests/unit/components/layout/CardTest.svelte

@@ -1,4 +1,3 @@
-<!-- CardTest.svelte -->
 <script>
   import Card from "$components/layout/Card.svelte";
 </script>

tests/unit/components/layout/InputGroup.test.ts

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
 import InputGroupTest from "./InputGroupTest.svelte";
 

tests/unit/components/layout/InputGroupTest.svelte

@@ -1,4 +1,3 @@
-<!-- InputGroupTest.svelte -->
 <script>
   import InputGroup from "$components/layout/InputGroup.svelte";
 </script>

tests/unit/components/layout/PanelBar.test.ts

@@ -7,6 +7,4 @@ describe("PanelBar.svelte", () => {
     const { container } = render(PanelBar);
     expect(container).toBeInTheDocument();
   });
-
-
 });

tests/unit/components/layout/SettingsGrid.test.ts

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
 import SettingsGridTest from "./SettingsGridTest.svelte";
 

tests/unit/components/layout/SettingsGridTest.svelte

@@ -1,4 +1,3 @@
-<!-- SettingsGridTest.svelte -->
 <script>
   import SettingsGrid from "$components/layout/SettingsGrid.svelte";
 </script>

tests/unit/components/layout/SettingsRow.test.ts

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
 import SettingsRowTest from "./SettingsRowTest.svelte";
 

tests/unit/components/layout/SettingsRowTest.svelte

@@ -1,4 +1,3 @@
-<!-- SettingsRowTest.svelte -->
 <script>
   import SettingsRow from "$components/layout/SettingsRow.svelte";
 </script>

tests/unit/components/layout/TextBar.test.ts

@@ -7,6 +7,4 @@ describe("TextBar.svelte", () => {
     const { container } = render(TextBar);
     expect(container).toBeInTheDocument();
   });
-
-
 });

tests/unit/components/panel/Preview.test.ts

@@ -1,6 +1,6 @@
 import Preview from "$components/panel/Preview.svelte";
-import { render, cleanup } from "@testing-library/svelte";
+import { cleanup, render } from "@testing-library/svelte";
-import { describe, expect, it, afterEach } from "vitest";
+import { afterEach, describe, expect, it } from "vitest";
 
 afterEach(() => {
   cleanup();
@@ -29,6 +29,4 @@ describe("Preview.svelte", () => {
     const stage = container.querySelector("canvas");
     expect(stage).toBeInTheDocument();
   });
-
-
 });

tests/unit/components/panel/PreviewAll.test.ts

@@ -1,7 +1,7 @@
 import PreviewAll from "$components/panel/PreviewAll.svelte";
 import { textsState } from "$states/texts.svelte";
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
-import { beforeEach, describe, expect, it } from "vitest";
+import { beforeEach, describe, it } from "vitest";
 
 describe("PreviewAll.svelte", () => {
   beforeEach(() => {

tests/unit/components/panel/PreviewControls.test.ts

@@ -1,14 +1,12 @@
 import PreviewControls from "$components/panel/PreviewControls.svelte";
-import { render, screen, cleanup } from "@testing-library/svelte";
+import { cleanup, render } from "@testing-library/svelte";
-import { describe, expect, it, afterEach } from "vitest";
+import { afterEach, describe, expect, it } from "vitest";
 
 afterEach(() => {
   cleanup();
 });
 
 describe("PreviewControls.svelte", () => {
-
-
   it("should render navigation buttons", () => {
     render(PreviewControls, {
       props: {
@@ -21,8 +19,4 @@ describe("PreviewControls.svelte", () => {
     const buttons = document.querySelectorAll("button");
     expect(buttons.length).toBeGreaterThan(0);
   });
-
-
-
-
 });

tests/unit/components/panel/PreviewManager.test.ts

@@ -1,7 +1,7 @@
 import PreviewManager from "$components/panel/PreviewManager.svelte";
 import { textsState } from "$states/texts.svelte";
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
-import { beforeEach, describe, expect, it } from "vitest";
+import { beforeEach, describe, it } from "vitest";
 
 describe("PreviewManager.svelte", () => {
   beforeEach(() => {

tests/unit/components/text/TextConfig.test.ts

@@ -1,6 +1,6 @@
 import TextConfig from "$components/text/TextConfig.svelte";
-import { render, screen, cleanup } from "@testing-library/svelte";
+import { cleanup, render } from "@testing-library/svelte";
-import { describe, expect, it, afterEach } from "vitest";
+import { afterEach, describe, it } from "vitest";
 
 afterEach(() => {
   cleanup();
@@ -10,8 +10,4 @@ describe("TextConfig.svelte", () => {
   it("should render without crashing", () => {
     render(TextConfig);
   });
-
-
-
-
 });

tests/unit/components/text/TextInlineEdit.test.ts

@@ -1,6 +1,6 @@
 import TextInlineEdit from "$components/text/TextInlineEdit.svelte";
-import { render, cleanup } from "@testing-library/svelte";
+import { cleanup, render } from "@testing-library/svelte";
-import { describe, expect, it, afterEach } from "vitest";
+import { afterEach, describe, expect, it } from "vitest";
 
 afterEach(() => {
   cleanup();
@@ -21,8 +21,6 @@ describe("TextInlineEdit.svelte", () => {
     expect(input).toHaveValue("Test text");
   });
 
-
-
   it("should render with empty text", () => {
     render(TextInlineEdit, {
       props: {

tests/unit/components/text/TextInput.test.ts

@@ -1,6 +1,6 @@
-import { render, screen, fireEvent } from "@testing-library/svelte";
-import { describe, expect, it, vi } from "vitest";
 import TextInput from "$components/text/TextInput.svelte";
+import { fireEvent, render } from "@testing-library/svelte";
+import { describe, expect, it, vi } from "vitest";
 
 describe("TextInput.svelte", () => {
   it("should render with initial value", () => {
@@ -63,6 +63,4 @@ describe("TextInput.svelte", () => {
 
     expect(onenter).not.toHaveBeenCalled();
   });
-
-
 });

tests/unit/components/text/TextManager.test.ts

@@ -1,7 +1,7 @@
 import TextManager from "$components/text/TextManager.svelte";
 import { textsState } from "$states/texts.svelte";
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
-import { beforeEach, describe, expect, it } from "vitest";
+import { beforeEach, describe, it } from "vitest";
 
 describe("TextManager.svelte", () => {
   beforeEach(() => {

tests/unit/components/ui/Badge.test.ts

@@ -1,6 +1,6 @@
+import Badge from "$components/ui/Badge.svelte";
 import { render, screen } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
-import Badge from "$components/ui/Badge.svelte";
 
 describe("Badge.svelte", () => {
   it("should render with string text", () => {

tests/unit/components/ui/Button.test.ts

@@ -1,10 +1,9 @@
-import { render, screen, fireEvent } from "@testing-library/svelte";
-import { describe, expect, it, vi } from "vitest";
 import Button from "$components/ui/Button.svelte";
-import MockIcon from "./__mocks__/MockIcon.svelte";
+import { fireEvent, render, screen } from "@testing-library/svelte";
+import { describe, expect, it, vi } from "vitest";
+import MockIcon from "./MockIcon.svelte";
 
 describe("Button.svelte", () => {
-
   it("should render with icon and label", () => {
     const { container } = render(Button, {
       props: {
@@ -68,6 +67,4 @@ describe("Button.svelte", () => {
     const button = container.querySelector("button");
     expect(button).not.toBeDisabled();
   });
-
-
 });

tests/unit/components/ui/ColorPicker.test.ts

@@ -1,6 +1,6 @@
 import ColorPicker from "$components/ui/ColorPicker.svelte";
-import { fireEvent, render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
-import { describe, expect, it } from "vitest";
+import { describe, it } from "vitest";
 
 describe("ColorPicker.svelte", () => {
   it("should render without crashing", () => {
@@ -10,6 +10,4 @@ describe("ColorPicker.svelte", () => {
       },
     });
   });
-
-
 });

tests/unit/components/ui/RangeSlider.test.ts

@@ -1,10 +1,8 @@
 import RangeSlider from "$components/ui/RangeSlider.svelte";
-import { fireEvent, render, screen } from "@testing-library/svelte";
+import { fireEvent, render } from "@testing-library/svelte";
 import { describe, expect, it, vi } from "vitest";
 
 describe("RangeSlider.svelte", () => {
-
-
   it("should call onchange handler", async () => {
     const onchange = vi.fn();
     const { container } = render(RangeSlider, {

tests/unit/components/ui/SelectFont.test.ts

@@ -1,6 +1,6 @@
 import SelectFont from "$components/ui/SelectFont.svelte";
-import { fireEvent, render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
-import { describe, expect, it } from "vitest";
+import { describe, it } from "vitest";
 
 describe("SelectFont.svelte", () => {
   it("should render without crashing", () => {

tests/unit/constants.test.ts

@@ -1,12 +1,12 @@
 import {
-  PANEL_SETTINGS,
+  DEFAULT_TEXT_ALIGN,
-  TYPOGRAPHY,
   IMAGE_SETTINGS,
+  PANEL_SETTINGS,
   SlideDirection,
   type SlideDirectionType,
   TextAlign,
   type TextAlignType,
-  DEFAULT_TEXT_ALIGN,
+  TYPOGRAPHY,
 } from "$lib/constants";
 import { describe, expect, it } from "vitest";
 
@@ -159,7 +159,7 @@ describe("constants", () => {
     });
 
     it("should have string format types", () => {
-      IMAGE_SETTINGS.SUPPORTED_FORMATS.forEach(format => {
+      IMAGE_SETTINGS.SUPPORTED_FORMATS.forEach((format) => {
         expect(typeof format).toBe("string");
         expect(format).toMatch(/^image\//);
       });

tests/unit/errorTypes.test.ts

@@ -1,4 +1,4 @@
-import { AppError, ImageError, TextError, CanvasError, StorageError } from "$lib/error.types";
+import { AppError, CanvasError, ImageError, StorageError, TextError } from "$lib/error.types";
 import { describe, expect, it } from "vitest";
 
 describe("error.types", () => {
@@ -153,7 +153,7 @@ describe("error.types", () => {
         new StorageError("Test"),
       ];
 
-      errors.forEach(error => {
+      errors.forEach((error) => {
         expect(error).toBeInstanceOf(AppError);
         expect(error).toBeInstanceOf(Error);
       });
@@ -165,8 +165,8 @@ describe("error.types", () => {
         new TextError("Test"),
       ];
 
-      const imageErrors = errors.filter(e => e instanceof ImageError);
+      const imageErrors = errors.filter((e) => e instanceof ImageError);
-      const textErrors = errors.filter(e => e instanceof TextError);
+      const textErrors = errors.filter((e) => e instanceof TextError);
 
       expect(imageErrors).toHaveLength(1);
       expect(textErrors).toHaveLength(1);

tests/unit/errorUtils.test.ts

@@ -1,5 +1,5 @@
-import { AppError, ImageError, TextError, CanvasError, StorageError } from "$lib/error.types";
+import { AppError, CanvasError, ImageError, StorageError, TextError } from "$lib/error.types";
-import { formatError, createError, logError } from "$lib/utils/errorUtils";
+import { createError, formatError, logError } from "$lib/utils/errorUtils";
 import { describe, expect, it, vi } from "vitest";
 
 describe("errorUtils", () => {

tests/unit/routes/LayoutTest.svelte

@@ -1,4 +1,3 @@
-<!-- LayoutTest.svelte -->
 <script>
   import Layout from "$routes/+layout.svelte";
 </script>

tests/unit/routes/PageTest.svelte

@@ -1,4 +1,3 @@
-<!-- PageTest.svelte -->
 <script>
   import Page from "$routes/+page.svelte";
 </script>

tests/unit/routes/layout.test.ts

@@ -1,5 +1,7 @@
 import { themeState } from "$states/theme.svelte";
+import { render, screen } from "@testing-library/svelte";
 import { beforeEach, describe, expect, it, vi } from "vitest";
+import LayoutTest from "./LayoutTest.svelte";
 
 describe("+layout.svelte", () => {
   beforeEach(() => {
@@ -27,9 +29,6 @@ describe("+layout.svelte", () => {
   });
 });
 
-import LayoutTest from "./LayoutTest.svelte";
-import { render, screen } from "@testing-library/svelte";
-
 describe("Layout Component Coverage", () => {
   it("should render children snippet and initialize props", () => {
     render(LayoutTest);

tests/unit/routes/page.test.ts

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/svelte";
+import { render } from "@testing-library/svelte";
 import { describe, expect, it } from "vitest";
 import PageTest from "./PageTest.svelte";
 

tests/unit/states/konvaStage.test.ts

@@ -51,37 +51,4 @@ describe("konvaStage.svelte", () => {
       expect(konvaStageState.stage).not.toStrictEqual(firstStage);
     });
   });
-
-  // describe("stage lifecycle", () => {
-  //   it("should handle stage creation", () => {
-  //     const mockStage = { id: "new-stage" } as any;
-
-  //     konvaStageState.stage = mockStage;
-
-  //     expect(konvaStageState.stage).toStrictEqual(mockStage);
-  //     expect(konvaStageState.stage?.id).toBe("new-stage");
-  //   });
-
-  //   it("should handle stage destruction", () => {
-  //     const mockStage = { id: "to-destroy" } as any;
-
-  //     konvaStageState.stage = mockStage;
-  //     expect(konvaStageState.stage).toBeDefined();
-
-  //     konvaStageState.stage = undefined;
-  //     expect(konvaStageState.stage).toBeUndefined();
-  //   });
-
-  //   it("should handle stage replacement", () => {
-  //     const oldStage = { id: "old" } as any;
-  //     const newStage = { id: "new" } as any;
-
-  //     konvaStageState.stage = oldStage;
-  //     expect(konvaStageState.stage).toStrictEqual(oldStage);
-
-  //     konvaStageState.stage = newStage;
-  //     expect(konvaStageState.stage).toStrictEqual(newStage);
-  //     expect(konvaStageState.stage).not.toStrictEqual(oldStage);
-  //   });
-  // });
 });

tests/unit/states/theme.test.ts

@@ -1,5 +1,5 @@
-import { describe, expect, it } from "vitest";
 import { themeState } from "$states/theme.svelte";
+import { describe, expect, it } from "vitest";
 
 describe("theme.svelte", () => {
   describe("initial state", () => {