прокрутка виртуального списка с помощью транспортира

Question

Я знаю, что эта библиотека появится в Angular 6, но мне нужно реализовать ее в тестах Protractor, тестирующих приложение Angular 5.

В виртуальном списке одновременно отображается 10 элементов. Чем больше мы прокручиваем вниз, тем внизу списка заполняются новые элементы (по 2-3), а верхняя часть списка заполняется. Элемент, который мы ищем, может быть ex: пункт 20 в списке, если мы не найдем его в текущем представлении, мне нужно прокрутить тест вниз, пока он не будет найден.

Задача сейчас заключается в следующем: когда элемент найден, строки 4 и 5 работают хорошо и прокручивают до элемента списка. Когда он не найден, строка 4 завершается сбоем, потому что listItemWeWant.isDisplayed () имеет значение false и не продолжается. Возможно, здесь есть лучшая проверка, может быть, она может быть проверена, есть ли что-то в элементе поиска массива элементов, или можно использовать count (). Ни один из которых я не мог получить на работу.

Если мы сможем решить эту проблему, то у нас будут тесты виртуальной прокрутки до выхода Angular 6.

waitUntilScrolledToSelectorInAVirtualList(listItemWeWant) {
    getToVirtualListItem();
    function getToVirtualListItem() {
      listItemWeWant.isDisplayed().then( (result) => { // failing this, else condition never takes effect
        if (result === true) { // if condition works fine if the item is in the the 10-item list
          waitUntilScrolledToSelectorWithMouseMove(listItemWeWant);
        } else { // it never falls into this else statement
          goToTheEndOfTheViewableList();
          waitUntilScrolledToSelectorWithMouseMove(listItemWeWant);
          console.log('went to the end of the list');
        }
      }).catch( (e) => {
        console.log(e);
      });
    }
    async function goToTheEndOfTheViewableList() { // this function never runs. What it does is, click on the virtual list and hold down arrow button.... Maybe there is a better way to do this
      await element(by.tagName('virtual-scroll')).click();
      await browser.driver.actions().keyDown(protractor.Key.ARROW_DOWN);
      await browser.sleep(5000); 
      await browser.driver.actions().keyUp(protractor.Key.ARROW_DOWN);
    }
    function waitUntilScrolledToSelectorWithMouseMove (elementSelector: ElementFinder): Promise <{}> {
      return new Promise((resolve, reject) => {
        browser.driver.wait(() => {
          return browser.driver.actions().mouseMove(elementSelector).perform(); // here is the key line, the rest is a custom promise wrapper
        }, 20000).then( () => {
          resolve(); // resolve the promise d
        }).catch( (e) => {
          console.log('promise not successful: error out');
          reject();
        });
      });
    }
  }

Answer 1

Я понял это. Вот код для выбора элемента списка в виртуальном списке многих элементов.

  waitUntilScrolledToSelectorInAVirtualList(listItemWeWantAll: ElementArrayFinder) {
    let recursionCounter = 0;
    const recursionLimit = 1000;
    const focusOnVirtualScrollList = element(by.tagName('virtual-scroll'));
    getToVirtualListItem();
    function getToVirtualListItem() {
      listItemWeWantAll.count().then((result) => {   // get the count of the item, flatten with then...
        if (result >= 1) { // if an element is found
          waitUntilScrolledToSelectorWithMouseMove(listItemWeWantAll.first()); // scroll to the item we want in the list
        } else {
          focusOnVirtualScrollList.click().then(() => {
            browser.driver.actions().sendKeys(protractor.Key.ARROW_DOWN).perform().then(() => {
              recursionCounter++;
              if (recursionCounter > recursionLimit) {
                try {
                  throw new Error('the item does not exist in this list');
                } catch (e) {
                  console.log(e);
                }
              }
              getToVirtualListItem(); // recursive function!
            });
          });
        }
      }).catch((e) => {
        console.log(e);
      });
    }
    function waitUntilScrolledToSelectorWithMouseMove (elementSelector: ElementFinder): Promise <{}> {
      return new Promise((resolve, reject) => {
        browser.driver.wait(() => {
          return browser.driver.actions().mouseMove(elementSelector).perform();
        }, 20000).then( () => {
          resolve(); // resolve the promise d
        }).catch( (e) => {
          console.log('waitUntilScrolledToSelectorWithMouseMove promise not successful: error out');
          reject();
        });
      });
    }
  }

Answer 2

Для динамической страницы это симулирует pagedown

this.scrollTillEnd = function () {
this.woningCount.getText().then(function(woningCount) {
woningCount = woningCount.match(/[0-9]+/g);
var scrollCount = woningCount[0]/15; // each scroll displays 15 items. This is to scroll down till all wonings are displayed
for(i=0; i < scrollCount + 1 ; i++){
        browser.executeScript('window.scrollTo(0,document.body.scrollHeight)').then(function(){
browser.sleep(2000);
});
            }
    }); 
    };