describe("Quiz preview", () => {
    beforeEach(() => {
        cy.visit("/list");

        cy.get("[data-cy=create-quiz]").click();
        cy.get("[data-cy=create-quiz-card]").click();
        cy.get("[data-cy=select-quiz-layout-standard]").click();
        cy.get("[data-cy=setup-questions]").click();
    });

    it("container and layout elements should exist", () => {
        cy.get("[data-cy=quiz-preview-container]").should("exist");
        cy.get("[data-cy=quiz-preview-layout]").should("exist");
    });

    describe("Variant question", () => {
        beforeEach(function fillTitleAndOptions() {
            cy.get("[data-cy=expand-question]").click();
            cy.get("[data-cy=select-questiontype-variant]").click();
            cy.get("[data-cy=quiz-question-card]").eq(0).within(() => {
                cy.get("[data-cy=quiz-question-title]").type("Question Title");
                cy.get("[data-cy=quiz-variant-question-answer]").eq(0).type("Answer 1{enter}");
                cy.get("[data-cy=quiz-variant-question-answer]").eq(1).type("Answer 2{enter}");
                cy.get("[data-cy=quiz-variant-question-answer]").eq(2).type("Answer 3");
            });
        });

        it("should contain title and options, and be selected properly", () => {
            cy.get("[data-cy=quiz-preview-layout]").within(() => {
                cy.get("[data-cy=variant-title]").should("have.text", "Question Title");
                cy.get("[data-cy=variant-answer]").eq(0).should("have.text", "Answer 1");
                cy.get("[data-cy=variant-answer]").eq(1).should("have.text", "Answer 2");
                cy.get("[data-cy=variant-answer]").eq(2).should("have.text", "Answer 3");

                cy.get("[data-cy=variant-answer]").eq(0).click();
                cy.get("[data-cy=variant-radio]").eq(0).should("be.checked");
                cy.get("[data-cy=variant-radio]").eq(1).should("not.be.checked");
                cy.get("[data-cy=variant-radio]").eq(2).should("not.be.checked");

                cy.get("[data-cy=variant-answer]").eq(1).click();
                cy.get("[data-cy=variant-radio]").eq(0).should("not.be.checked");
                cy.get("[data-cy=variant-radio]").eq(1).should("be.checked");
                cy.get("[data-cy=variant-radio]").eq(2).should("not.be.checked");

                cy.get("[data-cy=variant-answer]").eq(2).click();
                cy.get("[data-cy=variant-radio]").eq(0).should("not.be.checked");
                cy.get("[data-cy=variant-radio]").eq(1).should("not.be.checked");
                cy.get("[data-cy=variant-radio]").eq(2).should("be.checked");
            });
        });
    });
});