Fakultas Ilmu Komputer UI

Commit a84559e3 authored by Michael Wiryadinata Halim's avatar Michael Wiryadinata Halim Committed by Edrick Lainardi
Browse files

Resolve "Fix feedback sprint"

parent 1a3f030f
import React from "react";
import ApplicationState from "./ApplicationState";
import 'bootstrap/dist/css/bootstrap.min.css';
import "bootstrap/dist/css/bootstrap.min.css";
const App = () => {
return <ApplicationState />;
......
......@@ -3,6 +3,7 @@ import AuthReducer, { initialState } from "./store/reducers/auth_reducer";
import * as ACTIONS from "./store/actions/actions";
import AuthContext from "./utils/contex";
import Routes from "./routes";
import Loader from "./component/Loader";
const ApplicationState = () => {
const [stateAuthReducer, dispatchAuthReducer] = useReducer(
......@@ -20,6 +21,7 @@ const ApplicationState = () => {
return (
<div>
<Loader />
<AuthContext.Provider
value={{
...stateAuthReducer,
......
import React from "react";
import { cleanup, render } from "@testing-library/react";
import DummyHome from "../page/DummyHome";
import AuthContext from "../utils/contex";
afterEach(cleanup);
test("Test Dummy Home", () => {
const username = "test";
const { getByTestId } = render(
<AuthContext.Provider
value={{ is_authenticated: true, profile: { username } }}
>
<DummyHome />
</AuthContext.Provider>
);
const home = getByTestId("home");
expect(home.textContent).toContain(username);
});
......@@ -2,10 +2,10 @@ import React from "react";
import { cleanup } from "@testing-library/react";
import * as AuthContext from "../utils/contex";
import ProtectedRoute from "../component/routes/ProtectedRoute";
import DummyHome from "../page/DummyHome";
import { shallow } from "enzyme";
import { Redirect } from "@reach/router";
import Layout from "../layout/Layout";
import ListProduk from "../page/produk/ListProduk";
afterEach(cleanup);
......@@ -14,9 +14,9 @@ test("Test protected route authenticated", () => {
.spyOn(AuthContext, "useAuthContext")
.mockImplementation(() => ({ is_authenticated: true }));
const wrapper = shallow(
<ProtectedRoute path="/product" component={DummyHome} />
<ProtectedRoute path="/product" component={ListProduk} />
);
expect(wrapper.find(Layout).dive().find(DummyHome)).toHaveLength(1);
expect(wrapper.find(Layout).dive().find(ListProduk)).toHaveLength(1);
});
test("Test protected route unauthenticated", () => {
......@@ -24,7 +24,7 @@ test("Test protected route unauthenticated", () => {
.spyOn(AuthContext, "useAuthContext")
.mockImplementation(() => ({ is_authenticated: false }));
const wrapper = shallow(
<ProtectedRoute path="/product" component={DummyHome} />
<ProtectedRoute path="/product" component={ListProduk} />
);
expect(wrapper.find(Redirect)).toHaveLength(1);
});
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import React from "react";
import DetailKategori from "../../page/kategori/DetailKategori";
import { waitFor } from "@testing-library/dom";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test detail kategori renders", async () => {
fetch
.once(
JSON.stringify({
count: 3,
next: null,
previous: null,
results: [
{
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Jas",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "Jas hitam",
price: "800000.00",
stock: 5,
image: null,
},
{
id: "f3fb1295-8420-4d00-ba5e-48579092551b",
name: "Kemeja",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "kemeja putih",
price: "200000.00",
stock: 5,
image: null,
},
{
id: "45435428-e323-4f1f-8e07-f48312605504",
name: "celana panjang tidur",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
{
id: "0eb3cefe-4b70-4817-94fc-d91273cd5132",
name: "celana panjang tidur 1",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
],
})
)
.once(
JSON.stringify({
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
})
);
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailKategori />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("page-detail-kategori"));
const subkategori = getByTestId("page-detail-kategori");
expect(subkategori.textContent).toContain("Baju");
expect(subkategori.textContent).toContain("celana panjang tidur 1");
expect(fetch.mock.calls.length).toEqual(2);
});
test("Test mock detail kategori return error", async () => {
fetch.mockReject(new Error("fake error message"));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailKategori />
</AuthContext.Provider>
);
const page = getByTestId("page-detail-kategori");
await waitFor(() =>
expect(page.textContent).toContain("Error !, Please relogin..")
);
});
test("Test detail kategori delete", async () => {
fetch
.once(
JSON.stringify({
count: 3,
next: null,
previous: null,
results: [
{
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Jas",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "Jas hitam",
price: "800000.00",
stock: 5,
image: null,
},
{
id: "f3fb1295-8420-4d00-ba5e-48579092551b",
name: "Kemeja",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "kemeja putih",
price: "200000.00",
stock: 5,
image: null,
},
{
id: "45435428-e323-4f1f-8e07-f48312605504",
name: "celana panjang tidur",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
{
id: "0eb3cefe-4b70-4817-94fc-d91273cd5132",
name: "celana panjang tidur 1",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
],
})
)
.once(
JSON.stringify({
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
})
)
.once(JSON.stringify({}));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailKategori />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("page-detail-kategori"));
const subkategori = getByTestId("page-detail-kategori");
expect(subkategori.textContent).toContain("Baju");
expect(subkategori.textContent).toContain("celana panjang tidur 1");
expect(fetch.mock.calls.length).toEqual(2);
const btnDeleteModal = getByTestId("button-delete-category-modal");
await act(async () => {
await fireEvent.click(btnDeleteModal);
});
const btnDelete = getByTestId("button-delete-category");
await act(async () => {
await fireEvent.click(btnDelete);
});
expect(fetch.mock.calls.length).toEqual(3);
});
test("Test detail kategori delete error", async () => {
fetch
.once(
JSON.stringify({
count: 3,
next: null,
previous: null,
results: [
{
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Jas",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "Jas hitam",
price: "800000.00",
stock: 5,
image: null,
},
{
id: "f3fb1295-8420-4d00-ba5e-48579092551b",
name: "Kemeja",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "kemeja putih",
price: "200000.00",
stock: 5,
image: null,
},
{
id: "45435428-e323-4f1f-8e07-f48312605504",
name: "celana panjang tidur",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
{
id: "0eb3cefe-4b70-4817-94fc-d91273cd5132",
name: "celana panjang tidur 1",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur",
description: "celana panjang hitam tidur",
price: "90000.00",
stock: 15,
image: null,
},
],
})
)
.once(
JSON.stringify({
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
})
)
.mockReject(new Error("fake error message"));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailKategori />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("page-detail-kategori"));
const subkategori = getByTestId("page-detail-kategori");
expect(subkategori.textContent).toContain("Baju");
expect(subkategori.textContent).toContain("celana panjang tidur 1");
expect(fetch.mock.calls.length).toEqual(2);
const btnDeleteModal = getByTestId("button-delete-category-modal");
await act(async () => {
await fireEvent.click(btnDeleteModal);
});
const btnDelete = getByTestId("button-delete-category");
await act(async () => {
await fireEvent.click(btnDelete);
});
expect(subkategori.textContent).toContain(
"Tidak dapat menghapus kategori, mohon periksa apakah ada produk " +
"didalam kategori ini."
);
});
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import { waitFor } from "@testing-library/dom";
import React from "react";
import EditKategori from "../../page/kategori/EditKategori";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test edit kategori renders", async () => {
fetch
.once(
JSON.stringify({
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
})
)
.once(JSON.stringify({}));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditKategori />
</AuthContext.Provider>
);
const waitKategori = getByTestId("waiting-edit-kategori");
expect(waitKategori.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-kategori"));
const name_kategori = getByTestId("name-kategori-input");
expect(name_kategori.value).toEqual("Baju");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_kategori, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-category"));
});
expect(fetch.mock.calls.length).toEqual(2);
});
test("Test Edit kategori error", async () => {
fetch
.once(
JSON.stringify({
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
})
)
.once(JSON.stringify({}), { status: 400 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditKategori />
</AuthContext.Provider>
);
const waitKategori = getByTestId("waiting-edit-kategori");
expect(waitKategori.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-kategori"));
const name_kategori = getByTestId("name-kategori-input");
expect(name_kategori.value).toEqual("Baju");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_kategori, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-category"));
});
const category = getByTestId("edit-kategori");
expect(category.textContent).toContain("Error !, Data tidak dapat disimpan");
expect(fetch.mock.calls.length).toEqual(2);
});
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import React from "react";
import TambahKategori from "../../page/kategori/TambahKategori";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test tambah kategori renders", async () => {
fetch.once(JSON.stringify({}));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahKategori />
</AuthContext.Provider>
);
const name_kategori = getByTestId("name-kategori-input");
await act(async () => {
await fireEvent.input(name_kategori, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-category"));
});
expect(fetch.mock.calls.length).toEqual(1);
});
test("Test tambah kategori form required", async () => {
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahKategori />
</AuthContext.Provider>
);
await act(async () => {
await fireEvent.submit(getByTestId("submit-category"));
});
const formCategory = getByTestId("form-category");
expect(formCategory.textContent).toContain(
"Nama kategori tidak boleh kosong"
);
});
test("Test tambah kategori error", async () => {
fetch.once(JSON.stringify({}), { status: 400 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahKategori />
</AuthContext.Provider>
);
const name_kategori = getByTestId("name-kategori-input");
await act(async () => {
await fireEvent.input(name_kategori, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-category"));
});
const category = getByTestId("tambah-kategori");
expect(category.textContent).toContain("Error !, Data tidak dapat disimpan");
expect(fetch.mock.calls.length).toEqual(1);
});
......@@ -70,9 +70,54 @@ test("Test detail produk delete", async () => {
const produk = getByTestId("page");
expect(produk.textContent).toContain("Jas");
expect(fetch.mock.calls.length).toEqual(1);
const btnDelete = getByTestId("button-delete-produk");
const btnDeleteModal = getByTestId("button-delete-product-modal");
await act(async () => {
await fireEvent.click(btnDeleteModal);
});
const btnDelete = getByTestId("button-delete-product");
await act(async () => {
await fireEvent.click(btnDelete);
});
expect(fetch.mock.calls.length).toEqual(2);
});
test("Test detail produk delete error", async () => {
fetch
.mockResponseOnce(
JSON.stringify({
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Jas",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "Jas hitam",
price: "800000.00",
stock: 5,
image: null,
})
)
.mockReject(new Error("fake error message"));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailProduk />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("page"));
const produk = getByTestId("page");
expect(produk.textContent).toContain("Jas");
expect(fetch.mock.calls.length).toEqual(1);
const btnDeleteModal = getByTestId("button-delete-product-modal");
await act(async () => {
await fireEvent.click(btnDeleteModal);
});
const btnDelete = getByTestId("button-delete-product");
await act(async () => {
await fireEvent.click(btnDelete);
});
expect(fetch.mock.calls.length).toEqual(2);
expect(produk.textContent).toContain(
"Tidak dapat menghapus produk, mohon periksa apakah ada produk ini."