Add getNode helpter

Author: thetarnav

packages/debugger/src/dependency/index.ts

@@ -4,7 +4,7 @@ import {defer} from '@solid-primitives/utils'
 import {msg} from '@solid-devtools/shared/utils'
 import {ObjectType, getObjectById} from '../main/id.ts'
 import {DevtoolsMainView, NodeType, type InspectedState, type NodeID, type OutputEmit, type Solid} from '../main/types.ts'
-import {getNodeType} from '../main/utils.ts'
+import {getNode} from '../main/utils.ts'
 import {type OnNodeUpdate, type SerializedDGraph, collectDependencyGraph} from './collect.ts'
 
 export {type SerializedDGraph} from './collect.ts'
@@ -31,11 +31,16 @@ export function createDependencyGraph(props: {
 
     const inspectedNode = s.createMemo(() => {
         const state = props.inspectedState()
+        let node_raw: Solid.Owner | Solid.Signal | null = null
 
         if (state.signalId) {
-            return getObjectById(state.signalId, ObjectType.Signal)
+            node_raw = getObjectById(state.signalId, ObjectType.Signal)
         } else if (state.ownerId) {
-            return getObjectById(state.ownerId, ObjectType.Owner)
+            node_raw = getObjectById(state.ownerId, ObjectType.Owner)
+        }
+
+        if (node_raw != null) {
+            return getNode(node_raw)
         }
 
         return null
@@ -45,22 +50,20 @@ export function createDependencyGraph(props: {
         // listeners need to be cleared each time, because each update will cause the graph to be mapped again
         clearListeners?.()
 
-        const node = inspectedNode()
-        const type = node && getNodeType(node)
+        let node = inspectedNode()
 
-        if (
-            !props.enabled() ||
-            !type ||
-            type === NodeType.Root ||
-            type === NodeType.Component ||
-            type === NodeType.Context
+        if (!props.enabled() ||
+            !node ||
+            node.kind === NodeType.Root ||
+            node.kind === NodeType.Component ||
+            node.kind === NodeType.Context
         ) {
             clearListeners = null
             props.emit(msg('DgraphUpdate', null))
             return
         }
 
-        const dgraph = collectDependencyGraph(node as Solid.Computation | Solid.Signal, {
+        const dgraph = collectDependencyGraph(node.data as any, {
             onNodeUpdate,
         })
         clearListeners = dgraph.clearListeners

packages/debugger/src/inspector/inspector.ts

@@ -164,33 +164,35 @@ let PropsMap: ObservedPropsMap
 const $INSPECTOR = Symbol('inspector')
 
 function mapSourceValue(
-    node:    Solid.SourceMapValue | Solid.Computation,
-    handler: (nodeId: NodeID, value: unknown) => void,
+    node_raw: Solid.SourceMapValue | Solid.Computation,
+    handler:  (nodeId: NodeID, value: unknown) => void,
 ): Mapped.SourceValue | null {
 
-    let type = utils.getNodeType(node)
-    let {value} = node
+    let node = utils.getNode(node_raw)
+    let {value} = node_raw
     let id: NodeID
 
     // eslint-disable-next-line @typescript-eslint/switch-exhaustiveness-check
-    switch (type) {
-    case NodeType.Memo:        id = getSdtId(node as Solid.Memo,           ObjectType.Owner)       ;break
-    case NodeType.Signal:      id = getSdtId(node as Solid.Signal,         ObjectType.Signal)      ;break
-    case NodeType.Store:       id = getSdtId(node as Solid.Store,          ObjectType.Store)       ;break
-    case NodeType.CustomValue: id = getSdtId(node as Solid.SourceMapValue, ObjectType.CustomValue) ;break
+    switch (node.kind) {
+    case NodeType.Memo:        id = getSdtId(node.data, ObjectType.Owner)       ;break
+    case NodeType.Signal:      id = getSdtId(node.data, ObjectType.Signal)      ;break
+    case NodeType.Store:       id = getSdtId(node.data, ObjectType.Store)       ;break
+    case NodeType.CustomValue: id = getSdtId(node.data, ObjectType.CustomValue) ;break
     default:
         return null
     }
 
-    ValueMap.add(`${ValueItemType.Signal}:${id}`, () => node.value)
+    ValueMap.add(`${ValueItemType.Signal}:${id}`, () => node_raw.value)
 
-    if (type === NodeType.Memo || type === NodeType.Signal) {
-        observeValueUpdate(node, v => handler(id, v), $INSPECTOR)
+    if (node.kind === NodeType.Memo ||
+        node.kind === NodeType.Signal
+    ) {
+        observeValueUpdate(node.data, v => handler(id, v), $INSPECTOR)
     }
 
     return {
-        type:  type,
-        name:  utils.getNodeName(node),
+        type:  node.kind,
+        name:  utils.getNodeName(node.data),
         id:    id,
         value: encodeValue(value, false),
     }

packages/debugger/src/main/types.ts

@@ -56,6 +56,23 @@ export const NODE_TYPE_NAMES: Readonly<Record<NodeType, string>> = {
     [NodeType.CustomValue]: 'Custom Value',
 }
 
+export type NodeData = {
+    [NodeType.Root]:        Solid.Root,
+    [NodeType.Component]:   Solid.Component,
+    [NodeType.Element]:     Element,
+    [NodeType.Effect]:      Solid.Computation,
+    [NodeType.Render]:      Solid.Computation,
+    [NodeType.Memo]:        Solid.Memo,
+    [NodeType.Computation]: Solid.Computation,
+    [NodeType.Refresh]:     Solid.Memo,
+    [NodeType.Context]:     Solid.Computation,
+    [NodeType.CatchError]:  Solid.Computation,
+    [NodeType.Signal]:      Solid.Signal,
+    [NodeType.Store]:       Solid.Store,
+    [NodeType.CustomValue]: Solid.SourceMapValue,
+}
+export type Node = Union<NodeData>
+
 export enum ValueItemType {
     Signal = 'signal',
     Prop   = 'prop',

packages/debugger/src/main/utils.ts

@@ -1,5 +1,5 @@
 import {trimString} from '@solid-devtools/shared/utils'
-import {type Solid, NodeType} from './types.ts'
+import {type Node, type Solid, NodeType} from './types.ts'
 import setup from './setup.ts'
 
 export const isSolidOwner = (o: Solid.SourceMapValue | Solid.Owner | Solid.Store | Solid.Signal): o is Solid.Owner =>
@@ -76,6 +76,15 @@ export const getOwnerType = (o: Solid.Owner): NodeType => {
     return NodeType.Computation
 }
 
+export function getNode(
+    o: Solid.SourceMapValue | Solid.Signal | Solid.Owner | Solid.Store,
+): Node {
+    return {
+        kind: getNodeType(o),
+        data: o as any,
+    }
+}
+
 export const getNodeName = (o: {
     component?: ((..._: any) => any) & {displayName?: string},
     name?:      string,