Веб-разработка → Регрессионное тестирование вёрстки. Идея автоматизации
Когда мы верстаем новые фичи, либо фиксим баги в небольшом проекте, нет проблем проверить, не поломали ли мы что-то работающее. Для этого достаточно просто его прокликать. Но так бывает не всегда: наш текущий проект насчитывает около 200 уникальных страниц и мы столкнулись с проблемой автоматизации регрессионного тестирования вёрстки. И если у программистов всё всем давно известно, методы тривиальны, да и ПО соответствующее написано, то нам, front end разработчикам, приходится ломать голову. Но мысли некоторые есть.
В контексте этого документа, я буду условно разделять все ошибки вёрстки на ошибки раскладки (связаные с позицией блока в документе) и оформления (как то цвет текста, фона и др.) Далее мы будем рассматривать ошибки раскладки.
При вёрстке мы используем подход вроде Object Oriented CSS. Таким образом, наша страница состоит из блоков, блоки могут быть как простые, не содержащие других блоков, так и составные, имеющие внутри себя простые блоки. Мы сделали свой код максимально некаскадным (за исключением некоторых наследуемых значений, вроде цвета ссылки, текста и шрифта), и, казалось бы, если мы аккуратно делаем девтест того самого блока, который подвергается изменениям, сломаться ничего не должно. Как бы ни так! Потому что:
В контексте этого документа, я буду условно разделять все ошибки вёрстки на ошибки раскладки (связаные с позицией блока в документе) и оформления (как то цвет текста, фона и др.) Далее мы будем рассматривать ошибки раскладки.
Из-за чего весь сыр-бор
При вёрстке мы используем подход вроде Object Oriented CSS. Таким образом, наша страница состоит из блоков, блоки могут быть как простые, не содержащие других блоков, так и составные, имеющие внутри себя простые блоки. Мы сделали свой код максимально некаскадным (за исключением некоторых наследуемых значений, вроде цвета ссылки, текста и шрифта), и, казалось бы, если мы аккуратно делаем девтест того самого блока, который подвергается изменениям, сломаться ничего не должно. Как бы ни так! Потому что:
Веб-стандарты → Browsera — новый инструмент тестирования сайта
Browsera — сразу определимся что это не ещё один сервис бесплатных скриншотов. Этот сервис позволяет проводить атоматизированнное тестирование кросс-браузерности вашей вёрстки, то есть читается ваш html код, стили, скрипты — и моделируется их отрисовка в соответствии с особенностями того или иного браузера. Впрочем, сервис также генерирует скриншот для каждого браузера: будет что отослать верстальщику.
Персональные блоги → Тестирование в разных версиях IE
До сих пор сталкиваюсь с вопросами людей, как протестировать сайт в IE разных версий.И как чтобы этот процесс был быстрым и удобным.
Как ни странно, Microsoft подумала про это. Идем по ссылке и качаем сначала последнюю версию Virtual PC а затем необходимые образы с версиями IE.
Ставим Virtual PC, распаковываем образы, подключаем (только под 8-й ie отведите не меньше 256 памяти) и вуа ля.
Простой и удобный способ готов к применению.
А главное вы видете реальный результат работы нужного вам браузера в окружении «чистой» ОС