Поиск элементов в BAS: селекторы, которые не ломаются
Как работает поиск элементов в Browser Automation Studio - CSS против XPath, почему записанные селекторы ломаются и как писать селекторы, переживающие изменения страницы.
Все статьи гида Browser Automation Studio · 48
Каждое действие BAS, которое касается страницы - клик, ввод, извлечение - сначала должно найти элемент. Сделаете селектор правильно - бот работает месяцами; ошибётесь - он сломается при следующем редизайне сайта. Это важнейший навык надёжной браузерной автоматизации.
Как работает поиск элементов в BAS
Когда вы записываете действие, BAS фиксирует селектор, указывающий на элемент, с которым вы взаимодействовали. При повторе он запрашивает живой DOM этим селектором и действует на совпадение. Запись удобна, но часто выбирает хрупкие селекторы - длинные цепочки автогенерируемых классов или позиции nth-child, которые легко меняются.
Решение - относиться к записанному селектору как к черновику и дорабатывать его руками.
CSS-селекторы: ваш выбор по умолчанию
CSS-селекторы покрывают подавляющее большинство случаев и работают быстрее всего. Приоритет того, на что опираться:
id-#login-button. Уникален и стабилен, когда есть.name-input[name="email"]. Часто встречается и надёжен на формах.- Атрибуты
data-*-[data-testid="submit"]. Разработчики часто добавляют их специально как стабильные зацепки. - Семантические комбинации класса/атрибута -
button.primary[type="submit"].
Избегайте привязки к классам вроде css-1a2b3c - их генерируют сборщики, и они меняются с каждым релизом.
XPath: когда CSS не хватает
XPath мощнее, но медленнее и многословнее. Используйте его для двух вещей, которые CSS не умеет:
- Поиск по видимому тексту:
//button[contains(text(),"Войти")]- незаменимо, когда у кнопок нет стабильных атрибутов. - Движение относительно другого элемента: найти подпись (label), затем её соседний input.
Если цель выражается через CSS - предпочитайте CSS. Переходите на XPath только ради поиска по тексту и реляционных запросов.
Селекторы, которые переживают изменения
- Привязывайтесь к смыслу, а не к вёрстке.
[name="password"]описывает, что это за поле;div:nth-child(3) > input- где оно случайно стоит сегодня. - Делайте короче. Каждый лишний шаг в цепочке - ещё одна точка, которая может измениться.
- Один сильный атрибут лучше длинного хрупкого пути.
- Проверяйте после перезагрузки. Перезапустите после жёсткого обновления; хороший селектор совпадает каждый раз.
Дело не только в выборе - ещё и в таймингах
Правильный селектор всё равно упадёт, если элемент ещё не отрисовался. Страницы грузятся асинхронно, поэтому сочетайте выбор с шагом ожидания элемента перед действием. Большинство ошибок «селектор не найден» - это на самом деле ошибки таймингов: элемента просто ещё не было.
Когда селекторы и ожидания на месте, следующий браузерный навык - заполнение и отправка форм, ему посвящена соседняя статья.
Вопросы и ответы
Что использовать в BAS - CSS или XPath селекторы?
В большинстве случаев CSS-селекторы: они короче и быстрее. XPath берите, только когда нужно искать по видимому тексту или двигаться относительно другого элемента - этого CSS не умеет.
Почему бот в BAS перестаёт находить элемент?
Обычно селектор опирался на автогенерируемый класс или абсолютную позицию, которые изменились при следующем деплое сайта. Привязывайте селектор к стабильным атрибутам: id, name, data-*.
Ещё по теме
- Browser Automation Studio: полный практический гидГид
- Создаём первого бота в Browser Automation StudioПошаговый разбор создания первого рабочего бота в BAS - от пустого проекта до процесса, который ходит по страницам, извлекает данные и работает в несколько потоков.
- Настройка прокси в Browser Automation StudioКак правильно настроить прокси в BAS - типы прокси, привязка по потокам, ротация и проверки, которые не дают мультиаккаунт-ботам попасть под бан.
- Заполнение и отправка форм в BASКак надёжно заполнять, выбирать, отмечать и отправлять веб-формы в Browser Automation Studio - человекоподобный ввод, выпадающие списки и чекбоксы, проверка результата.
Видео по теме
Сделаю под ключ
Не хотите собирать сами? Соберу бота на BAS под вашу задачу
Многопоточность, прокси, антидетект-профили и запуск по расписанию. Весь проект и доступы остаются у вас.
от 300 $ · 3-7 дней
«Павел крутой специалист выполнил парсер за несколько часов. Буду заказывать у Павла еще и еще! Спасибо ему огромное за его профессионализм и оперативность!»