Как мне подтвердить видимость элемента на веб-странице?

Question

Я делаю описания функций для веб-службы с Watir.Мне нужно проверить поведение службы в различных условиях браузера - в частности, я хочу подтвердить видимость элемента (простая ссылка) при определенных условиях браузера:

@orcid_link = @browser.link(class: 'orcid', text: /orcid/i)
   assert @orcid_link.visible?

Кажется, это не работает - я изменяю размер окна, и Ватир думает, что элемент видим (когда на самом деле это present)

Как вы утверждаете видимость элементов на странице с Watir?

Answer 1

Нет встроенных методов для проверки, находится ли элемент в данный момент в порту просмотра.Тем не менее, вы можете сделать приближение, запустив JavaScript.

Полностью видимый порт

Простой пример проверки видимости можно взять из Флоран Б. вдругой вопрос .Обратите внимание, что есть несколько пещер, которые эта функция не учитывает.Этот сценарий также определяет «в порту просмотра» как полностью в порту просмотра.

Этот сценарий может быть выполнен с использованием Watir:

script = %q{
  var rect = arguments[0].getBoundingClientRect(); 
  return (
    rect.top >= 0 && 
    rect.left >= 0 && 
    rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && 
    rect.right <= (window.innerWidth || document.documentElement.clientWidth) );  
}
browser.execute_script(script, @orcid_link)

Частично в порту просмотра

Вы также можете проверить, находится ли элемент частично в окне просмотра - например, часть большой таблицы.Следующий скрипт, модифицированный из другого ответа Флорента Б. , проверяет, находится ли какой-либо угол элемента в порту просмотра:

script = %q{
  var elem = arguments[0]
  var box = elem.getBoundingClientRect();
  corners = [
    document.elementFromPoint(box.left, box.top),
    document.elementFromPoint(box.right - 1, box.top),
    document.elementFromPoint(box.left, box.bottom - 1),
    document.elementFromPoint(box.right - 1, box.bottom - 1)
  ];
  results = corners.map( function(c) {
    for (; c; c = c.parentElement) { if (c === elem) return true; }
    return false;
  })
  return results.includes(true);
}
browser.execute_script(script, @orcid_link)

Если это решит вашу проблему, мывозможно, его можно будет добавить в Watir.