Arhn - архитектура программирования

Как визуализировать журнал сообщений протокола Chrome DevTool?

Я использую драйвер Selenium и Chrome, а также включил ведение журнала производительности, чтобы обеспечить лучшую видимость проблем во время теста. Журнал производительности, по-видимому, представляет собой массив json, который включает сообщения протокола Chrome DevTool. Существует ли какой-либо инструмент, который позволяет мне визуализировать этот журнал, как на вкладке инструментов разработчика Chrome.

Ниже пример записи из журнала:

{
"message": {
  "method": "Network.requestWillBeSent",
  "params": {
    "documentURL": "https://******/",
    "frameId": "15976.2",
    "initiator": {
      "type": "other"
    },
    "loaderId": "15976.3",
    "request": {
      "headers": {
        "Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8",
        "Upgrade-Insecure-Requests": "1",
        "User-Agent": "Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.109 Safari/537.36"
      },
      "initialPriority": "VeryHigh",
      "method": "GET",
      "mixedContentType": "none",
      "url": "https://********/"
    },
    "requestId": "15976.1",
    "timestamp": 80251.314924,
    "type": "Document",
    "wallTime": 1455928917.89989
  }
},
"webview": "D0C1AD9A-D631-4238-9A74-F873A7908EFB"
}
google-chrome google-chrome-devtools selenium selenium-chromedriver
20.02.2016

  • В зависимости от того, сколько усилий вы хотите приложить, вы можете использовать стек ELK... передать JSON в Logstash (elastic.co/guide/en/logstash/current/input-plugins.html), выведите его в Elasticsearch и используйте Kibana (elastic.co/products/kibana), чтобы визуализировать и запросить его. 20.02.2016
  • Я прыгал, мне не нужно было делать тяжелую работу по определению того, как это визуализировать. Тем более, что хром это уже сделал. Только если бы я мог просто импортировать его в хром. Я копирую этот журнал и кучу других журналов и скриншотов в папку на dfs за прогон, чтобы мои разработчики могли видеть результаты своих тестов. Было бы здорово, если бы они могли просто импортировать его в инструмент и получить визуальные эффекты. 22.02.2016
  • Если подумать, наверняка это тот же контент, что и на вкладке сети? Вы пытались экспортировать файл HAR и визуализировать его? У меня есть пара идей на этот счет. Должна ли визуализация быть автоматизирована? 23.02.2016
  • Да, это точно такой же журнал, который инструменты разработчика Chrome используют для создания вкладок сети, трассировки и временной шкалы. До того, как журнал производительности был доступен в драйвере Chrome, я добавлял написанный мной плагин для получения файлов HAR. Попытка отказаться от этого, теперь, когда есть доступ к сообщениям протокола инструмента разработки. 23.02.2016

Ответы:


1

Поскольку эти данные точно такие же, как те, что показаны на вкладке «Сеть», и они будут экспортированы в файл HAR, есть несколько вариантов получения этого HAR:

  • Независим от браузера: я сам использую прокси-сервер — Browsermob в этом случае - направьте через него весь трафик Selenium, а затем используйте либо REST API, либо код Java для экспорта файла HAR.
  • Для Chrome: попробуйте этот вопрос и этот ответ.

Возможно, самый простой способ автоматизировать визуализацию вывода — получить HAR в виде строки и вставить в http://www.softwareishard.com/har/viewer/. Это должно дать вам что-то очень похожее на вкладку «Сеть», но в формате, который легче экспортировать, делать скриншоты и печатать.

Моим собственным предпочтительным долгосрочным решением было бы (а) направить/протолкнуть JSON-сообщения Chrome DTP в Logstash для (б) экспорта в Elasticsearch, а затем (в) для Kibana для создания пользовательских визуализаций. Однако инструмента, позволяющего (а) работать, похоже, еще не существует.

22.02.2016
  • Спасибо. Но дело в преобразовании этих лог-сообщений в HAR-файл. У меня уже есть решение для получения файлов HAR. Я хочу отказаться от этого сейчас, когда я могу получить собственные журналы инструментов разработчика Chrome. 23.02.2016
  • Вы смотрели ответ на другой вопрос? Я думаю, что я рассмотрел все возможности: либо манипулируйте всеми этими событиями в стандартном формате, таком как HAR, чтобы вы могли использовать одну из существующих программ просмотра HAR, либо используйте визуализатор на основе событий/потоков/журналов, такой как Kibana, который будет неизбежно нужна настройка + настройка. Я не могу себе представить, какие еще есть возможности. 23.02.2016
  • В конечном счете вам нужен слушатель, какое-то хранилище данных и визуализатор. Вы можете написать собственный слушатель и публиковать события в statsd или Carbon для просмотра в Graphite или Grafana, но это такое же базовое решение, как и мое решение Kibana. Может проще, но менее гибко? 23.02.2016
  • Ага. У меня уже есть журналы в текстовом файле в конце теста. Я не хочу передавать сообщения журнала в режиме реального времени, потому что это создает дополнительную внутреннюю зависимость, которую я не хочу поддерживать. Похоже, уже должна быть утилита, которая статически конвертирует логи в файл HAR. или просто визуализирует их. Кажется, я должен написать что-то сам или создать индивидуальные отчеты в Кибане, как вы предложили. 23.02.2016
  • fwiw — В качестве альтернативы «a», если вы создаете простое расширение Chrome, которое может относительно легко выплевывать журналы HAR прямо в REST API Elasticsearch. Это то, что я сделал. Затем у меня есть Logstash, использующий этот индекс, выполняющий несколько манипуляций, таких как геолокация и вывод в новый индекс. Это работа в процессе, но она не требует больших усилий. Сейчас я работаю над дальнейшим обогащением, чтобы помочь с визуализацией Kibana для моего варианта использования. 19.09.2017

    • 2

    Пожалуйста, взгляните на проект Catapult — «дом для нескольких инструментов производительности, которые охватывают сбор, отображение и анализ данных о производительности».

    https://github.com/catapult-project/catapult

    Вероятно, вам также следует взглянуть на "Событие трассировки". Формат", чтобы правильно настроить записи журнала в соответствии с поддерживаемым форматом.

    02.01.2018
    Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..