mark-web/cypress/e2e/markbody-container.spec.cy.ts

describe("评卷页面-裁切图", () => {
  beforeEach(() => {
    cy.networkStub();
    cy.visit("/");
    cy.clock();
  });

  it("裁切图显示", () => {
    cy.wait(4000)
      .get(".mark-body-container .single-image-container")
      .should("exist");
  });

  it("键盘选择鼠标分数成功", () => {
    cy.wait(1000)
      .get(".mark-body-container")
      .get("body")
      .type("1")
      .trigger("click", {
        clientX: 200,
        clientY: 350,
      })
      .get(".cursor-border")
      .should("contain", "1");
  });

  it("键盘选择鼠标分数失败", () => {
    cy.wait(1000)
      .get(".mark-body-container")
      .get("body")
      .type("1.47")
      .trigger("click", {
        clientX: 200,
        clientY: 350,
      })
      .get(".cursor-border")
      .should("contain", "1.4");
  });

  it("裁切图点击-分数增加", () => {
    // 任务开始渲染了
    cy.get(".single-image-container");
    cy.tick(10000);
    // 等待遮罩层消除
    cy.get('[data-test="status-spin"]').should("not.exist");

    cy.get(".mark-body-container")
      .scrollTo(0, 0)
      .get("body")
      .type("1")
      .click(200, 300)
      .tick(3500)
      .get("body")
      .type("2")
      .click(300, 500)
      .tick(3500)
      .get(".single-image-container:nth(2)")
      .scrollIntoView()
      .get("body")
      .type("3")
      .click(400, 200)
      .tick(500);
    cy.get(".score-container").should("have.length", 3);

    cy.get(".total-score span span").contains("6");
  });

  it("裁切图点击-分数轨迹过近", () => {
    // 任务开始渲染了
    cy.get(".single-image-container");
    cy.tick(10000);
    // 等待遮罩层消除
    cy.get('[data-test="status-spin"]').should("not.exist");

    cy.get(".mark-body-container")
      .scrollTo(0, 0)
      .get("body")
      .type("1")
      .click(200, 300)
      .tick(1500)
      .get("body")
      .type("2")
      .click(205, 305)
      .tick(500);
    cy.get(".score-container").should("have.length", 1);

    cy.get(".total-score span span").contains("1");
  });

  it("裁切图点击-分数在有效区域外", () => {
    // 任务开始渲染了
    cy.get(".single-image-container");
    cy.tick(10000);
    // 等待遮罩层消除
    cy.get('[data-test="status-spin"]').should("not.exist");

    cy.get("body .mark-body-container")
      .scrollTo(0, 0)
      .get("body")
      .type("3")
      .click(900, 200)
      // 要给点时间页面计算动画
      .wait(500);

    cy.get("body .mark-body-container .score-container").should(
      "have.length",
      0
    );
  });

  it("清除本题分数", () => {
    // 任务开始渲染了
    cy.get(".single-image-container");
    cy.tick(10000);
    // 等待遮罩层消除
    cy.get('[data-test="status-spin"]').should("not.exist");

    cy.get("body .mark-body-container")
      .scrollTo(0, 0)
      .get("body")
      .type("3")
      .click(200, 200)
      .tick(1500)
      .get("body")
      .type("2")
      .click(200, 300)
      .tick(500);

    cy.get('[data-test="clear-score"]').click();
    cy.tick(500);
    cy.get("body .mark-body-container .score-container").should(
      "have.length",
      0
    );
  });
});