Ответ
Использую знание HTML для тестирования фронтенд-части веб-приложений.
Основные направления работы:
- Анализ структуры и валидация:
- Проверка семантической корректности разметки.
- Контроль обязательных атрибутов (например,
altдля изображений,labelдля полей формы).<!-- Проверка: У изображения должен быть атрибут alt --> <img src="logo.png" alt="Company Logo">
- Тестирование верстки:
- Проверка адаптивности и кроссбраузерного отображения.
- Сравнение с макетом (PixelPerfect).
- Использование DevTools:
- Локализация элементов через
Inspectorдля создания селекторов в автотестах. - Модификация HTML/CSS "на лету" для проверки граничных случаев (например, длинный текст в заголовке).
- Локализация элементов через
Цель: Обеспечить не только визуальную, но и структурную корректность интерфейса, что важно для доступности (a11y), SEO и стабильности автотестов.
Ответ 18+ 🔞
Да ты послушай, что эти фронтендеры творят! Берут в руки HTML, а там у них, блядь, как в детском конструкторе — детали вроде все на месте, а домик кривой получается, и кошка через стену пролезает. Ну, я как тестировщик, должен этот бардак разгребать.
Вот смотри, первым делом я лезу в их разметку, как в помойку. Структура и валидация — это святое, ёпта! Я проверяю, не забыли ли они, что картинка — это не просто красивая пикча, а элемент, который должен быть описан. А то слепой пользователь зайдет, скринридер начнет читать: "Изображение, имя файла: лого-пи-эн-джи-три-два-один"... Да он обосрётся со смеху! Нет, ты впиши нормальный alt, гад!
<!-- Вот так — правильно, уважительно. А не как у некоторых. -->
<img src="logo.png" alt="Company Logo">
А дальше начинается цирк с версткой. Откроешь сайт на телефоне — а там половина кнопок на соседний экран уехала, нахрен. Или в одном браузере всё красиво, а в другом — пиздец, форточки разъехались, как рты у пьяных после корпоратива. И начинай сравнивать с макетом, пиксель в пиксель. Дизайнер выверял каждый отступ, а разработчик, сука, на глазок прикинул — и пошло-поехало.
Но главный мой инструмент — это, конечно, DevTools. Эх, ебать мои старые костыли, какой же это кайф! Нашел кривой элемент — тык мышкой, и он тебе всю его родословную вывалит: кто родитель, кто сосед, какие стили на него навешаны. Тут же селектор для автотеста сварганил, чтоб эта мартышлюшка-кнопка больше не пряталась.
А самое веселое — начать ковыряться в коде прямо в браузере. Подсунул в заголовок текст длиной в "Войну и мир" — и смотри, как вся верстка, блядь, накрывается медным тазом, расползается как сопливая каша. Или отключил какой-нибудь стиль — и опа, открылась истинная, уродливая сущность интерфейса!
А цель-то у меня какая? Да не просто чтоб красиво было! Чтоб и роботы-поисковики всё поняли, и незрячий человек сайтом воспользовался, и автотесты потом не сломались от того, что какой-то пидор забыл label для поля ввода прикрутить. В общем, чтобы это не было похоже на поделку распиздяя, а было нормальным, рабочим продуктом. А то ведь без нас они там сами знаете что наворотить могут!