Skip to main
Table of Contents

Debug Console

About

This page demonstrates a sticky in-page debug panel that hooks native console.* methods and mirrors output into the page, including file/line metadata, duplicate grouping, and empty-state handling.

Demonstration

Use these controls to choose levels and message text for Emit Once, and set Burst Count for Emit Burst. Then review output in the sticky debug panel.

Preset
Custom Emitter
Actions

Status: Ready

Code

Any native console call is mirrored to the sticky panel by the hook:

console.log("A basic log message");
console.info("An information message");
console.warn("A warning message");
console.error("An error message");

Repeated lines are grouped with a counter badge. File and line details are parsed from the JavaScript stack when available. Uncaught errors and unhandled Promise rejections are also captured.

Attribution

Debug Console

  • window.innerWidth: , .innerHeight:
  • window.screen.width: , .height:
  • window.devicePixelRatio:
  • [window.location.*]
    [protocol]//[hostname]:[port][pathname][search][hash]

console.log