inspect-value
A powerful JavaScript value inspector — use in React, Vue, Svelte, Angular, or plain HTML.
Live Demo
Every JavaScript built-in type, rendered in the browser with a single web component.
What is this?
Section titled “What is this?”inspect-value wraps svelte-inspect-value as a Web Component (<inspect-value>, <inspect-panel>). Styles are encapsulated in Shadow DOM — just import the script and use the element.
Features
Section titled “Features”- All JS types — strings, numbers, booleans, arrays, objects, Date, RegExp, URL, Map, Set, Error, TypedArray, Promises, Functions, and more
- 6 built-in themes —
inspect,drak,stereo,dark,default-dark,default-light - Deep search — filter, filter-strict, and highlight modes
- Panel mode — fixed-position overlay for persistent debugging
- Zero config — import the script, use the element
Framework Support
Section titled “Framework Support”| Framework | Integration | Live Demos |
|---|---|---|
| React | useRef + useEffect | 4 interactive demos |
| Vue | ref() + onMounted | 4 interactive demos |
| Svelte | bind:this + $effect | 4 interactive demos |
| Angular | @ViewChild + CUSTOM_ELEMENTS_SCHEMA | Code examples |
| Vanilla JS | querySelector + .value | Code examples |