Расширение Chromium Browser Automation для Google Chrome

Представляем очередной авторский обзор расширения в рамках нашей акции. Мы уже писали о данной разработке, когда освещали финалистов недавнего хакатона. 

Chromium Browser Automation (CBA) - это мощная система автоматизации, которая создана, чтобы помочь людям справиться с рутинной работой, а также для того, чтобы предоставить множество готовых полезных функций. CBA позволяет справиться с такими задачами как:

  • Прохождения через длинный регистрационный процесс.
  • Нажимание на все кнопки "Мне нравится" на вашей страннице или в группе в фейсбуке.
  • Добавлять друзей в ваш рекламный аккаунт.
  • Вход на сайт и переход на ваш любимый контент.
  • И многое многое другое...
Chromium browser automation

Практически возможности CBA безграничны, вы используйте Javascript код, также можете использовать Jquery для создание наборов кодов которые будут запускаться один за другим и дадут вам контроль над браузером, также CBA предоставляет множество полезных и периодически дополняющихся функции, к примеру как:

  • Функция "FB Likes", которая нажимает на все кнопки "Мне нравится" в фейсбуке в открытой зоне странницы.
  • Функция "FB Unlike", которая нажимает на все кнопки "Больше не нравится" в фейсбуке в открытой зоне странницы.
  • Функция "ADD Friends", которая нажимает на все кнопки "Добавить в друзья" в открытой зоне странницы фейсбука.
  • И множество других полезных и дополняющихся функций...

CBA также предоставляет возможность записи ваших действий, выполняемых в браузере Chrome. Вы нажимаете на кнопку “rec” и начинаете записывать ваши действия, которые записываются в “Local storage” браузера, и вы можете контролировать эти записи и созданные вами действия (Action) путем редактирования в интерфейсе расширения, также изменения поочередности проигрывания путем перетаскивания действий.

Презентация проекта (русские субтитры):

Интерфейс расширения

Интерфейс расширения

Главные части интерфейса это таблицы:

  • Projects
  • Actions
  • Functions

Таблица Проекты (Projects) - содержит в себе действия (Actions). Действия (Actions) представляют из себя набор кодов, которые запускаются один за другим. Вы можете добавить проект (Project), стереть и переименовать, используя кнопки "плюс", "минус" и "rename".

Таблица Действий (Actions) - представляет из себя набор кодов, которые запускаются один за другим. Вы можете добавить действие (Action), стереть, редактировать и сохранить, используя кнопки под текстовым полем (“Add”, “Delete”, “Save”). Пользователь может сортировать поочередность действий (Actions), перетаскивая строки в таблице. Также пользователь может выделять элементы странницы, перетащив курсор мышки на строку действия (Action) в таблице (функция выделения предназначена для: change, click, click-submit и check типов действий).

Таблица Функций (Functions) - таблица содержит в себе набор полезных готовых функций, вам нужно просто переташить функцию в таблицы действий (Actions).

Действия (Actions)

Ниже перечислены типы действий (actions):

  • Inject
  • Change
  • Click
  • Click-submit
  • Redirect
  • Timer
  • Update

Иньекция (inject) - это действие (Action), которое запускает Javascript код в процесс проигрывания проекта (также можно использовать Jquery), оно использует функцию Javascript`a eval(), чтобы запустить код в процесс проигрывание проекта. Вы можете написать Javascript код с функциями и переменными, только учитывайте одну вещь - расширения создают Content Script для каждого iframe`а на страннице.

Инъекция в CBA

Изменить (Change) - использует JQuery селектор, чтобы изменить значение элемента DOM. Пользователи могут использовать placeholder, чтобы генерировать случайные цифры (Максимум 13 символов в длину). На примере картинки использовался тип действия изменить (Change), чтобы найти элемент дома с ID #sometextBox, вызвать событие Focus на элементе, изменить значение на hello и конкатенировать в конце 3 символьной случайной цифрой.

Изменить в CBA

Click - CBA использует действие Click, чтобы вызвать событие Click на элементе DOM-а, которое находит, используя Jquery селектор.

Клик в CBA

Click-submit - похож на действие (Action) Click, он работает также, но с одним отличием: "Action" Click-submit заставляет программу ждать события загрузки странницы, потом только продолжает процесс проигрывание проекта, то есть действие Click-submit может использоваться, например, для нажатия кнопок "Submit".

Redirect - действие redirect меняет странницу на указанный URL и ждет события загрузки странницы, потом только продолжает процесс проигрывания проекта.

Timer - действие Timer используется для остановки проигрывание проекта на время, указанное в миллисекундах, потом продолжается проигрывание проекта.

Update - действие Update используется для того, чтобы остановить проигрывание проекта до загрузки странницы, потом продолжается процесс проигрывания. Программа ждет события onload, а потом продолжает процесс проигрывания.

Запись (record)

Пользователю просто нужно выбрать проект из таблицы "projects" и нажать на кнопку "rec", после чего появится надпись "rec" под иконкой CBA, а это значит, что вы можете начать взаимодействовать со странницей и нажать на кнопку "stop" после завершения записи.

В демо роликах вы сможете увидеть эту возможность CBA в действии:

Кнопка “Play”

После нажатия кнопки "Play" действия начинают проигрываться один за другим, вы можете наблюдать за процессом проигрывания в таблице действий, также надпись "Play" под иконкой программы будет означать, что программа находится в стадии проигрывания, в случае если она застрянет где-то, советую нажать на кнопку “Stop”, чтобы отключить проигрывание и разобраться в ваших действиях в таблице actions.

Пользователь также может указать сколько раз он хочет проиграть проект.

Кнопка “Stop”

Кнопка "Stop" останавливает запись и проигрывание проекта.

Import and export

Хотел бы заметить, что после перезагрузки браузера или перезагрузки компьютера, все ваши записи и данные CBA не потеряются, так как все данные хранятся в local storage браузера, но что если пользователю надо будет переустановить браузер или форматировать жесткий диск, может  ему захочется записать проект и разослать его своим друзьям или же может пользователю нужно создать автоматизацию для работников компании, где он работает. Для таких случаев в расширении установлена возможность для импортирования и экспортирования проектов.

Нажмите правой кнопкой мыши на иконку расширения и выберите "Options", вы увидите страницу настроек, открытую в новой вкладке, нажмите на кнопку "export", и CBA сгенерирует String в формате JSON, который вы сможете сохранить на внешнем устройстве и импортировать после форматирования компьютера. Проекты будут снова доступны, также вы можете послать JSON String работникам компании, чтобы они смогли импортировать проект и запустить.

Дальнейшее развитие расширения

В будущем я собираюсь добавить такие возможности как:

  • Функцию очистки cookie браузера.
  • Функцию для захвата вкладки.
  • Функцию сохранения странницы в формате MHTML.
  • Предоставить коллекцию готовых записей в формате JSON.
  • Также премиум поддержку для людей, которым будет нужна автоматизация или для их компании.

Установить Chromium Browser Automation

Автор:

Манвел Сароян

saroyanm@gmail.com