Используя машинописный транспортир, как мне обнаружить этот квадратный белый квадрат элемента, затем щелкнуть и перетащить белый квадрат, он имеет ng-mousedown и преобразовать

Мне нужна помощь в создании кода транспортира машинописного текста / javascript для этого? для веб-автоматизации.

Как мне щелкнуть по этому белому ящику и перетащить его слева направо?

Перетаскивание слева направо также изменит значение с transform="translate(205)" на transform="translate(206)", а также <text>2/20/18</text>.

Код веб-сайта:

<g id="IndicateNav" ng-attr-trnsform="translate({{trVM._indicate || 0}})" ng-mousedown="trVM.mousedown($event, 'indicator')" ng-show="trVM._indicate" class="move-horizonal show-label-on-hover" transform="translate(205)">
   <line x1="0" x2="0" ng-attr-y1="{{trVM.bTop}}" ng-attr-y2="{{trVM.height}}" stroke="black" stroke-width="2" y1="20" y2="45"></line>
        <g ng-attr-trnsform="translate(0,{{trVM.bTop + ( (trVM.height - trVM.bTop) / 2) }})" transform="translate(0,32.5)">
            <square sx="0" sy="0" r="6" fill="white" stroke="black" stroke-width="2" ng-non-bindable=""></square>
        </g>
            <text x="14" ng-attr-y="{{3 + trVM.bTop + ( (trVM.height-trVM.bTop) / 2 )}}" text-anchor="start" font-size="12px" fill="white" style="pointer-events:none;" y="35.5">2/20/18</text>
</g>

person SeanRay    schedule 29.12.2018    source источник


Ответы (1)


Вы можете воспользоваться функциями, предоставляемыми browser.actions().

Решение:

  1. Добавьте идентификатор в тег square [Допустим, идентификатор - whiteBox].
  2. Получите элемент whiteBox и сохраните его в переменной.

    const whiteBox = element(by.css('#whiteBox'));
    
  3. Смоделируйте поведение пользователя при перетаскивании с помощью следующего кода:

    browser.actions().mouseDown(whiteBox).mouseMove({x: 50, y: 0}).mouseUp().perform()  
    

    Это переместит перетаскивание whiteBox на 50 пикселей вправо.

  4. Если вы хотите перетащить whiteBox на другой элемент, вы тоже можете это сделать:

    browser.actions().mouseDown(whiteBox).mouseMove(element2).mouseUp().perform()  
    

Полный тестовый код:

describe('whiteBox Dragging Test', function() {
  it('Drag whiteBox to right', function () {
    const EC = protractor.ExpectedConditions;
    const whiteBox = element(by.css('#whiteBox'));
    browser.wait(EC.presenceOf(whiteBox), 5000).then(() => {
      browser.actions().mouseDown(whiteBox).mouseMove({x: 50, y: 0}).mouseUp().perform();
    });
  });
});
person Saddam Pojee    schedule 29.12.2018
comment
Небольшое примечание: API действий изменился / скоро будет изменен. Это утверждение основано на том, реализовала ли библиотека или драйвер браузера стандарт действий W3C. Protractor в настоящее время использует selenium-webdriver 3 (стандарт до W3C), и некоторые драйверы браузера, такие как gecko, могут не работать (со стандартом W3C) - person cnishina; 29.12.2018
comment
@Saddam не работает, у него есть ошибка: Ошибка: время ожидания истекло через 10069 мс - person SeanRay; 02.01.2019
comment
@SeanRay Код, в котором вы упомянули тайм-аут в 10 секунд (т. Е. 10000 мс), завершился неудачно. Вот почему он показывает эту ошибку. Кроме того, аналогичная ошибка может быть вызвана моим кодом, который скажет "Failed:Wait timed out after 5000ms", если элемент whiteBox отсутствует в браузере в течение 5 секунд. - person Saddam Pojee; 02.01.2019
comment
@SeanRay, Вы имеете в виду, что хотите изменить какое-то значение текстового поля ввода? - person Saddam Pojee; 02.01.2019
comment
@SaddamPojee Я уже понял, как переместить квадрат, но мне также нужно изменить значение в тексте. ['code'] browser.wait (EC.presenceOf (whiteBox), 5000) .then (() = ›{whiteBox.getAttribute ('transform'). then (() =› {browser.driver.executeScript (document. getElementById ('IndicateNav'). setAttribute ('transform', 'translate (600)'));}); ['код'] - person SeanRay; 02.01.2019
comment
текст 20.02.18 в этой части кода: ‹text x = 14 ng-attr-y = {{3 + trVM.bTop + ((trVM.height-trVM.bTop) / 2)}} text- привязка = начало font-size = 12px fill = white style = pointer-events: none; y = 35,5 ›20.02.18 ‹/text› - person SeanRay; 02.01.2019
comment
@SeanRay Но, как вы упомянули в вопросе, это перетаскивание слева направо также изменит значение преобразования. Тогда приведенный выше пример фрагмента кода browser.actions() должен решить вашу проблему. - person Saddam Pojee; 02.01.2019
comment
да, я пробовал код скольжения, который вы предоставили, но он просто не сработает, я тоже хотел бы иметь это, но я бы просто хотел использовать это в качестве альтернативы, я думаю, пока я не выясню, как сдвинуть это - person SeanRay; 02.01.2019
comment
@SeanRay Вы пробовали снова явно найти элемент в browser.actions(), например browser.actions().mouseDown(element(by.css('#whiteBox'))).mouseMove({x: 50, y: 0}).mouseUp().perform(); - person Saddam Pojee; 02.01.2019
comment
Позвольте нам продолжить это обсуждение в чате. - person Saddam Pojee; 02.01.2019
comment
все еще нет, предлагаемое решение требует изменений в исходном веб-коде, все еще ищем другие способы, если исходный веб-код не был изменен - person SeanRay; 08.01.2019
comment
@SeanRay, но в чате я показал еще 1 подход, если вы не можете изменить исходный веб-код. - person Saddam Pojee; 09.01.2019
comment
он работает, но необходимо изменить исходный код веб-сайта - person SeanRay; 24.01.2019