Как тестировать верстку на кроссбраузерность?

Question

[Петр Сергеев]

Да, постов на эту тему действительно не мало, но все они отличаются друг от друга.
Кто-то говорит, что Ege этот тот же IE11, хотя после просмотра на caniuse понимаешь, что не так уже они и похожи..
Кто-то говорит, что safari для Mac OS можно установить на windiws, но оказывается, что на самом деле актуальных версий safari уже нельзя найти на windows..

Так как проверить верстку на кроссбраузерность в 2019, если под рукой старенький ноутбук на windows7?
Неужели чтобы проверить как отображается верстка на iPhone или Mac OS, обязательно нужно купить iPhone и Mac OS или бывают какие-то альтернативы?
Как проверить верстку на отдельно взятом браузере?

Comments

[Rustam Bainazarov]

Купить Macbook. Поставить виртуальную ОС.

Либо же пользоваться чем-то типа Browserstack (платно).

EDGE 12+ сильно в лучшую сторону отличается от IE11. Safari на Windows нет, к сожалению. Более того, мобильный Safari несколько отличается от своей десктопной версии.

[Петр Сергеев]

Рустам Байназаров, спасибо, значит Browserstack как временное решение это выход.

[Сергей delphinpro]

IE11 даже в десятке есть в комплекте. Что мешает в нем проверять?
Режимы совместимости с IE8-IE10 в нем тоже сносно работают (если вдруг актуально).

А вот яблоко лучше купить.

[Виталий Першин]

Часто мне задавали этот вопрос поэтому написал статью https://get-web.site/blog/104-testiruem-verstku-v-... а от скринов с онлайн сервисов толку мало

Answer 1

[Владислав Лысков]

https://www.browserstack.com/

Comments

[Петр Сергеев]

спасибо, значит browserstack актуален

Answer 2

[WebDev]

Не надо покупать iphone, купите доступ к browserstack. А для начала попробуйте триальную версию.

Comments

[Петр Сергеев]

спасибо, попробую browserstack

[Сергей delphinpro]

триал отстойный. замучаешься ждать. попробовать полноценно не получается => нет мотивации покупать подписку =))

Answer 3

[profesor08]

https://accounts.lambdatest.com/
Триала хватает, а если закончился, то кто мешает зарегать несколько аккаунтов и переключаться между ними.

Comments

[Петр Сергеев]

Спасибо, и вправду все работает, даже как-то странно, если честно. В чем подвох?

[Anton]

Петр Сергеев, какой подвох? Что должно не работать?

[Anton]

Имо, lambdatest.com это лучшее что существует, причем есть удобные тестилки по скриншотам, выбрал сразу несколько вариантов, пришло уведомление на почту после завершения.

Причем даже free достаточно работоспособна

Answer 4

[ⓒⓢⓢ]

купите самый дешевый iphone 4-7к деревянных у китайцев, 99% багов отлавливаются в мобильном сафари - это более чем достаточно для уверенной работы. Плюс обзаведётесь экраном с ретиной, что облегчит тестирование некоторых кейсов.

Comments

[WebDev]

А как вы будете ошибки в консоле смотреть через айфон без мака?

[ⓒⓢⓢ]

WebDev, ошибки верстки в консоли? ...
Если посыл в скрипты, то есть разные "прослойки" от фронт части, которые прекрасно перекрывают весь экран ошибками ... нынче без сборщиков проектов писать скрипты, себе дороже ...

[Сергей delphinpro]

Дешевых андроидов с ретиной на рынке валом =) Это не аргумент.
За 4..7 килорублей что получишь? Там будет последние версии софта? Я не знаю, потому спрашиваю.

[ⓒⓢⓢ]

Сергей delphinpro, 5s, ios 12.1.4, коробочный - 5к на алике покупался с пол года назад, ещё живой :)

[Anton]

Кто данное отметил решением... ну бред же... Для проверки верстки может и подойдет... но не для отладки. Сейчас нет чистой верстки, всегда есть примесь js и поэтому необходимо именно возможность отлаживать. Если нет мака то лучший вариант это конечно же lambdatest.com

Answer 5

[Сергей Нижний Новгород]

Достаточно легко:

1) Разрабатываем на своей машине, проверяем во всех браузерах, что туда можно поставить.
2) Проверяем верстку в минималистике в браузерах, проверяем верстку с мобильного телефона.
3) Если какого-то девайса нет, то проверяем на browserstack.
4) Финальный вариант идет в отдел тестирования, который обеспечивает (покрытие на всех актуальных девайсах)
5) Прописывается и утверждается на уровне продакт/тех-дира, список браузеров, устройств и версий, которые мы поддерживаем.
6) В пользовательском соглашении указываем список браузеров, устройств, которые мы гарантировано поддерживаем.

Т.е. у нас железно есть некий процент юзеров, которые жалуются, что у них в каких-то браузерах, версиях, и древних виндоусах что-то неправильно отображается. Но ввиду пунктов 5 и 6 - они вежливо посылаются в сторону актуальных девайсов, браузеров. Ибо бизнес принял решение, что их процент слишком мал, чтобы на это тратить время и ресурсы.

Comments

[Петр Сергеев]

Спасибо.
А что думаете по поводу https://accounts.lambdatest.com/ , который скинули выше.
browserstack как я понимаю платный, а этот аналог поддерживает тот же safari 12 и причем поставляется бесплатно. Пользовались ли вы им и что можете сказать?

Answer 6

[bro-dev]

ие есть в винде сафари у меня стоит мак в виртуалке, а айфоны смотрю тут
https://appetize.io/demo?device=iphone4s&scale=75&...

Answer 7

[EkS2019]

2 месяца тестирую на browserstack. Хочу сказать, что эмуляция на этом сервисе часто не соответствует реальности. Например открываешь эмулятор Safari на High Sierra - там показывает, что кнопки разъезжаются. Открываешь на реальном маке в такой же версии ОС и такой же Версии Safari и в таком же разрешении - все прекрасно.