Tessera
Folgen

QUnit

@qunitjs.com

The powerful, easy-to-use JavaScript testing framework. Docs: https://qunitjs.com
 Source: https://github.com/qunitjs/qunit #qunit #javascript #typescript #nodejs #tdd #jquery #emberjs

4 Posts31 Follower16 Folgt
Nicolas Gras@armgd.bsky.social · 3mo ago

Julia Evans shows Vue component integration tests that run directly in the browser (no Node): bundle components, expose them on `window._components`, mount with a helper, and drive assertions with QUnit + `waitFor` polling + real DOM events. Also checks Chrome JS coverage on the bundle.

Testing Vue components in the browser

Julia Evans (May 2, 2026) walks through running Vue component integration tests directly in the browser without using Node, showing a practical setup that exposes components on window._components and uses a mountComponent helper and QUnit to drive tests. She documents key implementation details and pain points — polling via a waitFor helper for async renders, needing to dispatch DOM events for form inputs, pragmatic use of CSS/test identifiers, and checking Chrome’s JS coverage on the bundled file — all with concrete snippets and tradeoffs. citeturn0view0

jvns.ca

NullVoxPopuli@nullvoxpopuli.com · last yr.

(How I use) Qunit: - testem for cli reporter (not qunit) - (bulilt assets to load (I'd prefer vite's way) - testem for launching pre-installed browsers (doesn't force installation via npm like like puppeteer does, iirc) - qunit for test runner - qunit for test framework

QUnit@qunitjs.com · last yr.

Ever wondered how beforeEach works in a unit test framework? qunitjs.com/lifecycle/ While people generally guess right, this demonstrates that the order is guaranteed, and showcases what's possible when you depend on it. Thanks to FND, Jan D, and NullVoxPopuli for their help! #qunit

Imagine a test with global hooks, and a Parent and Child module that use hooks also. The execution order is: 1. Parent module runs the before hook. 2. Every test in the Parent module inherits context from the before hook, and repeats as follows: call global beforeEach, parent beforeEach, the actual test, parent afterEach, and lastly the global afterEach. 3. The Child module inherits context from the Parent before hook, and then runs its own before hook. 4. Every test in the Child module inherits context from this before hook, and repeats as follows: call global beforeEach, parent beforeEach, child beforeEach, the actual test, child afterEach, parent afterEach, and lastly the global afterEach.