Exécutez n'importe quel Skill dans Manus
en un clic

Exécutez n'importe quel Skill dans Manus en un clic

writing-dev-server-tests

Étoiles93 604

Forks4 751

Mis à jour25 décembre 2025 à 07:37

Guides writing HMR/Dev Server tests in test/bake/. Use when creating or modifying dev server, hot reloading, or bundling tests.

Installation

Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.

Exécuter dans Manus

Source

oven-sh

oven-sh/bun

Ouvrir le dépôt GitHub Voir les dépôts du créateur

Téléchargement

Exécuter dans Manus

Métiers associésSOC

Basé sur la classification professionnelle SOC

Analystes en assurance qualité des logiciels et testeursProfessions informatiques et mathématiques·SOC 15-1253

SKILL.md

readonly

name	writing-dev-server-tests
description	Guides writing HMR/Dev Server tests in test/bake/. Use when creating or modifying dev server, hot reloading, or bundling tests.

Writing HMR/Dev Server Tests

Dev server tests validate hot-reloading robustness and reliability.

File Structure

test/bake/bake-harness.ts - shared utilities: devTest, prodTest, devAndProductionTest, Dev class, Client class
test/bake/client-fixture.mjs - subprocess for Client (page loading, IPC queries)
test/bake/dev/*.test.ts - dev server and hot reload tests
test/bake/dev-and-prod.ts - tests running on both dev and production mode

Test Categories

bundle.test.ts - DevServer-specific bundling bugs
css.test.ts - CSS bundling issues
plugins.test.ts - development mode plugins
ecosystem.test.ts - library compatibility (prefer concrete bugs over full package tests)
esm.test.ts - ESM features in development
html.test.ts - HTML file handling
react-spa.test.ts - React, react-refresh transform, server components
sourcemap.test.ts - source map correctness

devTest Basics

import { devTest, emptyHtmlFile } from "../bake-harness";

devTest("html file is watched", {
  files: {
    "index.html": emptyHtmlFile({
      scripts: ["/script.ts"],
      body: "<h1>Hello</h1>",
    }),
    "script.ts": `console.log("hello");`,
  },
  async test(dev) {
    await dev.fetch("/").expect.toInclude("<h1>Hello</h1>");
    await dev.patch("index.html", { find: "Hello", replace: "World" });
    await dev.fetch("/").expect.toInclude("<h1>World</h1>");

    await using c = await dev.client("/");
    await c.expectMessage("hello");

    await c.expectReload(async () => {
      await dev.patch("index.html", { find: "World", replace: "Bar" });
    });
    await c.expectMessage("hello");
  },
});

Key APIs

files: Initial filesystem state
dev.fetch(): HTTP requests
dev.client(): Opens browser instance
dev.write/patch/delete: Filesystem mutations (wait for hot-reload automatically)
c.expectMessage(): Assert console.log output
c.expectReload(): Wrap code that causes hard reload

Important: Use dev.write/patch/delete instead of node:fs - they wait for hot-reload.

Testing Errors

devTest("import then create", {
  files: {
    "index.html": `<!DOCTYPE html><html><head></head><body><script type="module" src="/script.ts"></script></body></html>`,
    "script.ts": `import data from "./data"; console.log(data);`,
  },
  async test(dev) {
    const c = await dev.client("/", {
      errors: ['script.ts:1:18: error: Could not resolve: "./data"'],
    });
    await c.expectReload(async () => {
      await dev.write("data.ts", "export default 'data';");
    });
    await c.expectMessage("data");
  },
});

Specify expected errors with the errors option:

await dev.delete("other.ts", {
  errors: ['index.ts:1:16: error: Could not resolve: "./other"'],
});

Plus depuis ce dépôt

même dépôt

implementing-jsc-classes-rust

oven-sh/bun

Creates JavaScript classes using Bun's Rust bindings generator (.classes.ts). Use when implementing new JS APIs in Rust with JSC integration, prototypes, or constructors.

2026-06-2593.6k

javascriptcore-garbage-collector

oven-sh/bun

JSC GC reference for Bun. Use for use-after-free, JS object leaks, "collected too early", or when touching WriteBarrier, visitChildren, visitAdditionalChildren, JSRef, JSC::Strong/Weak, hasPendingActivity, ensureStillAlive, addOpaqueRoot, reportExtraMemoryAllocated, IsoSubspace, HeapAnalyzer, finalize.

2026-06-2593.6k

rust-system-calls

oven-sh/bun

Guides using bun_sys for system calls and file I/O in Rust. Use when implementing file operations, opening fds, or any syscall path instead of std::fs or libc.

2026-06-2593.6k

implementing-jsc-classes-cpp

oven-sh/bun

Implements JavaScript classes in C++ using JavaScriptCore. Use when creating new JS classes with C++ bindings, prototypes, or constructors.

2026-05-0493.6k

slowest-tests

oven-sh/bun

Find the top-N slowest test files in CI from a recent BuildKite run, optionally posting the results to a Slack channel as a formatted table. Use when asked to find slow CI tests, "what's making CI slow", or to post a slow-test report to Slack.

2026-04-2393.6k

writing-bundler-tests

oven-sh/bun

Guides writing bundler tests using itBundled/expectBundled in test/bundler/. Use when creating or modifying bundler, transpiler, or code transformation tests.

2025-12-2593.6k

Writing HMR/Dev Server Tests

Dev server tests validate hot-reloading robustness and reliability.

File Structure

test/bake/bake-harness.ts - shared utilities: devTest, prodTest, devAndProductionTest, Dev class, Client class

test/bake/client-fixture.mjs - subprocess for Client (page loading, IPC queries)

test/bake/dev/*.test.ts - dev server and hot reload tests

test/bake/dev-and-prod.ts - tests running on both dev and production mode

Test Categories

bundle.test.ts - DevServer-specific bundling bugs

css.test.ts - CSS bundling issues

plugins.test.ts - development mode plugins

ecosystem.test.ts - library compatibility (prefer concrete bugs over full package tests)

esm.test.ts - ESM features in development

html.test.ts - HTML file handling

react-spa.test.ts - React, react-refresh transform, server components

sourcemap.test.ts - source map correctness

devTest Basics

import { devTest, emptyHtmlFile } from "../bake-harness"; devTest("html file is watched", { files: { "index.html": emptyHtmlFile({ scripts: ["/script.ts"], body: "<h1>Hello</h1>", }), "script.ts": `console.log("hello");`, }, async test(dev) { await dev.fetch("/").expect.toInclude("<h1>Hello</h1>"); await dev.patch("index.html", { find: "Hello", replace: "World" }); await dev.fetch("/").expect.toInclude("<h1>World</h1>"); await using c = await dev.client("/"); await c.expectMessage("hello"); await c.expectReload(async () => { await dev.patch("index.html", { find: "World", replace: "Bar" }); }); await c.expectMessage("hello"); }, });

Key APIs

files: Initial filesystem state

dev.fetch(): HTTP requests

dev.client(): Opens browser instance

dev.write/patch/delete: Filesystem mutations (wait for hot-reload automatically)

c.expectMessage(): Assert console.log output

c.expectReload(): Wrap code that causes hard reload

Important: Use dev.write/patch/delete instead of node:fs - they wait for hot-reload.

Testing Errors

devTest("import then create", { files: { "index.html": `<!DOCTYPE html><html><head></head><body><script type="module" src="/script.ts"></script></body></html>`, "script.ts": `import data from "./data"; console.log(data);`, }, async test(dev) { const c = await dev.client("/", { errors: ['script.ts:1:18: error: Could not resolve: "./data"'], }); await c.expectReload(async () => { await dev.write("data.ts", "export default 'data';"); }); await c.expectMessage("data"); }, });

Specify expected errors with the errors option:

await dev.delete("other.ts", { errors: ['index.ts:1:16: error: Could not resolve: "./other"'], });