summaryrefslogtreecommitdiffhomepage
path: root/frontend
diff options
context:
space:
mode:
Diffstat (limited to 'frontend')
-rw-r--r--frontend/src/components/bazarr/Language.test.tsx18
-rw-r--r--frontend/src/components/inputs/Action.test.tsx8
-rw-r--r--frontend/src/components/inputs/ChipInput.test.tsx10
-rw-r--r--frontend/src/components/inputs/Selector.test.tsx20
-rw-r--r--frontend/src/pages/Authentication.test.tsx11
-rw-r--r--frontend/src/pages/Settings/components/Layout.test.tsx29
-rw-r--r--frontend/src/pages/Settings/components/Section.test.tsx8
-rw-r--r--frontend/src/pages/Settings/components/forms.test.tsx21
-rw-r--r--frontend/src/tests/index.tsx1
9 files changed, 59 insertions, 67 deletions
diff --git a/frontend/src/components/bazarr/Language.test.tsx b/frontend/src/components/bazarr/Language.test.tsx
index 6b2ff93a5..8d328753e 100644
--- a/frontend/src/components/bazarr/Language.test.tsx
+++ b/frontend/src/components/bazarr/Language.test.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/react";
+import { rawRender, screen } from "@/tests";
import { describe, it } from "vitest";
import { Language } from ".";
@@ -9,13 +9,13 @@ describe("Language text", () => {
};
it("should show short text", () => {
- render(<Language.Text value={testLanguage}></Language.Text>);
+ rawRender(<Language.Text value={testLanguage}></Language.Text>);
expect(screen.getByText(testLanguage.code2)).toBeDefined();
});
it("should show long text", () => {
- render(<Language.Text value={testLanguage} long></Language.Text>);
+ rawRender(<Language.Text value={testLanguage} long></Language.Text>);
expect(screen.getByText(testLanguage.name)).toBeDefined();
});
@@ -23,7 +23,7 @@ describe("Language text", () => {
const testLanguageWithHi: Language.Info = { ...testLanguage, hi: true };
it("should show short text with HI", () => {
- render(<Language.Text value={testLanguageWithHi}></Language.Text>);
+ rawRender(<Language.Text value={testLanguageWithHi}></Language.Text>);
const expectedText = `${testLanguageWithHi.code2}:HI`;
@@ -31,7 +31,7 @@ describe("Language text", () => {
});
it("should show long text with HI", () => {
- render(<Language.Text value={testLanguageWithHi} long></Language.Text>);
+ rawRender(<Language.Text value={testLanguageWithHi} long></Language.Text>);
const expectedText = `${testLanguageWithHi.name} HI`;
@@ -44,7 +44,7 @@ describe("Language text", () => {
};
it("should show short text with Forced", () => {
- render(<Language.Text value={testLanguageWithForced}></Language.Text>);
+ rawRender(<Language.Text value={testLanguageWithForced}></Language.Text>);
const expectedText = `${testLanguageWithHi.code2}:Forced`;
@@ -52,7 +52,9 @@ describe("Language text", () => {
});
it("should show long text with Forced", () => {
- render(<Language.Text value={testLanguageWithForced} long></Language.Text>);
+ rawRender(
+ <Language.Text value={testLanguageWithForced} long></Language.Text>
+ );
const expectedText = `${testLanguageWithHi.name} Forced`;
@@ -73,7 +75,7 @@ describe("Language list", () => {
];
it("should show all languages", () => {
- render(<Language.List value={elements}></Language.List>);
+ rawRender(<Language.List value={elements}></Language.List>);
elements.forEach((value) => {
expect(screen.getByText(value.name)).toBeDefined();
diff --git a/frontend/src/components/inputs/Action.test.tsx b/frontend/src/components/inputs/Action.test.tsx
index 60c0bf646..05086e71c 100644
--- a/frontend/src/components/inputs/Action.test.tsx
+++ b/frontend/src/components/inputs/Action.test.tsx
@@ -1,5 +1,5 @@
+import { rawRender, screen } from "@/tests";
import { faStickyNote } from "@fortawesome/free-regular-svg-icons";
-import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, it, vitest } from "vitest";
import Action from "./Action";
@@ -9,7 +9,7 @@ const testIcon = faStickyNote;
describe("Action button", () => {
it("should be a button", () => {
- render(<Action icon={testIcon} label={testLabel}></Action>);
+ rawRender(<Action icon={testIcon} label={testLabel}></Action>);
const element = screen.getByRole("button", { name: testLabel });
expect(element.getAttribute("type")).toEqual("button");
@@ -17,7 +17,7 @@ describe("Action button", () => {
});
it("should show icon", () => {
- render(<Action icon={testIcon} label={testLabel}></Action>);
+ rawRender(<Action icon={testIcon} label={testLabel}></Action>);
// TODO: use getBy...
const element = screen.getByRole("img", { hidden: true });
@@ -27,7 +27,7 @@ describe("Action button", () => {
it("should call on-click event when clicked", async () => {
const onClickFn = vitest.fn();
- render(
+ rawRender(
<Action icon={testIcon} label={testLabel} onClick={onClickFn}></Action>
);
diff --git a/frontend/src/components/inputs/ChipInput.test.tsx b/frontend/src/components/inputs/ChipInput.test.tsx
index 8cb7a099e..3e30490d2 100644
--- a/frontend/src/components/inputs/ChipInput.test.tsx
+++ b/frontend/src/components/inputs/ChipInput.test.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/react";
+import { rawRender, screen } from "@/tests";
import userEvent from "@testing-library/user-event";
import { describe, it, vitest } from "vitest";
import ChipInput from "./ChipInput";
@@ -8,7 +8,7 @@ describe("ChipInput", () => {
// TODO: Support default value
it.skip("should works with default value", () => {
- render(<ChipInput defaultValue={existedValues}></ChipInput>);
+ rawRender(<ChipInput defaultValue={existedValues}></ChipInput>);
existedValues.forEach((value) => {
expect(screen.getByText(value)).toBeDefined();
@@ -16,7 +16,7 @@ describe("ChipInput", () => {
});
it("should works with value", () => {
- render(<ChipInput value={existedValues}></ChipInput>);
+ rawRender(<ChipInput value={existedValues}></ChipInput>);
existedValues.forEach((value) => {
expect(screen.getByText(value)).toBeDefined();
@@ -29,7 +29,9 @@ describe("ChipInput", () => {
expect(values).toContain(typedValue);
});
- render(<ChipInput value={existedValues} onChange={mockedFn}></ChipInput>);
+ rawRender(
+ <ChipInput value={existedValues} onChange={mockedFn}></ChipInput>
+ );
const element = screen.getByRole("searchbox");
diff --git a/frontend/src/components/inputs/Selector.test.tsx b/frontend/src/components/inputs/Selector.test.tsx
index 43221ccae..96382c0b2 100644
--- a/frontend/src/components/inputs/Selector.test.tsx
+++ b/frontend/src/components/inputs/Selector.test.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/react";
+import { rawRender, screen } from "@/tests";
import userEvent from "@testing-library/user-event";
import { describe, it, vitest } from "vitest";
import { Selector, SelectorOption } from "./Selector";
@@ -18,14 +18,18 @@ const testOptions: SelectorOption<string>[] = [
describe("Selector", () => {
describe("options", () => {
it("should work with the SelectorOption", () => {
- render(<Selector name={selectorName} options={testOptions}></Selector>);
+ rawRender(
+ <Selector name={selectorName} options={testOptions}></Selector>
+ );
// TODO: selectorName
expect(screen.getByRole("searchbox")).toBeDefined();
});
it("should display when clicked", async () => {
- render(<Selector name={selectorName} options={testOptions}></Selector>);
+ rawRender(
+ <Selector name={selectorName} options={testOptions}></Selector>
+ );
const element = screen.getByRole("searchbox");
@@ -40,7 +44,7 @@ describe("Selector", () => {
it("shouldn't show default value", async () => {
const option = testOptions[0];
- render(
+ rawRender(
<Selector
name={selectorName}
options={testOptions}
@@ -53,7 +57,7 @@ describe("Selector", () => {
it("shouldn't show value", async () => {
const option = testOptions[0];
- render(
+ rawRender(
<Selector
name={selectorName}
options={testOptions}
@@ -71,7 +75,7 @@ describe("Selector", () => {
const mockedFn = vitest.fn((value: string | null) => {
expect(value).toEqual(clickedOption.value);
});
- render(
+ rawRender(
<Selector
name={selectorName}
options={testOptions}
@@ -111,7 +115,7 @@ describe("Selector", () => {
const mockedFn = vitest.fn((value: { name: string } | null) => {
expect(value).toEqual(clickedOption.value);
});
- render(
+ rawRender(
<Selector
name={selectorName}
options={objectOptions}
@@ -133,7 +137,7 @@ describe("Selector", () => {
describe("placeholder", () => {
it("should show when no selection", () => {
const placeholder = "Empty Selection";
- render(
+ rawRender(
<Selector
name={selectorName}
options={testOptions}
diff --git a/frontend/src/pages/Authentication.test.tsx b/frontend/src/pages/Authentication.test.tsx
index 47114dad5..95bfe3f47 100644
--- a/frontend/src/pages/Authentication.test.tsx
+++ b/frontend/src/pages/Authentication.test.tsx
@@ -1,17 +1,10 @@
-import { render, screen } from "@testing-library/react";
-import { QueryClientProvider } from "react-query";
+import { render, screen } from "@/tests";
import { describe, it } from "vitest";
import Authentication from "./Authentication";
-import queryClient from "@/apis/queries";
-
describe("Authentication", () => {
it("should render without crash", () => {
- render(
- <QueryClientProvider client={queryClient}>
- <Authentication></Authentication>
- </QueryClientProvider>
- );
+ render(<Authentication></Authentication>);
expect(screen.getByPlaceholderText("Username")).toBeDefined();
expect(screen.getByPlaceholderText("Password")).toBeDefined();
diff --git a/frontend/src/pages/Settings/components/Layout.test.tsx b/frontend/src/pages/Settings/components/Layout.test.tsx
index 696b98797..0cec7c9cd 100644
--- a/frontend/src/pages/Settings/components/Layout.test.tsx
+++ b/frontend/src/pages/Settings/components/Layout.test.tsx
@@ -1,30 +1,23 @@
-import queryClient from "@/apis/queries";
+import { render, screen } from "@/tests";
import { Text } from "@mantine/core";
-import { render, screen } from "@testing-library/react";
-import { QueryClientProvider } from "react-query";
-import { BrowserRouter } from "react-router-dom";
import { describe, it } from "vitest";
import Layout from "./Layout";
-const renderLayout = () => {
- render(
- <BrowserRouter>
- <QueryClientProvider client={queryClient}>
- <Layout name="Test Settings">
- <Text>Value</Text>
- </Layout>
- </QueryClientProvider>
- </BrowserRouter>
- );
-};
-
describe("Settings layout", () => {
it.concurrent("should be able to render without issues", () => {
- renderLayout();
+ render(
+ <Layout name="Test Settings">
+ <Text>Value</Text>
+ </Layout>
+ );
});
it.concurrent("save button should be disabled by default", () => {
- renderLayout();
+ render(
+ <Layout name="Test Settings">
+ <Text>Value</Text>
+ </Layout>
+ );
expect(screen.getByRole("button", { name: "Save" })).toBeDisabled();
});
diff --git a/frontend/src/pages/Settings/components/Section.test.tsx b/frontend/src/pages/Settings/components/Section.test.tsx
index 2241bd40d..716b95e40 100644
--- a/frontend/src/pages/Settings/components/Section.test.tsx
+++ b/frontend/src/pages/Settings/components/Section.test.tsx
@@ -1,12 +1,12 @@
+import { rawRender, screen } from "@/tests";
import { Text } from "@mantine/core";
-import { render, screen } from "@testing-library/react";
import { describe, it } from "vitest";
import { Section } from "./Section";
describe("Settings section", () => {
const header = "Section Header";
it("should show header", () => {
- render(<Section header="Section Header"></Section>);
+ rawRender(<Section header="Section Header"></Section>);
expect(screen.getByText(header)).toBeDefined();
expect(screen.getByRole("separator")).toBeDefined();
@@ -14,7 +14,7 @@ describe("Settings section", () => {
it("should show children", () => {
const text = "Section Child";
- render(
+ rawRender(
<Section header="Section Header">
<Text>{text}</Text>
</Section>
@@ -26,7 +26,7 @@ describe("Settings section", () => {
it("should work with hidden", () => {
const text = "Section Child";
- render(
+ rawRender(
<Section header="Section Header" hidden>
<Text>{text}</Text>
</Section>
diff --git a/frontend/src/pages/Settings/components/forms.test.tsx b/frontend/src/pages/Settings/components/forms.test.tsx
index 7ff6eefbe..711c764a9 100644
--- a/frontend/src/pages/Settings/components/forms.test.tsx
+++ b/frontend/src/pages/Settings/components/forms.test.tsx
@@ -1,6 +1,6 @@
+import { rawRender, RenderOptions, screen } from "@/tests";
import { useForm } from "@mantine/form";
-import { render, screen } from "@testing-library/react";
-import { FunctionComponent } from "react";
+import { FunctionComponent, ReactElement } from "react";
import { describe, it } from "vitest";
import { FormContext, FormValues } from "../utilities/FormValues";
import { Number, Text } from "./forms";
@@ -15,14 +15,15 @@ const FormSupport: FunctionComponent = ({ children }) => {
return <FormContext.Provider value={form}>{children}</FormContext.Provider>;
};
+const formRender = (
+ ui: ReactElement,
+ options?: Omit<RenderOptions, "wrapper">
+) => rawRender(ui, { wrapper: FormSupport, ...options });
+
describe("Settings form", () => {
describe("number component", () => {
it("should be able to render", () => {
- render(
- <FormSupport>
- <Number settingKey="test-numberValue"></Number>
- </FormSupport>
- );
+ formRender(<Number settingKey="test-numberValue"></Number>);
expect(screen.getByRole("textbox")).toBeDefined();
});
@@ -30,11 +31,7 @@ describe("Settings form", () => {
describe("text component", () => {
it("should be able to render", () => {
- render(
- <FormSupport>
- <Text settingKey="test-textValue"></Text>
- </FormSupport>
- );
+ formRender(<Text settingKey="test-textValue"></Text>);
expect(screen.getByRole("textbox")).toBeDefined();
});
diff --git a/frontend/src/tests/index.tsx b/frontend/src/tests/index.tsx
index 07f286bce..8239af064 100644
--- a/frontend/src/tests/index.tsx
+++ b/frontend/src/tests/index.tsx
@@ -11,3 +11,4 @@ const customRender = (
export * from "@testing-library/react";
// override render method
export { customRender as render };
+export { render as rawRender };
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-26 14:05:03 +0000