testplane icon indicating copy to clipboard operation
testplane copied to clipboard

Vertical scroll in mobile view is marked

Open IrinaDydy opened this issue 2 years ago • 5 comments

Добрый день!

Скриншотилка реагирует на незначительные отклонения положения вертикального скролла

image

Подскажите, можно ли как-то скрыть (не учитывать при сравнении) полосу вертикального скролла в случае удалённого запуска тестов через ggr?

IrinaDydy avatar Mar 14 '22 10:03 IrinaDydy

Привет. Похоже что-то на страницу добавляется и скролл реагирует небольшим смещением ниже.

В твоем случае возможно достаточно просто переснять скриншот.

Какие есть варианты решения:

  • не снимать всю страницу, а только необходимый блок или связку блоков
  • выставить опцию screenshotDelay в 600. За 600мс обычно скролл бар успевает скрыться
  • отключить скролл с помощью плагина - https://github.com/gemini-testing/hermione-hide-scrollbars (работает только в хромах с поддержкой CDP)
  • перед снятием скриншота наложить на страницу невидимый элемент со смещением справа на необходимое количество пикселей, т.е. чтобы скроллбар не попадал на страницу.

DudaGod avatar Mar 14 '22 10:03 DudaGod

Добрый день!

Было замечено, при попытке скрытия скролл бара через css: var styleElement = document.createElement('style'); styleElement.id = 'remove-scroll-style'; styleElement.textContent = 'html{overflow:auto}' + 'body::-webkit-scrollbar{display:none !important;}' + 'body{overflow-y: scroll;overflow-x: hidden;}'; document.body.appendChild(styleElement);

В частности, при добавлении html{overflow:auto} и с настройками compositeImage: true и assertViewOpts: { allowViewportOverflow: true }:

Тест выдаёт ошибку при снятии скриншота: Error: Out of the bounds at PngImg.crop (C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules\png-img\index.js:71:19) at Image.crop (C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules\gemini-core\lib\image\index.js:23:19) at Camera._cropToViewport (C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules\gemini-core\lib\browser\camera\index.js:54:22) at C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules\gemini-core\lib\browser\camera\index.js:25:35 at runMicrotasks () at processTicksAndRejections (internal/process/task_queues.js:95:5) at async Browser. (C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules\hermione\lib\browser\commands\assert-view\index.js:56:29) at async Browser.wrapCommandFn (C:\Repos\ForHermione\Autotests\KL.CIWD.Autotests.Hermione\node_modules@wdio\utils\build\shim.js:137:29)

IrinaDydy avatar May 19 '22 08:05 IrinaDydy

Привет.

Похоже падает при попытке кропнуть изображение. Можешь прислать пример теста на котором такая проблема воспроизводится?

DudaGod avatar May 19 '22 11:05 DudaGod

Тест предельно простой, берём xpath для элемента на странице и делаем this.browser.assertView(${path}, elementXpath), просто что элемент, за частую, не помещается в высоту на страницу (как например лайаут), а снять скрин элемента требуется полностью, по этому использую compositeImage: true и assertViewOpts: { allowViewportOverflow: true }:

IrinaDydy avatar May 19 '22 11:05 IrinaDydy

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

DudaGod avatar May 19 '22 14:05 DudaGod

Закрываю, так как пример кода теста так и не был предоставлен.

DudaGod avatar Oct 10 '23 15:10 DudaGod