Cách cuộn đến phần tử bằng Đồng hồ bấm giờ?

Question

Tôi đang sử dụng đồng hồ bấm giờ để e2etesting ứng dụng của mình. Một trong các bài kiểm tra không thành công vì nó không thể cuộn đến phần tử mà nó đang thử nghiệm mà tôi nghi ngờ. Câu hỏi tôi cần phải cuộn hoặc có cách nào khác để làm điều đó? Đây là yếu tố tôi đang thử nghiệm:

return this.waitForElementVisible('#myElement', 4000) //wait for it to be visible 
     .assert.visible('#myElement') 
     .click('#myElement') 

Yếu tố là ở phía trên cùng của trang nhưng testrunner đã cuộn một chút xuống phía dưới trang và nó không phải là có thể nhìn thấy trong ảnh chụp màn hình. Làm cách nào để tôi có thể cuộn đến phần tử này? hoặc: Làm thế nào tôi có thể kiểm tra yếu tố này?

Answer 1

Có phương pháp gốc trong đồng hồ bấm giờ để xem các yếu tố. (Trong các yếu tố chung nên luôn luôn được cuộn vào xem từ Nightwatch/selen Nhưng nếu bạn muốn làm điều đó bằng tay, bạn có thể sử dụng getLocationInView():.

return this.getLocationInView('#myElement') 
    .assert.visible('#myElement') 
    .click('#myElement') 

Nightwatch cũng hỗ trợ làm điều này trực tiếp thông qua Nghị định thư Webdriver sử dụng moveTo() mà không cần bất kỳ trừu tượng.Trong trường hợp đó nó sẽ trông giống như:

const self = this; 
return this.api.element('#myElement', (res) => { 
    self.api.moveTo(res.value.ELEMENT, 0, 0() => { 
    self.assert.visible('#myElement'); 
    self.click('#myElement'); 
    }) 
}); 

(điều này đã được chỉ bằng văn bản từ đỉnh đầu của tôi, hy vọng tôi đã không làm cho một sai lầm)

Nhưng những gì có thể giúp đỡ trong trường hợp của bạn là seleniums thay đổi yếu tố cuộn hành vi trong cấu hình như:

firefox: { 
    desiredCapabilities: { 
    browserName: 'firefox', 
    javascriptEnabled: true, 
    acceptSslCerts: true, 
    elementScrollBehavior: 1 
    } 
} 

Mặc định là 0 -> Elements được cuộn lên trên of the page

elementScrollBavior 1 -> Elements được cuộn xuống dưới của Trang

Answer 2

Hãy nhớ rằng:

.execute() tiêm một đoạn JavaScript vào trang cho thực hiện trong bối cảnh của khung đang được chọn. Kịch bản lệnh được thực thi được giả định là đồng bộ và kết quả của việc đánh giá kịch bản được trả lại cho máy khách.

và

Window.scrollTo() Scrolls đến một tập hợp các tọa độ trong tài liệu .

thử nghiệm của bạn sẽ trông như thế này:

module.exports = { 
    'your-test': function (browser) { 
     browser 
      .url("http://example.com") 
      .waitForElementPresent('body', 2000, "Be sure that the page is loaded") 
      .execute('scrollTo(x, y)') 
      .yourFirstAssertionHere() 
      .yourSecondAssertionHere() 
      ... 
      .yourLastAssertionHere() 
      .end() 
    } 
}; 

• Nếu bạn biết rằng các phần tử với id myElement là ở phía trên cùng của trang, bạn chỉ có thể thay đổi x và y bởi 0 (chỉ để chắc chắn rằng bạn sẽ cuộn lên đầu trang).

• Nếu bạn cần phải nhận được các giá trị chính xác của x và y, bạn có thể sử dụng: getLocationInView() như thế này:

  module.exports = { 'your-test': function (browser) { browser .url("http://example.com") .waitForElementPresent('body', 2000, "Be sure that the page is loaded") .getLocationInView("#myElement", function(result) { //The x value will be: result.value.x //The y value will be: result.value.y }); } }

  .getLocationInView(): Xác định vị trí của một nguyên tố trên màn hình khi nó đã được cuộn vào chế độ xem ... Trả về tọa độ X và Y cho phần tử trên trang.

Hy vọng điều này sẽ giúp bạn.

Answer 3

Bạn có thể thực hiện javascript này với executedocument.querySelector({{ACTUAL_SELECTOR}}).scrollIntoView();