Ответ
Для эффективного тестирования веб-приложений необходимы практические знания HTML, позволяющие:
- Анализировать структуру DOM для понимания иерархии элементов.
- Находить элементы с помощью селекторов (
id,class,name,XPath,CSS). - Проверять атрибуты и свойства элементов (
required,disabled,value). - Валидировать вёрстку и базовую семантику.
Почему это важно? Эти навыки критичны для составления корректных локаторов в автотестах, анализа причин дефектов и ручной проверки фронтенд-логики.
Примеры использования в тестировании:
-
Проверка наличия элемента:
<!-- Тестировщик проверяет, что кнопка отправки формы существует и активна --> <button id="submit-btn" class="btn-primary" type="submit">Submit</button> -
Создание тестовой страницы для воспроизведения бага:
<!DOCTYPE html> <html> <body> <form id="test-form"> <input type="email" id="email" required placeholder="Enter email"> <input type="password" id="pwd" minlength="8"> <button type="submit">Login</button> </form> </body> </html>
Ответ 18+ 🔞
Вот, слушай, как оно на самом деле. Ну, то есть, ты ж понимаешь, что без этого — нихуя не выйдет. Совсем. Прям пиздец.
Чтобы не быть, прости господи, мартышкой с трещоткой, которая просто кликает куда ей сказали, а реально понимать, что ты делаешь и почему тест сдох — надо в этой вашей HTML-ебле хоть немного разбираться. Не на уровне академика, конечно, но чтобы мозги не вытекали, когда видишь тег.
Что конкретно надо уметь, чтобы не выглядеть полным пидарасом шерстяным:
- Читать эту ёбаную DOM-структуру. Ну, то есть смотреть на вёрстку и понимать, кто в кого вложен, кто чей ребёнок, а кто просто сосед через забор. Иначе как ты найдешь нужную кнопку, если она спрятана в пяти вложенных
div'ах, блядь? - Находить элементы, как потерянные носки. Только носки не находятся, а элементы — должны. По
id, поclass, поname, по этим вашим XPath и CSS-селекторам. Это основа для любого локатора в автотесте. Не умеешь — пишешь кривой локатор, тест флапает, все орут, а виноват ты, потому что не отличилbtn-primaryотbtn_primary. - Проверять, что у элемента внутри. Не просто "есть кнопка", а "есть кнопка, и она
disabled, и у неёvalue="Отправить"". Атрибуты, свойства — вот эта вся хуйня. Это часто и есть причина бага: поле неrequired, хотя должно быть, или кнопка не блокируется после клика. - Хотя бы на базовом уровне понимать, что вёрстка не разъебана. Ну, чтобы семантика более-менее соблюдалась, заголовки были заголовками, а не просто жирным текстом. Иногда проблема не в логике, а в том, что фронтендер-распиздяй накодил такое, что даже браузер плачет.
А зачем это всё, спросишь? Да затем, ёпта! Чтобы, когда тест падает, ты не просто в лог смотрел с умным видом, а мог залезть в "Инструменты разработчика", ткнуть пальцем в экран и сказать: "Вот, смотри, сука! Элемент #modal-overlay перекрывает кнопку, потому что z-index: 9999, а у кнопки z-index: 1. Вот почему клик не проходит!". Или чтобы самому сварганить простую страничку и воспроизвести баг, не бегая за разработчиком.
Ну, типа, примеры из жизни, чтобы не было абстрактно:
-
Ищешь кнопку, чтобы её пощупать в тесте.
<!-- Вот она, красавица. Локатор можешь писать по id, по классу, по тексту... Главное — найди, блядь. --> <button id="submit-btn" class="btn-primary" type="submit">Submit</button> -
Тебе настучали по башке за баг, а ты хочешь его по-быстрому воспроизвести и понять, твоя ли это вина.
<!DOCTYPE html> <html> <body> <!-- Делаешь такую же форму, как на проде, и начинаешь её ебашить. --> <form id="test-form"> <input type="email" id="email" required placeholder="Enter email"> <input type="password" id="pwd" minlength="8"> <button type="submit">Login</button> </form> </body> </html>Создал файлик, открыл в браузере — и вперёд, экспериментировать. Поле
requiredне даёт отправить пустое? Аminlengthработает? Вот и вся магия, блядь. Без этого — ты просто обезьяна с джойстиком.