How to Test Fast.io MCP Server Tools with Playwright

Fast.io's MCP server exposes multiple tools for file management via Streamable HTTP or SSE. Browser-based AI agents or web apps connect to handle uploads, queries, and shares. Real-world tests confirm these tools work under network conditions.

Playwright works great here. It runs Chromium, Firefox, and WebKit with good control over network requests. You can use it to mimic agent behavior, mock server responses, and verify results without flakiness.

Skip unit tests alone. They miss browser quirks like EventSource handling for SSE. E2E tests validate the full stack from client connect to tool execution.

Helpful references: Fast.io Workspaces, Fast.io Collaboration, and Fast.io AI.

Install Playwright in a new Node.js project.

npm init -y
npm i -D @playwright/test
npx playwright install

Create playwright.config.ts:

import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  testDir: './tests',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 2 : 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: 'html',
  use: {
    baseURL: 'http://localhost:3000',  // Your MCP client app
    trace: 'on-first-retry',
  },
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
  ],
});

Run tests with npx playwright test.

MCP requires auth via signup, signin, or API keys. Use Playwright's storage state for persistence.

Create tests/auth.spec.ts:

import { test, expect } from '@playwright/test';

test('authenticate MCP', async ({ page, context }) => {
  await page.goto('/storage-for-agents/');
  // Simulate PKCE or API key setup
  await context.storageState({ path: 'playwright/.auth/mcp-state.json' });
});

Load state in config: storageState: 'playwright/.auth/mcp-state.json'.

For API keys, set headers in context:

const context = await browser.newContext({
  extraHTTPHeaders: { 'Authorization': `Bearer ${apiKey}` }
});

MCP's SSE transport sends tool responses as events. Mock with Playwright routes.

Intercept SSE:

await page.route('/storage-for-agents/', async route => {
  const sseResponse = `data: ${JSON.stringify(mockToolResponse)}

`;
  await route.fulfill({
    status: 200,
    headers: { 'Content-Type': 'text/event-stream', 'Cache-Control': 'no-cache' },
    body: sseResponse
  });
});

For Streamable HTTP (/mcp), mock POST responses:

await page.route('**/mcp', async route => {
  await route.fulfill({ json: mockToolResult });
});

Many guides overlook SSE mocking details.

Test listing workspaces:

test('list MCP workspaces', async ({ page }) => {
  await page.goto('/your-mcp-client');
  await expect(page.locator('[data-testid=workspace-list]')).toHaveText(/My Workspace/);
});

Test file upload via MCP tool:

test('upload file with MCP', async ({ page }) => {
  await page.route('**/upload', route => route.fulfill({ json: { nodeId: 'mock-node' } }));
  await page.getByTestId('file-upload').setInputFiles('test.pdf');
  await expect(page.locator('[data-testid=upload-success]')).toBeVisible();
});

Assert tool responses match expected JSON schemas.

In GitHub Actions, cache Playwright:

- uses: actions/setup-node@v4
  with:
    node-version: 20
- run: npm ci
- uses: browser-actions/setup-playwright@v1
  with:
    playwright-version: multiple.42.0
- run: npx playwright test

Best practices:

• Use traces for debugging: trace: 'retain-on-failure'
• Mock external deps to avoid flakes.
• Parallelize with shards.
• Video record failures.

Capture these lessons in a shared runbook so new contributors can follow the same process. Consistency reduces regression risk and makes troubleshooting faster.