Explorar el Código

Added tests for ads and patterns

pull/165/head
bronjaermin hace 3 años
padre
commit
48f86c61df

+ 12
- 0
src/__tests__/UITests/adDetailsPageUI.test.js Ver fichero

expect(screen.getByTestId("alert-container")).toBeDefined(); expect(screen.getByTestId("alert-container")).toBeDefined();
}); });


it("Should render ads page when confirm archive ad modal", async () => {
const { container } = render(cont);

waitFor(() => {
fireEvent.click(container.getElementsByClassName("archive-ad-button")[0]);

fireEvent.click(container.getElementsByClassName("dialog-btn")[1]);

waitFor(() => expect(props.history.push).toHaveBeenCalledWith('/ads'));
});
});

it("Should render apply for ad button", () => { it("Should render apply for ad button", () => {
const { container } = render(cont); const { container } = render(cont);
expect( expect(

+ 29
- 3
src/__tests__/UITests/adsPageUI.test.js Ver fichero

import { render, screen, fireEvent } from "@testing-library/react";
import { render, screen, fireEvent, waitFor } from "@testing-library/react";
import * as redux from "react-redux"; import * as redux from "react-redux";
import AdsPage from "../../pages/AdsPage/AdsPage"; import AdsPage from "../../pages/AdsPage/AdsPage";
import store from "../../store"; import store from "../../store";


beforeEach(() => { beforeEach(() => {
spyOnUseSelector = jest.spyOn(redux, "useSelector"); spyOnUseSelector = jest.spyOn(redux, "useSelector");
spyOnUseSelector.mockReturnValueOnce(mockState.ads.ads);
spyOnUseSelector
.mockReturnValueOnce(mockState.ads.ads)
.mockReturnValueOnce([
{
name: ".NET",
technologyId: 1,
technologyType: "Backend",
isChecked: false,
},
]);
}); });


afterEach(() => { afterEach(() => {
const { container } = render(cont); const { container } = render(cont);
fireEvent.click(container.getElementsByClassName("ads-page-btn")[2]); fireEvent.click(container.getElementsByClassName("ads-page-btn")[2]);


expect(props.history.push).toHaveBeenCalledWith('/create-ad');
expect(props.history.push).toHaveBeenCalledWith("/create-ad");
}); });


it("Input for searching by title should not be shown when component is initialy rendered", () => { it("Input for searching by title should not be shown when component is initialy rendered", () => {


it("Should render filter drawer after click filter button", () => { it("Should render filter drawer after click filter button", () => {
const { container } = render(cont); const { container } = render(cont);

fireEvent.click(container.getElementsByClassName("fltr-btn")[0]); fireEvent.click(container.getElementsByClassName("fltr-btn")[0]);
expect(screen.getByTestId("ad-filters-drawer")).toBeDefined(); expect(screen.getByTestId("ad-filters-drawer")).toBeDefined();
}); });
container.getElementsByClassName("archived-ads-ads-arrows") container.getElementsByClassName("archived-ads-ads-arrows")
).toBeDefined(); ).toBeDefined();
}); });

it("Should filter ads when click search button", async () => {
const { container } = render(cont);

waitFor(() => {
fireEvent.click(container.getElementsByClassName("fltr-btn")[0]);

fireEvent.click(
container.getElementsByClassName("ad-filters-checkbox")[0]
);

fireEvent.click(container.getByTestId("ad-filters-submit")[0]);

expect(container.getElementsByClassName("ad-card").length).toBeGreaterThan(0);
});
});
}); });

+ 121
- 0
src/__tests__/UITests/patternDetailsPageUI.test.js Ver fichero

import {
render,
screen,
fireEvent,
waitFor,
findByTestId,
} from "@testing-library/react";
import * as redux from "react-redux";
import store from "../../store";
import { mockState } from "../../mockState";
import { Router } from "react-router-dom";
import history from "../../store/utils/history";
import ColorModeProvider from "../../context/ColorModeContext";
import PatternDetailsPage from "../../pages/PatternsPage/PatternDetailsPage";

