Перехват WebSocket сообщений

Playwright предоставляет мощные инструменты для тестирования взаимодействий с веб-страницами, включая работу с WebSocket-соединениями. В этой главе рассматривается, как можно перехватывать и манипулировать сообщениями WebSocket в процессе автоматизированного тестирования.

Основы работы с WebSocket в Playwright

WebSocket — это протокол связи, который позволяет обмениваться данными между клиентом и сервером в реальном времени через постоянное соединение. В отличие от HTTP, WebSocket предоставляет двустороннюю связь, что делает его идеальным для приложений с обновлением в реальном времени (например, чаты, игровые серверы, приложения с потоковыми данными).

В Playwright существует встроенная поддержка для работы с WebSocket, что позволяет разработчикам не только наблюдать за происходящими событиями, но и вмешиваться в процесс передачи данных, если это необходимо.

Перехват WebSocket сообщений

Playwright предоставляет механизм для перехвата WebSocket-сообщений через page.on('websocket') событие. Это событие срабатывает всякий раз, когда страница устанавливает новое WebSocket-соединение. Однако для того чтобы полноценно работать с сообщениями, необходимо использовать дополнительную обработку.

const { test, expect } = require('@playwright/test');

test('перехват сообщений WebSocket', async ({ page }) => {
  // Устанавливаем прослушиватель для WebSocket
  page.on('websocket', ws => {
    // Прослушиваем сообщения WebSocket
    ws.on('frame', frame => {
      if (frame.opcode === 1) { // текстовое сообщение
        console.log('Сообщение WebSocket:', frame.payloadData.toString());
      }
    });
  });

  await page.goto('https://example.com'); // Страница, которая использует WebSocket
});

Этот код настраивает обработчик для всех WebSocket-соединений, устанавливаемых на странице, и перехватывает текстовые сообщения, передаваемые через WebSocket.

Изменение сообщений WebSocket

Playwright позволяет не только просматривать, но и изменять сообщения, отправляемые через WebSocket. Для этого необходимо получить доступ к WebSocket-соединению и перехватывать фреймы, чтобы изменить их данные перед отправкой на сервер или получением от него.

test('изменение сообщений WebSocket', async ({ page }) => {
  page.on('websocket', ws => {
    ws.on('frame', frame => {
      if (frame.opcode === 1) {
        const modifiedMessage = frame.payloadData.toString().replace('oldValue', 'newValue');
        ws.send(modifiedMessage);
        console.log('Отправлено изменённое сообщение:', modifiedMessage);
      }
    });
  });

  await page.goto('https://example.com');
});

В этом примере мы перехватываем текстовое сообщение, изменяем его содержимое и отправляем его обратно через WebSocket. Это может быть полезно, например, для тестирования реакций системы на изменения входных данных.

Перехват WebSocket на конкретных страницах

Playwright позволяет более точно настраивать перехват WebSocket-соединений, ориентируясь на конкретные запросы или страницы. Используя фильтры и параметры, можно отслеживать только те соединения, которые вам действительно интересны.

test('перехват WebSocket для конкретной страницы', async ({ page }) => {
  const urlFilter = /ws:\/\/example\.com\/socket/;

  page.on('websocket', ws => {
    if (urlFilter.test(ws.url())) {
      ws.on('frame', frame => {
        console.log('Сообщение на фильтрованный WebSocket:', frame.payloadData.toString());
      });
    }
  });

  await page.goto('https://example.com');
});

Здесь используется регулярное выражение для фильтрации WebSocket-соединений по URL. Только соединения, соответствующие фильтру, будут обрабатываться.

Перехват WebSocket с использованием контекста браузера

Для перехвата WebSocket-сообщений в разных контекстах браузера Playwright позволяет работать с несколькими страницами или фреймами в одном тесте. Каждый контекст браузера может иметь свой собственный набор WebSocket-соединений, что делает тестирование многозадачным и более гибким.

test('перехват WebSocket в нескольких контекстах', async ({ browser }) => {
  const context1 = await browser.newContext();
  const context2 = await browser.newContext();

  const page1 = await context1.newPage();
  const page2 = await context2.newPage();

  page1.on('websocket', ws => {
    ws.on('frame', frame => {
      console.log('Сообщение WebSocket на странице 1:', frame.payloadData.toString());
    });
  });

  page2.on('websocket', ws => {
    ws.on('frame', frame => {
      console.log('Сообщение WebSocket на странице 2:', frame.payloadData.toString());
    });
  });

  await page1.goto('https://example.com');
  await page2.goto('https://example.com');
});

В этом примере два контекста браузера взаимодействуют с двумя различными страницами, и для каждой страницы устанавливается свой обработчик WebSocket-соединений.

Завершающие настройки

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

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

Кроме того, Playwright позволяет использовать другие возможности тестирования, такие как асинхронные действия, взаимодействие с элементами на странице, создание сложных потоков тестов. С применением WebSocket можно полноценно тестировать работу приложений, использующих этот протокол, и создавать более качественные и точные тесты для реальных пользовательских сценариев.

Оглавление