Jeden Skill in Manus ausführen
mit einem Klick

Jeden Skill in Manus mit einem Klick ausführen

writing-dev-server-tests

Sterne93.604

Forks4.751

Aktualisiert25. Dezember 2025 um 07:37

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

Installation

Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.

In Manus ausführen

Quelle

oven-sh

oven-sh/bun

GitHub-Repository öffnen Creator-Repositorys ansehen

Download

In Manus ausführen

Verwandte BerufeSOC

Basierend auf der SOC-Berufsklassifikation

Softwarequalitätssicherungsanalysten und -testerInformatik- und Mathematikberufe·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"'],
});

Mehr aus diesem Repository

gleiches Repository

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"'], });