# JS Runtime Inspector renders values of all cells **URL:** \ **Category:** Help\ **Created:** [August 8, 2026, 6:50pm UTC](https://talk.observablehq.com/t/js-runtime-inspector-renders-values-of-all-cells/10755 "2026-08-08T18:50:05Z")\ **Posts on this page:** 4\ **Page:** 1
**Author:** ![nxrix](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/nxrix/32/9852_2.png) [@nxrix](https://talk.observablehq.com/u/nxrix)\ **Post date:** [August 8, 2026, 6:50pm UTC](https://talk.observablehq.com/t/js-runtime-inspector-renders-values-of-all-cells/10755/1 "2026-08-08T18:50:05Z")
![image](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/c/c4bc892ec8b8c6bd21179e3d37a835f2c198b978.png) I’m embedding some notebooks using runtime. ```js import { Runtime, Inspector } from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@5/dist/runtime.js"; import define from "https://api.observablehq.com/@nxrix/name.js?v=4"; new Runtime().module(define, Inspector.into("main")); ``` It works, but elements that have viewof still show the inspect element for their value. I tried hiding them with CSS, but that broke some other things. I found older discussion about the same issue: [Embedded notebook shows input value at bottom of cell](https://talk.observablehq.com/t/embedded-notebook-shows-input-value-at-bottom-of-cell/). However, it doesn’t seem to have a good solution. ---
**Author:** ![tomlarkworthy](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/tomlarkworthy/32/5940_2.png) [@tomlarkworthy](https://talk.observablehq.com/u/tomlarkworthy)\ **Post date:** [August 8, 2026, 9:31pm UTC](https://talk.observablehq.com/t/js-runtime-inspector-renders-values-of-all-cells/10755/2 "2026-08-08T21:31:33Z")
this renders properly, you have to handle viewof, mutable and imports all as special cases. > **[Visualizer: Own Cell Renderer](https://observablehq.com/@tomlarkworthy/visualizer)** > > Instead of cells being rendered into a \`div\` that is setup before the runtime is started, we invert, by rendering cells into a div hosted inside the notebook. Through this inversion, it is possible to change radically change how notebook renders... You have to group variables into cells. This notebook does it > **[cellMap](https://observablehq.com/@tomlarkworthy/cell-map)** > > computes the mapping of reactive variables to higher level notebook cells, grouped by module cellMap \`liveCellMap\` Prefer using this variable for an always live view of the runtime state cellMap function You can call it with zero args to default to... My notes on how things works are here > **[How the Observable Runtime works](https://observablehq.com/@tomlarkworthy/observable-notes)** > > Living documentation A lot of Observable is open source and MIT/ISC licensed. Additional tools have been built by the community 1st party Observable JS parser Lezer Grammar for Observable JS Observable Runtime Standard Library Inspector 3rd party... Its definitely not complete! Notebook Kit Notebooks 2.0 have potential for a cleaner model for the JS part, but then imports are a bit weird currently so that potential is not banked yet and I am stuck on Notebook 1.0 for a while (I have a Notebook 2.0 decompiler in my stash though!) ---
**Author:** ![viktoriyanavrotskaya](https://avatars.discourse-cdn.com/v4/letter/v/59ef9b/32.png) [@viktoriyanavrotskaya](https://talk.observablehq.com/u/viktoriyanavrotskaya)\ **Post date:** [August 11, 2026, 2:21pm UTC](https://talk.observablehq.com/t/js-runtime-inspector-renders-values-of-all-cells/10755/3 "2026-08-11T14:21:02Z")
> [@nxrix](#): > > ![image](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/c/c4bc892ec8b8c6bd21179e3d37a835f2c198b978.png) > > I’m embedding some notebooks using runtime. > > ```auto > import { Runtime, Inspector } from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@5/dist/runtime.js"; > import define from "https://api.observablehq.com/@nxrix/name.js?v=4"; > new Runtime().module(define, Inspector.into("main")); > > ``` > > It works, but elements that have viewof still show the inspect element for their value. > I tried hiding them with CSS, but that broke some other things. > > I found older discussion about the same issue: [Embedded notebook shows input value at bottom of cell](https://talk.observablehq.com/t/embedded-notebook-shows-input-value-at-bottom-of-cell/). > However, it doesn’t seem to have a good solution. The issue is that `Inspector.into("main")` attaches an inspector to every named cell, including the value half of each `viewof`. Instead of using the blanket `into`, provide a custom observer function that returns an inspector only for the cells you actually want to render, and returns something no-op (or nothing) for the `viewof` value cells. That way you skip them at the source rather than fighting it with CSS afterward. The runtime’s observer API gives you the cell name so you can filter on it. ---
**Author:** ![viktoriyanavrotskaya](https://avatars.discourse-cdn.com/v4/letter/v/59ef9b/32.png) [@viktoriyanavrotskaya](https://talk.observablehq.com/u/viktoriyanavrotskaya)\ **Post date:** [August 12, 2026, 4:03pm UTC](https://talk.observablehq.com/t/js-runtime-inspector-renders-values-of-all-cells/10755/4 "2026-08-12T16:03:47Z")
> [@viktoriyanavrotskaya](#): > > The issue is that `Inspector.into("main")` attaches an inspector to every named cell, including the value half of each `viewof`. Instead of using the blanket `into`, provide a custom observer function [website](https://tropical-casino.com/)returns an inspector only for the cells you actually want to render, and returns something no-op (or nothing) for the `viewof` value cells. That way you skip them at the source rather than fighting it with CSS afterward. The runtime’s observer API gives you the cell name so you can filter on it. That’s a much cleaner fix than the CSS hacks I was layering on. Swapping the blanket `Inspector.into("main")` for a custom observer that filters by cell name lets me return an inspector only for the cells I actually want and a no-op for the `viewof` value halves, so I skip them at the source instead of hiding them after render. Makes sense that `into` was blanket-attaching to every named cell including those value halves. The observer API handing me the cell name is exactly the hook I needed. Rewriting it that way now, thanks.