chrome.devtools. Performance

Описание

Используйте API chrome.devtools.recorder для настройки панели «Рекордер» в DevTools.

Общие сведения об использовании API инструментов инструментов разработчика см. в обзоре API-интерфейсов DevTools .

Доступность

Хром 105+

Концепции и использование

API chrome.devtools. Performance позволяет разработчикам взаимодействовать с функциями записи на панели «Производительность» в Chrome DevTools. Вы можете использовать этот API для получения уведомлений о начале или остановке записи.

Доступны два события:

  • onProfilingStarted : это событие вызывается, когда панель «Производительность» начинает записывать данные о производительности.
  • onProfilingStopped : это событие вызывается, когда панель «Производительность» прекращает запись данных о производительности. позиция, которая связывает текущую трассировку стека с Cre. Оба события не имеют связанных параметров.

Прослушивая эти события, разработчики могут создавать расширения, которые реагируют на состояние записи на панели «Производительность» , обеспечивая дополнительную автоматизацию во время профилирования производительности.

Примеры

Вот как вы можете использовать API для прослушивания обновлений статуса записи.


chrome.devtools.performance.onProfilingStarted.addListener(() => {
  // Profiling started listener implementation
});

chrome.devtools.performance.onProfilingStopped.addListener(() => {
  // Profiling stopped listener implementation
})

Типы

RecorderExtensionPlugin

Интерфейс плагина, который вызывает панель «Рекордер» для настройки панели «Рекордер».

Характеристики

  • переиграть

    пустота

    Хром 112+

    Позволяет расширению реализовывать пользовательские функции воспроизведения.

    Функция replay выглядит так:

    (recording: object) => {...}

    • запись

      объект

      Запись взаимодействия пользователя со страницей. Это должно соответствовать схеме записи Puppeteer .

  • строкировать

    пустота

    Преобразует запись из формата панели «Запись» в строку.

    Функция stringify выглядит так:

    (recording: object) => {...}

    • запись

      объект

      Запись взаимодействия пользователя со страницей. Это должно соответствовать схеме записи Puppeteer .

  • stringifyStep

    пустота

    Преобразует шаг записи из формата панели «Рекордер» в строку.

    Функция stringifyStep выглядит так:

    (step: object) => {...}

    • шаг

      объект

      Шаг записи взаимодействия пользователя со страницей. Это должно соответствовать схеме шагов Puppeteer .

RecorderView

Хром 112+

Представляет представление, созданное расширением для внедрения в панель «Рекордер».

Характеристики

  • onHidden

    Событие<functionvoidvoid>

    Вызывается, когда представление скрыто.

    Функция onHidden.addListener выглядит так:

    (callback: function) => {...}

    • перезвонить

      функция

      Параметр callback выглядит так:

      () => void

  • onПоказано

    Событие<functionvoidvoid>

    Вызывается, когда отображается представление.

    Функция onShown.addListener выглядит так:

    (callback: function) => {...}

    • перезвонить

      функция

      Параметр callback выглядит так:

      () => void

  • показывать

    пустота

    Указывает, что расширение хочет отобразить это представление на панели «Рекордер».

    Функция show выглядит так:

    () => {...}

Методы

createView()

Хром 112+
chrome.devtools.recorder.createView(
  title: string,
  pagePath: string,
)

Создает представление, которое может обрабатывать воспроизведение. Это представление будет встроено в панель «Рекордер».

Параметры

  • заголовок

    нить

    Заголовок, который отображается рядом со значком расширения на панели инструментов разработчика.

  • PagePath

    нить

    Путь к HTML-странице панели относительно каталога расширения.

registerRecorderExtensionPlugin()

chrome.devtools.recorder.registerRecorderExtensionPlugin(
  plugin: RecorderExtensionPlugin,
  name: string,
  mediaType: string,
)

Регистрирует плагин расширения Recorder.

Параметры

  • Экземпляр, реализующий интерфейс RecorderExtensionPlugin.

  • имя

    нить

    Название плагина.

  • медиатип

    нить

    Тип носителя строкового содержимого, создаваемого плагином.