describe("PatternDetailsPage render tests", () => {
var props = {
history: {
replace: jest.fn(),
push: jest.fn(),
location: {
pathname: "/patterns/1",
},
},
};

const cont = (
<redux.Provider store={store}>
<Router history={history}>
<ColorModeProvider>
<PatternDetailsPage {...props} />
</ColorModeProvider>
</Router>
</redux.Provider>
);

let spyOnUseSelector;

beforeEach(() => {
spyOnUseSelector = jest.spyOn(redux, "useSelector");
spyOnUseSelector
.mockReturnValue(mockState.patterns.patterns[0])
.mockReturnValue([
{
applicantId: 21359,
firstName: "Jelena",
lastName: "Zivkovic",
email: "jelena.d.zivkovic@gmail.com",
},
])
.mockReturnValue(null);
});

afterEach(() => {
jest.restoreAllMocks();
});

it("Should render PatternDetaisPage", async () => {
render(cont);
waitFor(() => {
expect(screen.getByTestId("pattern-details")).toBeDefined();
});
});

it("Should render select input for choosing candidate", async () => {
render(cont);
waitFor(() => {
expect(screen.getByTestId("pattern-details-select")).toBeDefined();
});
});

it("Should render add candidate button for choosing email", async () => {
render(cont);
waitFor(() => {
expect(screen.getByTestId("pattern-details-plus")).toBeDefined();
});
});

it("Should render go back button", async () => {
const { container } = render(cont);
waitFor(() => {
expect(
container.getElementsByClassName("ad-details-buttons-link")[0]
).toBeDefined();
});
});

it("Should go to patterns page when click go back button", async () => {
const { container } = render(cont);

waitFor(() => {
fireEvent.click(screen.getByTestId("ad-details-buttons-link"));

expect(props.history.push).toHaveBeenCalledWith("/patterns");
});
});

it("Should render send email button", () => {
render(cont);

waitFor(() => {
expect(screen.getByTestId("pattern-details-send-email")).toBeDefined();
});
});

it("Should render send email modal", () => {
render(cont);

waitFor(() => {
fireEvent.change(screen.getByTestId("pattern-details-select"), {
target: { value: "jelena.d.zivkovic@gmail.com" },
});

fireEvent.click(screen.getByTestId("pattern-details-plus"));

fireEvent.click(screen.getByTestId("pattern-details-send-email"));

expect(props.history.push).toHaveBeenCalledWith("/patterns");
});
});
});

+ 16
- 17
src/__tests__/UITests/patternsPageUI.test.js Ver fichero

import { render, screen, fireEvent } from "@testing-library/react";
import { render, screen, fireEvent, waitFor } from "@testing-library/react";
import * as redux from "react-redux"; import * as redux from "react-redux";
import PatternsPage from "../../pages/PatternsPage/PatternsPage"; import PatternsPage from "../../pages/PatternsPage/PatternsPage";
import store from "../../store"; import store from "../../store";


beforeEach(() => { beforeEach(() => {
spyOnUseSelector = jest.spyOn(redux, "useSelector"); spyOnUseSelector = jest.spyOn(redux, "useSelector");
spyOnUseSelector
.mockReturnValueOnce(mockState.patterns.patterns)
// .mockReturnValueOnce([
// {
// id: 1,
// name: "HR intervju",
// selectionProcesses: [],
// },
// ]);
spyOnUseSelector.mockReturnValue(mockState.patterns.patterns);
// .mockReturnValueOnce([
// {
// id: 1,
// name: "HR intervju",
// selectionProcesses: [],
// },
// ]);
}); });


afterEach(() => { afterEach(() => {
expect(btn1).toBeDefined(); expect(btn1).toBeDefined();
}); });


it("Should render pattern cards", async () => {
const { container } = render(cont);
expect(
container.getElementsByClassName("pattern-card-parent").length
).toBeGreaterThan(0);
});

it("Should render add pattern button", () => { it("Should render add pattern button", () => {
const { container } = render(cont); const { container } = render(cont);
expect(container.getElementsByClassName("add-ad-btn")[0]).toBeDefined(); expect(container.getElementsByClassName("add-ad-btn")[0]).toBeDefined();
); );
expect(screen.getByTestId("pattern-filters")).toBeDefined(); expect(screen.getByTestId("pattern-filters")).toBeDefined();
}); });

