Cypress检查元素位置。

Question

使用Cypress.io，有没有一种方法来检查元素的位置？我遇到了一个问题，在某些情况下，有一个错误，其中滚动条会不断添加和删除，导致页面边缘“抖动”，我希望能够编写一个测试来查看是否发生了这种情况，通过断言元素的位置在出现后没有改变。我在文档中没有看到任何关于这样的断言的内容。

- Turner Hayes

Answer 1

我想我已经弄清楚了，大概是这样的：

let initialPosition;

cy.get('button').then(
  ($button) => {
    initialPosition = $button.position();
  }
);

cy.wait(100);

cy.get('button')
  .should(
    ($button) => {
      expect($button.position()).deep.equal(initialPosition);
    }
  );
});

不太有效，但这是我想要的测试。

- Turner Hayes

Answer 2

是的，您可以通过Cypress检查CSS值。

示例：

.should('have.css', 'float', 'right');

.should('have.css', 'right', '10px');

.should('have.css', 'top', '50%'); 

- Hussam AlHunaiti

---

这不会给出页面上实际的位置，只会给出应用于元素的样式。 - Turner Hayes