Какой у вас опыт работы с HTML в контексте тестирования?

Ответ

Использую знание HTML для тестирования фронтенд-части веб-приложений.

Основные направления работы:

  1. Анализ структуры и валидация:
    • Проверка семантической корректности разметки.
    • Контроль обязательных атрибутов (например, alt для изображений, label для полей формы).
      <!-- Проверка: У изображения должен быть атрибут alt -->
      <img src="logo.png" alt="Company Logo">
  2. Тестирование верстки:
    • Проверка адаптивности и кроссбраузерного отображения.
    • Сравнение с макетом (PixelPerfect).
  3. Использование DevTools:
    • Локализация элементов через Inspector для создания селекторов в автотестах.
    • Модификация HTML/CSS "на лету" для проверки граничных случаев (например, длинный текст в заголовке).

Цель: Обеспечить не только визуальную, но и структурную корректность интерфейса, что важно для доступности (a11y), SEO и стабильности автотестов.

Ответ 18+ 🔞

Да ты послушай, что эти фронтендеры творят! Берут в руки HTML, а там у них, блядь, как в детском конструкторе — детали вроде все на месте, а домик кривой получается, и кошка через стену пролезает. Ну, я как тестировщик, должен этот бардак разгребать.

Вот смотри, первым делом я лезу в их разметку, как в помойку. Структура и валидация — это святое, ёпта! Я проверяю, не забыли ли они, что картинка — это не просто красивая пикча, а элемент, который должен быть описан. А то слепой пользователь зайдет, скринридер начнет читать: "Изображение, имя файла: лого-пи-эн-джи-три-два-один"... Да он обосрётся со смеху! Нет, ты впиши нормальный alt, гад!

<!-- Вот так — правильно, уважительно. А не как у некоторых. -->
<img src="logo.png" alt="Company Logo">

А дальше начинается цирк с версткой. Откроешь сайт на телефоне — а там половина кнопок на соседний экран уехала, нахрен. Или в одном браузере всё красиво, а в другом — пиздец, форточки разъехались, как рты у пьяных после корпоратива. И начинай сравнивать с макетом, пиксель в пиксель. Дизайнер выверял каждый отступ, а разработчик, сука, на глазок прикинул — и пошло-поехало.

Но главный мой инструмент — это, конечно, DevTools. Эх, ебать мои старые костыли, какой же это кайф! Нашел кривой элемент — тык мышкой, и он тебе всю его родословную вывалит: кто родитель, кто сосед, какие стили на него навешаны. Тут же селектор для автотеста сварганил, чтоб эта мартышлюшка-кнопка больше не пряталась.

А самое веселое — начать ковыряться в коде прямо в браузере. Подсунул в заголовок текст длиной в "Войну и мир" — и смотри, как вся верстка, блядь, накрывается медным тазом, расползается как сопливая каша. Или отключил какой-нибудь стиль — и опа, открылась истинная, уродливая сущность интерфейса!

А цель-то у меня какая? Да не просто чтоб красиво было! Чтоб и роботы-поисковики всё поняли, и незрячий человек сайтом воспользовался, и автотесты потом не сломались от того, что какой-то пидор забыл label для поля ввода прикрутить. В общем, чтобы это не было похоже на поделку распиздяя, а было нормальным, рабочим продуктом. А то ведь без нас они там сами знаете что наворотить могут!