it("Should render pattern cards", () => {
const { container } = render(cont);
expect(
container.getElementsByClassName("pattern-card-parent").length
).toBeGreaterThan(0);
});
}); });

+ 2
- 1
src/components/Ads/AdFilters.js Ver fichero

onChange={handleCheckboxes} onChange={handleCheckboxes}
value={technology.name} value={technology.name}
checked={technology.isChecked} checked={technology.isChecked}
className="ad-filters-checkbox"
/> />
} }
label={technology.name} label={technology.name}
</div> </div>
</div> </div>
<div className="ad-filters-search"> <div className="ad-filters-search">
<button onClick={onSubmitFilters} className="c-btn c-btn--primary">
<button onClick={onSubmitFilters} className="c-btn c-btn--primary" data-testid="ad-filters-submit">
Pretrazi Pretrazi
</button> </button>
</div> </div>

+ 21
- 10
src/pages/PatternsPage/PatternDetailsPage.js Ver fichero

import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { IconButton } from "@mui/material"; import { IconButton } from "@mui/material";
import { Link } from "react-router-dom";
import plusIcon from "../../assets/images/plus.png"; import plusIcon from "../../assets/images/plus.png";
import sendMessage from "../../assets/images/send_message.png"; import sendMessage from "../../assets/images/send_message.png";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";


useEffect(() => { useEffect(() => {
const arrOfApplicants = []; const arrOfApplicants = [];
if(!patternApplicants || !emails) return
if (!patternApplicants || !emails) return;
for (let i = 0; i < patternApplicants.length; i++) { for (let i = 0; i < patternApplicants.length; i++) {
let s = 0; let s = 0;
for (let j = 0; j < emails.length; j++) { for (let j = 0; j < emails.length; j++) {


const addNewEmailHandler = () => { const addNewEmailHandler = () => {
if (email.length === 0) return; if (email.length === 0) return;
if(selectedPatternApplicants.length === 0) return;
if (selectedPatternApplicants.length === 0) return;
setEmails((oldState) => [...oldState, email]); setEmails((oldState) => [...oldState, email]);
setEmail(""); setEmail("");
}; };
<p>{pattern.selectionLevel.name}</p> <p>{pattern.selectionLevel.name}</p>
</div> </div>
<div className="pattern-details-card-sub-card-add-email"> <div className="pattern-details-card-sub-card-add-email">
<select onChange={(e) => setEmail(e.target.value)}>
{selectedPatternApplicants && selectedPatternApplicants.length > 0 &&
<select
data-testid="pattern-details-select"
onChange={(e) => setEmail(e.target.value)}
>
{selectedPatternApplicants &&
selectedPatternApplicants.length > 0 &&
selectedPatternApplicants.map((applicant) => ( selectedPatternApplicants.map((applicant) => (
<option <option
key={applicant.applicantId} key={applicant.applicantId}
</option> </option>
))} ))}
</select> </select>
<button onClick={addNewEmailHandler}>
<button
onClick={addNewEmailHandler}
data-testid="pattern-details-plus"
>
<img src={plusIcon} alt="plus" /> <img src={plusIcon} alt="plus" />
</button> </button>
</div> </div>
</div> </div>
<div className="pattern-details-card-sub-card-message-pattern"> <div className="pattern-details-card-sub-card-message-pattern">
{/* <textarea disabled value={pattern.message}></textarea> */} {/* <textarea disabled value={pattern.message}></textarea> */}
{parse(pattern.message)}
{parse(pattern.message)}
</div> </div>
</div> </div>


<div className="pattern-details-card-buttons"> <div className="pattern-details-card-buttons">
<Link className="ad-details-buttons-link" to="/patterns">
Nazad na sve šablone
</Link>
<button
className="ad-details-buttons-link"
data-testid="ad-details-buttons-link"
onClick={() => history.push(PATTERNS_PAGE)}
>
Nazad na sve oglase
</button>
<IconButton <IconButton
disabled={emails && emails.length === 0} disabled={emails && emails.length === 0}
className="c-btn c-btn--primary add-ad-btn" className="c-btn c-btn--primary add-ad-btn"
data-testid="pattern-details-send-email"
onClick={scheduleAppointmentHandler} onClick={scheduleAppointmentHandler}
> >
<img <img

Cargando…
Cancelar
Guardar