{"record":{"id":"dad4d19e25ef68a0","repo":"dotnet/aspnetcore","slug":"cannot-create-a-jsobjectreference-from-the-value","errorCode":null,"errorMessage":"Cannot create a JSObjectReference from the value '${jsObject}'.","messagePattern":"Cannot create a JSObjectReference from the value '(.+?)'\\.","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts","lineNumber":180,"sourceCode":"      if (jsObject === null || jsObject === undefined) {\n          return {\n              [jsObjectIdKey]: -1\n          };\n      }\n\n      if (jsObject && (typeof jsObject === \"object\" || jsObject instanceof Function)) {\n          cachedJSObjectsById[nextJsObjectId] = new JSObject(jsObject);\n\n          const result = {\n              [jsObjectIdKey]: nextJsObjectId\n          };\n\n          nextJsObjectId++;\n\n          return result;\n      }\n\n      throw new Error(`Cannot create a JSObjectReference from the value '${jsObject}'.`);\n  }\n\n  /**\n   * Creates a JavaScript data reference that can be passed to .NET via interop calls.\n   *\n   * @param streamReference The ArrayBufferView or Blob used to create the JavaScript stream reference.\n   * @returns The JavaScript data reference (this will be the same instance as the given object).\n   * @throws Error if the given value is not an Object or doesn't have a valid byteLength.\n   */\n  export function createJSStreamReference(streamReference: ArrayBuffer | ArrayBufferView | Blob | any): any {\n      let length = -1;\n\n      // If we're given a raw Array Buffer, we interpret it as a `Uint8Array` as\n      // ArrayBuffers' aren't directly readable.\n      if (streamReference instanceof ArrayBuffer) {\n          streamReference = new Uint8Array(streamReference);\n      }\n","sourceCodeStart":162,"sourceCodeEnd":198,"githubUrl":"https://github.com/dotnet/aspnetcore/blob/294cab2f9b2e03af6b953820c7ab497c3c8b7ad9/src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts#L162-L198","documentation":"Thrown by createJSObjectReference() in Microsoft.JSInterop.ts (line 180) when the supplied value is not null/undefined and is not an object or function. JS object references are how JS hands a live object to .NET for later invocation; only real objects/functions can be tracked by id. Primitives (strings, numbers, booleans, symbols) and BigInts cannot be wrapped, so the function throws.","triggerScenarios":"Calling DotNet.createJSObjectReference(value) (or returning a primitive from a JSInvokable method that the runtime tries to wrap) where value is a string/number/boolean/symbol/bigint. Passing a primitive where .NET expects an IJSObjectReference.","commonSituations":"Returning a raw string/number from a JS interop function whose .NET signature expects IJSObjectReference. Wrapping a primitive 'by mistake' (e.g., createJSObjectReference(someString)). Trying to pass a DOM string property as an object reference. Migration from JSON-serialized interop to object-reference interop without changing what the JS returns.","solutions":["Pass only real objects or functions to createJSObjectReference; for primitives, return them directly and let JSON serialization handle them.","If .NET expects IJSObjectReference, wrap the primitive in an object: { value: somePrimitive }.","Align the JS return type with the .NET parameter type — change the .NET signature to a primitive if you only need the value.","Add a typeof check before calling createJSObjectReference to fail with a clearer message."],"exampleFix":"// before\nconst ref = DotNet.createJSObjectReference('hello'); // throws\n\n// after\nconst ref = DotNet.createJSObjectReference({ value: 'hello' });\n// or simply return the primitive and let interop JSON-serialize it","handlingStrategy":"type-guard","validationCode":"function isWrappableObject(v: unknown): boolean {\n  return v === null || v === undefined || (typeof v === 'object') || typeof v === 'function';\n}","typeGuard":"function isJSObjectReferenceable(v: unknown): v is object | Function | null | undefined {\n  return v === null || v === undefined || typeof v === 'object' || typeof v === 'function';\n}","tryCatchPattern":null,"preventionTips":["Never pass primitives to createJSObjectReference.","Match JS return type to .NET parameter type (primitive vs IJSObjectReference).","Wrap primitives in an object if a reference is needed.","Add a typeof guard before wrapping."],"tags":["jsinterop","blazor","interop","typescript","type-mismatch"],"analyzedSha":"294cab2f9b2e03af6b953820c7ab497c3c8b7ad9","analyzedAt":"2026-08-06T20:08:02.189Z","schemaVersion":2},"datasetVersion":"2026-08-06T23:17:07.152Z"}