Тест на создание нового квиза

cypress/e2e/quizHomePageFields.cy.ts

@@ -0,0 +1,140 @@
+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"]').click();
+    cy.wait(1000);
+    cy.get('button[data-cy="select-quiz-layout-standard"]').click();
+
+    cy.get("#contentButton").click();
+
+    cy.get("#headingInput").type("Заголовок заголовка");
+    cy.get("#textInput").type("У нас тут какой-то текст");
+    cy.get("#buttonTextInput").type("Нажми на кнопку");
+    cy.get("#phoneInput").type("8-800-000-00-00");
+    cy.get("#companyInput").type("Наш слоган - слоган наш");
+    cy.get("#websiteInput").type("http://vk:3000/edit");
+    cy.get("#legalInformationInput").type("У наших документов есть данные");
+
+    cy.get(`button[data-cy="button-preview"]`).click();
+    cy.wait(2000);
+
+    // проверка введёных значений
+    cy.get(`[data-cy="heading"]`)
+      .should("exist")
+      .and("have.text", "Заголовок заголовка");
+    cy.get(`[data-cy="text"]`)
+      .should("exist")
+      .and("have.text", "У нас тут какой-то текст");
+    cy.get(`[data-cy="phonenumber"`)
+      .should("exist")
+      .and("have.text", "8-800-000-00-00");
+    cy.get(`[data-cy="startpage-button"]`)
+      .should("exist")
+      .and("have.text", "Нажми на кнопку");
+    cy.get(`[data-cy="company"]`)
+      .should("exist")
+      .and("have.text", "Наш слоган - слоган наш");
+    cy.get(`[data-cy="legalInformation"]`)
+      .should("exist")
+      .and("have.text", "У наших документов есть данные");
+
+    cy.get(`button[data-cy="button-preview"]`).click();
+
+    //создаём вопрос для тестового просмотра
+
+    cy.get('[data-cy="setup-questions"]').click();
+
+    cy.wait(500);
+
+    // cy.get('[data-cy="create-question"]').click();
+
+    cy.get(`[data-cy="select-questiontype-images"]`).click();
+    cy.get(
+      '[data-cy="checkbox-optional-question"] > .PrivateSwitchBase-input',
+    ).click();
+    cy.get('[data-cy="quiz-variant-question-answer"]')
+      .eq(0)
+      .type("1")
+      .type("{enter}");
+
+    cy.get('button[data-cy="back-button"]').scrollIntoView().wait(500).click();
+    cy.wait(1000);
+    cy.visit("http://localhost:3000/view");
+    cy.wait(2000);
+
+    //проверка введёных значений
+    cy.get(`[data-cy="heading"]`)
+      .should("exist")
+      .and("have.text", "Заголовок заголовка");
+    cy.get(`[data-cy="text"]`)
+      .should("exist")
+      .and("have.text", "У нас тут какой-то текст");
+    cy.get(`[data-cy="phonenumber"`)
+      .should("exist")
+      .and("have.text", "8-800-000-00-00");
+    cy.get(`[data-cy="startpage-button"]`)
+      .should("exist")
+      .and("have.text", "Нажми на кнопку");
+    cy.get(`[data-cy="company"]`)
+      .should("exist")
+      .and("have.text", "Наш слоган - слоган наш");
+    cy.get(`[data-cy="legalInformation"]`)
+      .should("exist")
+      .and("have.text", "У наших документов есть данные");
+
+    cy.visit("http://localhost:3000/edit");
+    cy.wait(2000);
+
+    cy.get(`[data-cy="publish-button"]`).click();
+    cy.wait(500);
+
+    let linkText;
+
+    cy.get('[data-cy="link-test"]')
+      .invoke("text")
+      .then((text) => {
+        linkText = text;
+      });
+
+    cy.wait(2000).then(() => {
+      cy.visit(linkText);
+    });
+
+    cy.origin("https://hbpn.link", () => {
+      // <команды, направленные на https://hbpn.link, идут здесь>
+      cy.contains("p", "Заголовок заголовка").should("exist");
+      cy.wait(100);
+      cy.contains("p", "У нас тут какой-то текст").should("exist");
+      cy.wait(100);
+      cy.contains("p", "8-800-000-00-00").should("exist");
+      cy.wait(100);
+      cy.contains("p", "Наш слоган - слоган наш").should("exist");
+      cy.wait(100);
+      cy.contains("p", "У наших документов есть данные").should("exist");
+      cy.wait(100);
+      cy.get(`button`).should("exist").and("have.text", "Нажми на кнопку");
+    });
+
+    cy.visit("http://localhost:3000/list");
+    cy.wait(2000);
+
+    cy.get('[data-cy="quiz-card"] h5')
+      .should("exist")
+      .and("have.text", "Заголовок заголовка");
+  });
+});

