时间戳

首页 > 解决方案 > 赛普拉斯不会自动滚动

javascript - 赛普拉斯不会自动滚动

问题描述

我尝试使用 scrollIntoView()、scrollTo() 方法，尝试使 css 设置无效，但一切都在进行中。当前情况：当我运行测试时，它给了我这个错误：（重试超时：cy.type（）失败，因为这个元素的中心被隐藏了：）测试运行时，它不能向下滚动，所以它看不到它需要的定位器。当我同时手动向下滚动到足以实际看到元素时，cypress 找到它，获取它并制作其他方法。

理想情况：测试将以自动向下滚动到页面以查看所需元素的方式运行，因此不需要手动帮助。

我在这里写下代码，但更改了个人数据。我应该在这里使用如下代码行：

// document.getElementsByTagName("html")[0].style.scrollBehavior = "unset";

或者：

const disableSmoothScroll = () => {
  cy.document().then((document) => {
    const node = document.createElement("style");
    node.innerHTML = "html { scroll-behavior: unset !important; }";
    document.body.appendChild(node);
  });
};

我尝试同时实现它们，因为我在其他类似问题中发现了它们，但它们对我没有任何作用。

import exampleImport from "../../PageObjects/examples/exampleImportClasses.js";

describe("Example Test", function () {
  it("Details1", function () {
    pp.login();
    pp.NPAsubmit();
    cy.get("#name", { timeout: 30000 }).type("Test");
    cy.get("#Number", { timeout: 30000 }).type("123");
    cy.get("#vatNumber", { timeout: 30000 }).type("123");
    pp.Address_default();
  });
});

class exampleImport {
  login() {
    cy.visit("https://xxx");
    cy.get("#email", { timeout: 30000 })
      .clear()
      .type("example@gmail.com");
    cy.get("#password").clear().type("example");
    cy.get("button[type=submit]").click();
    cy.url().should("include", "example");
  }
  NPAsubmit() {
    cy.get(":nth-child(3) > .nav-link", { timeout: 30000 }).click();
    cy.get(".btn-primary").click();
  }
  Address_default() {
    cy.get("#street").scrollIntoView().should("be.visible");
    cy.get("#street").type("Test");

    cy.get("#city").scrollIntoView().should("be.visible");
    cy.get("#city").type("Test");
    cy.get("#country").select("Uruguay (UY)");
  }
}

export default exampleImport;

标签： javascriptscrollcypress

解决方案

谢谢你的回答，但我知道出了什么问题。我在错误的页面中禁用了平滑滚动，因此当它重定向时，disableSmoothScroll 命令不起作用。现在 cypress 在测试时会自动将页面向下移动。

import exampleImport from "../../PageObjects/examples/exampleImportClasses.js";

describe("Example Test", function () {
  it("Details1", function () {
    const disableSmoothScroll = () => {
      cy.document().then((document) => {
        const node = document.createElement("style");
        node.innerHTML = "html { scroll-behavior: inherit !important; }";
        document.body.appendChild(node);
      });
    };
    const pp = new exampleImport();
    pp.login();
    pp.NPAsubmit();
    disableSmoothScroll();
    cy.get("#name", { timeout: 30000 }).type("Test");
    cy.get("#Number", { timeout: 30000 }).type("123");
    cy.get("#vatNumber", { timeout: 30000 }).type("123");
    pp.Address_default();
  });
});

推荐阅读