Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/michael-tiger-2010/wyvernjs/llms.txt

Use this file to discover all available pages before exploring further.

WyvernJS fills the gaps that vanilla JavaScript left behind. Four focused modules — DiWu, TianFeng, FireWyrm, and ShuiHu — give you chainable DOM manipulation, practical utilities, lightweight async testing, and structured logging without pulling in a heavyweight framework.

Installation

Add WyvernJS via npm or load it from the jsDelivr CDN with a single script tag.

Quickstart

Initialize all four modules and write your first test in under five minutes.

DiWu — DOM Sugar

Chainable DOM methods, Proxy-based class and attribute access, and smooth Web Animations API integration.

TianFeng — Utilities

Routing, reactive stores, localStorage persistence, fetch helpers, form validation, and device detection.

FireWyrm — Testing

Minimalist async test runner with 25+ chainable assertion matchers and first-class mocking.

ShuiHu — Logging

Structured browser logging with four severity levels and a step-based benchmarking system.

​
Why WyvernJS?

WyvernJS is built around the idea that programming should be developer-centric. Each module solves a specific, recurring pain point in vanilla JS projects without forcing you to adopt a full framework or a pile of dependencies.
ModuleAliasSizeWhat it solves
DiWudw~4 KBDOM manipulation friction
TianFengtf~10 KBEveryday utility gaps
FireWyrmfw~5 KBQuick, zero-config testing
ShuiHush~3 KBBrowser logging & benchmarking
All four modules are independent. Use one, two, or all four — import only what you need.

​
Get Started in 3 Steps

1

Install WyvernJS

npm install @mchen_dragon/wyvernjs
Or drop a <script> tag pointing to the jsDelivr CDN — no build step required.
2

Initialize the modules you need

import { dw, tf, fw, sh } from '@mchen_dragon/wyvernjs';

dw.init();   // extends DOM prototypes
tf.init();   // populates window with utilities
3

Start building

// Chainable DOM — DiWu
document.querySelector('.card')
  .css({ backgroundColor: 'lightblue' })
  .text('Hello WyvernJS')
  .on('click', () => sh.log('card clicked'));

// Quick test — FireWyrm
fw.start();
fw.assert('Addition', () => 1 + 1).is(2);
fw.end();

Build docs developers (and LLMs) love

Get started for freeTalk to us