src/pages/ViewPublicationPage/StartPageViewPublication.tsx

@@ -127,6 +127,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                 />
               )}
               <Typography
+                data-cy="company"
                 sx={{
                   fontSize: "14px",
                   color:
@@ -167,6 +168,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
               }}
             >
               <Typography
+                data-cy="heading"
                 sx={{
                   fontWeight: "bold",
                   fontSize: "26px",
@@ -188,6 +190,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                 {quiz.name}
               </Typography>
               <Typography
+                data-cy="text"
                 sx={{
                   fontSize: "16px",
                   m: "16px 0",
@@ -211,6 +214,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                 }
               >
                 <Button
+                  data-cy="startpage-button"
                   variant="contained"
                   sx={{
                     fontSize: "16px",
@@ -244,6 +248,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                   isMobileDevice ? (
                     <Link href={`tel:${quiz.config.info.phonenumber}`}>
                       <Typography
+                        data-cy="phonenumber"
                         sx={{
                           fontSize: "16px",
                           color: theme.palette.primary.main,
@@ -255,6 +260,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                   ) : (
                     <ButtonBase onClick={handleCopyNumber}>
                       <Typography
+                        data-cy="phonenumber"
                         sx={{
                           fontSize: "16px",
                           color: theme.palette.primary.main,
@@ -266,12 +272,14 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                   )
                 ) : (
                   <Typography
+                    data-cy="phonenumber"
                     sx={{ fontSize: "16px", color: theme.palette.primary.main }}
                   >
                     {quiz.config.info.phonenumber}
                   </Typography>
                 )}
                 <Typography
+                  data-cy="legalInformation"
                   sx={{
                     width: "100%",
                     overflowWrap: "break-word",

src/pages/createQuize/QuizCard.tsx

@@ -69,6 +69,7 @@ export default function QuizCard({
 
   return (
     <Box
+      data-cy="quiz-card"
       sx={{
         display: "flex",
         flexDirection: "column",

src/pages/main.tsx

@@ -177,6 +177,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
               {quiz?.status === "start" &&
                 (!isLinkButton ? (
                   <Box
+                    data-cy="link-test"
                     component={Link}
                     sx={{
                       whiteSpace: "nowrap",
@@ -193,6 +194,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
                   </Box>
                 ) : (
                   <Box
+                    data-cy="link-test"
                     component={Link}
                     sx={{
                       cursor: "pointer",
@@ -215,6 +217,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
               {/* Маленькая кнопка ссылки */}
               {isMobile && quiz?.status === "start" && (
                 <Box
+                  data-cy="link-test"
                   component={Link}
                   sx={{
                     cursor: "pointer",
@@ -237,6 +240,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
               {currentStep <= 1 && (
                 <Box sx={{ textAlign: "end", width: "100%" }}>
                   <IconButton
+                    data-cy="button-preview"
                     onClick={toggleQuizPreview}
                     sx={{
                       pointerEvents: "auto",

src/pages/startPage/StartPageSettings.tsx

@@ -126,7 +126,7 @@ export default function StartPageSettings() {
               Дизайн
             </Typography>
           </Button>
-          <Button onClick={() => setFormState("content")}>
+          <Button id="contentButton" onClick={() => setFormState("content")}>
             <Typography
               sx={{
                 fontWeight: 500,
@@ -616,6 +616,7 @@ export default function StartPageSettings() {
                 Заголовок
               </Typography>
               <CustomTextField
+                id="headingInput"
                 placeholder="Имя заголовка опроса для подбора табуретки"
                 value={quiz.name}
                 onChange={(e) =>
@@ -636,6 +637,7 @@ export default function StartPageSettings() {
                 Текст
               </Typography>
               <CustomTextField
+                id="textInput"
                 placeholder="Внимательно заполняйте поля ответов"
                 value={quiz.config.startpage.description}
                 onChange={(e) =>
@@ -656,6 +658,7 @@ export default function StartPageSettings() {
                 Текст кнопки
               </Typography>
               <CustomTextField
+                id="buttonTextInput"
                 placeholder="Начать опрос"
                 value={quiz.config.startpage.button}
                 onChange={(e) =>
@@ -676,6 +679,7 @@ export default function StartPageSettings() {
                 Телефон
               </Typography>
               <CustomTextField
+                id="phoneInput"
                 placeholder="8-800-000-00-00"
                 type="number"
                 value={quiz.config.info.phonenumber}
@@ -707,6 +711,7 @@ export default function StartPageSettings() {
                 Название или слоган компании
               </Typography>
               <CustomTextField
+                id="companyInput"
                 placeholder="Только лучшее"
                 value={quiz.config.info.orgname}
                 onChange={(e) =>
@@ -727,6 +732,7 @@ export default function StartPageSettings() {
                 Сайт
               </Typography>
               <CustomTextField
+                id="websiteInput"
                 placeholder="https://mysite.com"
                 value={quiz.config.info.site}
                 onChange={(e) =>
@@ -747,6 +753,7 @@ export default function StartPageSettings() {
                 Юридическая информация
               </Typography>
               <CustomTextField
+                id="legalInformationInput"
                 placeholder="Данные наших документов"
                 value={quiz.config.info.law}
                 onChange={(e) =>

src/ui_kit/CustomTextField.tsx

@@ -13,6 +13,7 @@ import type { InputProps, SxProps, Theme } from "@mui/material";
 
 interface CustomTextFieldProps {
   placeholder: string;
+  id?: string;
   value?: string;
   error?: string;
   emptyError?: boolean;
@@ -31,6 +32,7 @@ interface CustomTextFieldProps {
 
 export default function CustomTextField({
   placeholder,
+  id,
   value = "",
   onChange,
   onKeyDown,
@@ -99,6 +101,7 @@ export default function CustomTextField({
         </InputLabel>
       )}
       <Input
+        id={id}
         defaultValue={text}
         fullWidth
         value={inputValue}

src/ui_kit/StartPagePreview/QuizPreviewLayout.tsx

@@ -84,7 +84,7 @@ export default function QuizPreviewLayout() {
                   alt=""
                 />
               )}
-              <Typography sx={{ fontSize: "12px" }}>
+              <Typography data-cy="company" sx={{ fontSize: "12px" }}>
                 {quiz.config.info.orgname}
               </Typography>
             </Box>
@@ -105,12 +105,15 @@ export default function QuizPreviewLayout() {
                     : "start",
               }}
             >
-              <Typography sx={{ fontWeight: "bold" }}>{quiz.name}</Typography>
+              <Typography data-cy="heading" sx={{ fontWeight: "bold" }}>
-              <Typography sx={{ fontSize: "12px" }}>
+                {quiz.name}
+              </Typography>
+              <Typography data-cy="text" sx={{ fontSize: "12px" }}>
                 {quiz.config.startpage.description}
               </Typography>
               <Box>
                 <Button
+                  data-cy="startpage-button"
                   variant="contained"
                   sx={{
                     fontSize: "16px",
@@ -139,6 +142,7 @@ export default function QuizPreviewLayout() {
                 ) : (
                   <ButtonBase onClick={handleCopyNumber}>
                     <Typography
+                      data-cy="phonenumber"
                       sx={{
                         fontSize: "16px",
                         color: theme.palette.primary.main,
@@ -150,12 +154,13 @@ export default function QuizPreviewLayout() {
                 )
               ) : (
                 <Typography
+                  data-cy="phonenumber"
                   sx={{ fontSize: "16px", color: theme.palette.primary.main }}
                 >
                   {quiz.config.info.phonenumber}
                 </Typography>
               )}
-              <Typography sx={{ fontSize: "12px" }}>
+              <Typography data-cy="legalInformation" sx={{ fontSize: "12px" }}>
                 {quiz.config.info.law}
               </Typography>
             </Box>

src/ui_kit/Toolbars/ButtonRecallQuiz.tsx

@@ -38,6 +38,7 @@ export const ButtonRecallQuiz = () => {
 
   return (
     <Button
+      data-cy="publish-button"
       variant="contained"
       sx={{
         fontSize: "14px",