skills.rest
hughescr
hughescrCOMMUNITY
Explore all skills by this author →
GitHub

hugo-testing

Automate client-side JavaScript tests in Hugo projects using Bun and happy-dom.

1|Updated Jul 31, 2025
Search Tags:#javascript#bun#test#hugo#happy-dom#dom-mocking
One-click install
npx skills add https://github.com/hughescr/claude-code-config --skill hugo-testing
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hugo-testing
Source: https://github.com/hughescr/claude-code-config/tree/main/plugins/hugo/skills/hugo-testing
Command: npx skills add https://github.com/hughescr/claude-code-config --skill hugo-testing

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Testing client-side JavaScript in Hugo sites can be slow and flaky when done manually. This Skill provides a repeatable, lightweight workflow to verify DOM interactions and client-side behavior with Bun's test runner and happy-dom.

Core Features & Use Cases

  • Bun-based test runner: Run tests with bun test with minimal setup.
  • Happy-dom DOM mocking: Simulate window, document, localStorage, and other browser APIs for reliable tests.
  • Use Cases: Validate theme toggles, responsive behaviors, and dynamic content loading in Hugo themes and components.

Quick Start

Install Bun and dev dependencies: bun add -D happy-dom Create tests under tests/ and run: bun test Optional: run in watch mode: bun test --watch

Frequently Asked Questions about hugo-testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I test client-side JavaScript in a Hugo project?▼

Testing client-side JavaScript in a Hugo project is automated by configuring Bun's test runner with happy-dom to simulate browser APIs and verify DOM interactions. You create tests under a tests directory and execute them using the bun test command.

What do I need to simulate browser environments for Hugo JS tests?▼

To simulate browser environments for Hugo JS tests, you need the happy-dom library installed as a development dependency. This library mocks window, document, and localStorage APIs to ensure reliable DOM interaction testing.

Can I use Bun to test DOM interactions and theme toggles in Hugo themes?▼

Yes, you can use Bun to test DOM interactions and theme toggles in Hugo themes by applying happy-dom for DOM mocking. This combination provides a lightweight workflow to validate responsive behaviors and dynamic content loading reliably.

What is the best way to run unit tests for Hugo client-side scripts?▼

The best way to run unit tests for Hugo client-side scripts is using Bun's test runner with happy-dom. This approach provides a repeatable workflow that avoids slow manual testing and supports a watch mode via bun test --watch for rapid development.

Why does testing Hugo JavaScript manually result in flaky behavior?▼

Testing Hugo JavaScript manually results in flaky behavior because it lacks a consistent simulated browser environment. Automating this process with Bun and happy-dom provides a stable, repeatable workflow for verifying client-side behavior.

Related Skills

Explore More Software Engineering Skills→
hughescrhughescr
1

bun-runtime

Standardize JavaScript and TypeScript projects with Bun as runtime and package manager.

Community
Advanced
peterWang123589peterWang123589

vitest

Run Jest-compatible unit tests for Vite-based projects with mocks, snapshots, and coverage.

Community
Intermediate
magnus919magnus919
40

hugo-theme

Build, customize, and debug Hugo CMS themes with template architecture and asset pipelines.

Community
Advanced
outfitter-devoutfitter-dev
6

outfitter-testing

Test Outfitter packages with handlers, fixtures, mocks, and harnesses.

Official
Intermediate