create quizResultsPage
This commit is contained in:
ArtChaos189
parent
80a370959a
commit
75e672934c
153
cypress/e2e/quizResultsPage.cy.ts
Normal file
153
cypress/e2e/quizResultsPage.cy.ts
Normal file
@ -0,0 +1,153 @@
|
||||
import "cypress-file-upload";
|
||||
|
||||
describe("Тест на появление страницы Результатов", () => {
|
||||
beforeEach(() => {
|
||||
cy.visit("http://localhost:3000");
|
||||
cy.wait(1000);
|
||||
cy.contains("Регистрация / Войти").click();
|
||||
const login = "valid_user@exammple.com";
|
||||
const password = "valid_password";
|
||||
|
||||
cy.get("#email").type(login);
|
||||
cy.get("#password").type(password);
|
||||
cy.get('button[type="submit"]').click();
|
||||
});
|
||||
|
||||
it("Тест ", () => {
|
||||
//создаём вопрос и выбираем стартовую страницу
|
||||
cy.get('[data-cy="create-quiz"]').click();
|
||||
cy.wait(1000);
|
||||
cy.get('button[data-cy="create-quiz-card"]').eq(0).click();
|
||||
cy.wait(1000);
|
||||
cy.get('button[data-cy="select-quiz-layout-standard"]').click();
|
||||
cy.get('input[type="checkbox"]').click();
|
||||
|
||||
cy.get('[data-cy="setup-questions"]').click();
|
||||
|
||||
cy.wait(500);
|
||||
|
||||
cy.get(`[data-cy="select-questiontype-images"]`).click();
|
||||
|
||||
cy.get(
|
||||
'[data-cy="checkbox-optional-question"] > .PrivateSwitchBase-input',
|
||||
).click();
|
||||
|
||||
cy.get("#questionTitle").type("Вопрос");
|
||||
|
||||
cy.get('[data-cy="quiz-variant-question-answer"]')
|
||||
.eq(0)
|
||||
.type("1")
|
||||
.type("{enter}");
|
||||
cy.get('[data-cy="quiz-variant-question-answer"]')
|
||||
.eq(1)
|
||||
.should("have.value", "")
|
||||
.type("2");
|
||||
|
||||
cy.get('[data-cy="next-step"]').click();
|
||||
|
||||
//проверяем все поля на пустоту страницы результата
|
||||
|
||||
cy.get(`[data-cy="expand-question"]`).eq(0).click();
|
||||
cy.wait(200);
|
||||
cy.get("#after-the-contact-form").click();
|
||||
|
||||
cy.get("#heading-result").should("have.value", "");
|
||||
cy.get("#headline-is-bolder").should("have.value", "");
|
||||
cy.get("#heading-description").should("have.value", "");
|
||||
|
||||
cy.get(`[data-cy="add-button"]`).click();
|
||||
cy.wait(200);
|
||||
cy.get("#button-text-result").should("have.value", "");
|
||||
cy.get("#link-page-result").should("have.value", "");
|
||||
|
||||
//перемещаемся на странице тестового просмотра
|
||||
|
||||
cy.visit("http://localhost:3000/view");
|
||||
|
||||
cy.get(".MuiFormControlLabel-label").contains("1").click();
|
||||
cy.get("#buttonFurther").click();
|
||||
cy.wait(1000);
|
||||
|
||||
cy.get("#name-input").type("Name");
|
||||
cy.get("#email-input").type("valid_user@exammple.com");
|
||||
cy.get("#phone-input").type("+2682585");
|
||||
|
||||
cy.get('input[type="checkbox"]').click();
|
||||
cy.wait(200);
|
||||
cy.get("#get-results").click();
|
||||
|
||||
//проверяем что страница результатов не отобразилась
|
||||
|
||||
cy.wait(2000);
|
||||
cy.get("#find-out-more-button").should("not.exist");
|
||||
|
||||
//поселе чего заполняем все поля в результате
|
||||
|
||||
cy.visit("http://localhost:3000/edit");
|
||||
|
||||
cy.get("#heading-result").type("Результат");
|
||||
cy.get("#headline-is-bolder").type("Заголовок пожирнее");
|
||||
cy.get("#heading-description").type("Описание обычного заголовка");
|
||||
cy.get(`[data-cy="add-button"]`).click();
|
||||
cy.wait(200);
|
||||
cy.get("#button-text-result").type("Узнать подробнее");
|
||||
|
||||
//переходим на страницу тестового просмотра
|
||||
|
||||
cy.visit("http://localhost:3000/view");
|
||||
|
||||
cy.get(".MuiFormControlLabel-label").contains("1").click();
|
||||
cy.get("#buttonFurther").click();
|
||||
cy.wait(1000);
|
||||
|
||||
cy.get("#name-input").type("Name");
|
||||
cy.get("#email-input").type("valid_user@exammple.com");
|
||||
cy.get("#phone-input").type("+2682585");
|
||||
|
||||
cy.get('input[type="checkbox"]').click();
|
||||
cy.wait(200);
|
||||
cy.get("#get-results").click();
|
||||
cy.wait(2000);
|
||||
cy.contains("p", "Заголовок пожирнее").should("exist");
|
||||
|
||||
//Переключаем показывания результата до формы контактов
|
||||
cy.visit("http://localhost:3000/edit");
|
||||
|
||||
cy.get(`[data-cy="expand-question"]`).eq(0).click();
|
||||
cy.wait(200);
|
||||
cy.get("#before-contact-form").click();
|
||||
cy.wait(2000);
|
||||
|
||||
cy.visit("http://localhost:3000/view");
|
||||
cy.get(".MuiFormControlLabel-label").contains("1").click();
|
||||
cy.get("#buttonFurther").click();
|
||||
cy.wait(2000);
|
||||
cy.contains("p", "Заголовок пожирнее").should("exist");
|
||||
|
||||
//тоже самое тольок теперь очищаем поля формы результатов
|
||||
cy.visit("http://localhost:3000/edit");
|
||||
cy.get("#heading-result").clear();
|
||||
cy.get("#headline-is-bolder").clear();
|
||||
cy.get("#heading-description").clear();
|
||||
cy.get("#button-text-result").clear();
|
||||
|
||||
cy.visit("http://localhost:3000/view");
|
||||
|
||||
cy.get(".MuiFormControlLabel-label").contains("1").click();
|
||||
cy.get("#buttonFurther").click();
|
||||
cy.wait(2000);
|
||||
cy.get("#find-out-more-button").should("not.exist");
|
||||
|
||||
// let linkText;
|
||||
|
||||
// cy.get('[data-cy="link-test"]')
|
||||
// .invoke("text")
|
||||
// .then((text) => {
|
||||
// linkText = text;
|
||||
// });
|
||||
|
||||
// cy.wait(2000).then(() => {
|
||||
// cy.visit(linkText);
|
||||
// });
|
||||
});
|
||||
});
|
||||
@ -121,6 +121,7 @@ export default function QuestionsPage({
|
||||
<ArrowLeft />
|
||||
</Button>
|
||||
<Button
|
||||
data-cy="next-step"
|
||||
variant="contained"
|
||||
sx={{
|
||||
height: "44px",
|
||||
|
||||
@ -281,6 +281,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
}}
|
||||
>
|
||||
<CustomTextField
|
||||
id="heading-result"
|
||||
value={resultData.title}
|
||||
placeholder={"Заголовок результата"}
|
||||
onChange={({ target }: { target: HTMLInputElement }) =>
|
||||
@ -307,6 +308,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
}}
|
||||
>
|
||||
<CustomTextField
|
||||
id="headline-is-bolder"
|
||||
value={resultData.description}
|
||||
onChange={({ target }: { target: HTMLInputElement }) =>
|
||||
updateQuestion(
|
||||
@ -324,6 +326,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
</Box>
|
||||
|
||||
<TextField
|
||||
id="heading-description"
|
||||
value={resultData.content.text}
|
||||
onChange={({ target }: { target: HTMLInputElement }) =>
|
||||
updateQuestion(
|
||||
@ -358,6 +361,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
|
||||
{buttonPlus ? (
|
||||
<Button
|
||||
data-cy="add-button"
|
||||
onClick={() => {
|
||||
setButtonPlus(false);
|
||||
}}
|
||||
@ -404,6 +408,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
</IconButton>
|
||||
</Box>
|
||||
<CustomTextField
|
||||
id="button-text-result"
|
||||
value={resultData.content.hint.text}
|
||||
onChange={({ target }: { target: HTMLInputElement }) =>
|
||||
updateQuestion(resultData.id, (question) => {
|
||||
@ -443,6 +448,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => {
|
||||
Cсылка для кнопки
|
||||
</Typography>
|
||||
<CustomTextField
|
||||
id="link-page-result"
|
||||
value={resultData.content.redirect}
|
||||
onChange={({ target }: { target: HTMLInputElement }) =>
|
||||
updateQuestion<QuizQuestionResult>(
|
||||
|
||||
@ -25,16 +25,19 @@ import ArrowCounterClockWise from "@icons/ArrowCounterClockWise.svg";
|
||||
type WhenVariants = {
|
||||
title: string;
|
||||
value: "before" | "after";
|
||||
id: string;
|
||||
};
|
||||
|
||||
const whenValues: WhenVariants[] = [
|
||||
{
|
||||
title: "До формы контактов",
|
||||
value: "before",
|
||||
id: "before-contact-form",
|
||||
},
|
||||
{
|
||||
title: "После формы контактов",
|
||||
value: "after",
|
||||
id: "after-the-contact-form",
|
||||
},
|
||||
];
|
||||
|
||||
@ -187,9 +190,10 @@ export const WhenCard = ({ quizExpand }: Props) => {
|
||||
mb: "20px",
|
||||
}}
|
||||
>
|
||||
{whenValues.map(({ title, value }, index) => (
|
||||
{whenValues.map(({ title, value, id }, index) => (
|
||||
<Box display="flex">
|
||||
<Button
|
||||
id={id}
|
||||
onClick={() => {
|
||||
updateQuiz(quiz.id, (quiz) => {
|
||||
quiz.config.resultInfo.showResultForm = value;
|
||||
|
||||
@ -188,6 +188,7 @@ export const ContactForm = ({
|
||||
// resultQuestion &&
|
||||
// quiz?.config.resultInfo.showResultForm === "after" &&
|
||||
<Button
|
||||
id="get-results"
|
||||
disabled={!ready}
|
||||
variant="contained"
|
||||
onClick={() => {
|
||||
@ -271,9 +272,9 @@ const Inputs = (currentQuestion: any) => {
|
||||
const quiz = useCurrentQuiz();
|
||||
const { questions } = useQuestionsStore();
|
||||
|
||||
const [name, setName] = useState("");
|
||||
const [email, setEmail] = useState("");
|
||||
const [phone, setPhone] = useState("");
|
||||
const [name, setName] = useState("name-input");
|
||||
const [email, setEmail] = useState("email-input");
|
||||
const [phone, setPhone] = useState("phone-input");
|
||||
const [text, setText] = useState("");
|
||||
const [adress, setAdress] = useState("");
|
||||
|
||||
@ -353,7 +354,7 @@ const Inputs = (currentQuestion: any) => {
|
||||
}
|
||||
};
|
||||
|
||||
const CustomInput = ({ title, desc, Icon }: any) => {
|
||||
const CustomInput = ({ title, desc, Icon, id }: any) => {
|
||||
const theme = useTheme();
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down(600));
|
||||
return (
|
||||
@ -362,6 +363,7 @@ const CustomInput = ({ title, desc, Icon }: any) => {
|
||||
{title}
|
||||
</Typography>
|
||||
<TextField
|
||||
id={id}
|
||||
sx={{
|
||||
width: isMobile ? "300px" : "350px",
|
||||
}}
|
||||
|
||||
@ -195,6 +195,7 @@ export const ResultForm = ({
|
||||
>
|
||||
{quiz?.config.resultInfo.showResultForm === "before" && (
|
||||
<Button
|
||||
id="find-out-more-button"
|
||||
onClick={followNextForm}
|
||||
variant="contained"
|
||||
sx={{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user