hono-void

Original：🇺🇸 English

Translated

Use when checking or testing a Void app with Hono CLI — pages, page actions, and API routes. TRIGGER when package.json depends on 'void', the project has void.config.ts, or the user mentions Void. Void is a framework built on Hono.

3installs

Sourcehonojs/skills

Added on2026-10-30

NPX Install

npx skill4agent add honojs/skills hono-void

SKILL.md Content

View Translation Comparison →

Hono Void Skill

Void builds a Hono app from file-based routes, so there is no entry file and the code does not import

hono

. Verify changes with Hono CLI, not with a browser, curl, or a dev server. It runs the app through Vite with no flag and no file argument:

bash

npm install -D @hono/cli@next
npx hono --help
npx hono routes --exclude /__void   # hide Void's internal routes
npx hono request /

For a flow (create, then read), use one

npx hono batch -

call with

expect

on every step. Send

x-voidpages: true

so a page answers with JSON instead of the full HTML. A page action returns 200 even when it fails, so assert on the body (

body

in

expect

is a deep partial match):

bash

npx hono batch - <<'EOF'
{"method":"POST","path":"/","headers":{"x-voidpages":"true"},"body":{"shop":""},"expect":{"status":200,"body":{"errors":{"shop":"Enter a shop name"}}}}
{"method":"POST","path":"/","headers":{"x-voidpages":"true"},"body":{"shop":"Hono Ramen"},"expect":{"status":200}}
EOF

A create that redirects shows its

location

; follow it with

"save":{"next":"header:location"}

and then

"path":"{{next}}"

. An array in

expect

must match the whole array, so check one item of a list by reading the response, not with

expect

. The path, fields, and messages above are an example. Check yours with

npx hono routes

and one request first.

Checking the page in a browser

HTTP requests do not run the page's JavaScript, so they miss client-side bugs: a form that keeps its values after a submit, or a redirect that lands on the wrong URL. Check those with

npx hono browse

. It loads the page in happy-dom, runs its JavaScript, and fills and clicks in order. Install happy-dom first:

bash

npm install -D happy-dom
npx hono browse / --fill "Shop name=Hono Ramen" --click 'button[type=submit]'

--fill

takes a field's name, label text, or placeholder (the keys in

forms

of the output), or a CSS selector. The output has the final

url

, the visible

text

, the

forms

values, and

console

errors. happy-dom has no layout or CSS.

Checking a Void app

pages/**

return HTML. Send the header

x-voidpages: true

to get the page data as JSON:

{ component, props, errors, head, ... }

.

Page actions are POST/PUT/PATCH/DELETE to the page URL. A named action has a
```
?name
```
suffix, e.g.
```
POST /ramen/1?delete
```
.
A validation failure in a page action returns 200, not 422, with the messages in
```
body.errors
```
(
```
{ field: message }
```
). A success has no
```
errors
```
.
A foreign
```
Origin
```
header gets 403. Omit
```
Origin
```
or use the app's own origin.
```
npx void db seed --yes
```
resets the local DB between runs.

For Void itself (routing, pages, the Void CLI), read Void's docs in

node_modules/void/docs/

.

hono-void

NPX Install

Tags

SKILL.md Content

Hono Void Skill

Checking the page in a browser

Checking a Void app