Passing a value to structuredClone() or postMessage() can fail with a DOMException named DataCloneError. Which kinds of values cause that, and which values are copied but come back changed?

## The two failure modes When a value crosses a structured-clone boundary — `structuredClone()`, `postMessage`, an IndexedDB write, `history.pushState` — one of three things happens. It clones faithfully, it clones but loses something, or it throws. Knowing which bucket a value falls into is the whole skill here, because the second bucket is where the production bugs live. ## Bucket one: throws DataCloneError The algorithm's serialize step raises a `DOMException` whose `name` is `"DataCloneError"` for anything it does not recognise. The call fails as a unit — there is no half-written clone and no partial message delivered. - **Functions.** Any function reachable from the graph, at any depth. This is the most common cause in real code, and it is rarely a top-level function: it is `this.onDone = () => {...}` assigned in a constructor, or a `toString` override attached as an own property. - **Symbols as values.** `{ tag: Symbol('x') }` throws. Note the asymmetry with symbol *keys* below. - **DOM nodes.** `Element`, `Node`, `Document` — none are serializable. Passing an element to a worker is the classic first attempt and the classic first `DataCloneError`. - **`Promise`, `WeakMap`, `WeakSet`.** Their contents cannot be meaningfully reconstructed elsewhere. - **Proxies.** A proxy has no internal slots the algorithm can inspect, so it throws even when the target is a plain object. - **Detached `ArrayBuffer`s.** A buffer already transferred away is unusable and throws. ```js try { structuredClone({ onDone: () => {} }); } catch (err) { console.log(err instanceof DOMException, err.name); // true "DataCloneError" } ``` A related trap: because the algorithm reads properties, a getter that throws will propagate *its own* exception out of the clone call, which is not a `DataCloneError` at all. Check `err.name` rather than assuming. ## Bucket two: clones, but changed These are silent and therefore worse. **Prototypes are not preserved.** The deserialize step builds ordinary objects. A `class User` instance arrives with `Object.prototype` as its prototype, so `clone instanceof User` is `false` and every prototype method is missing. The same applies to a custom `Error` subclass: `Error` and the standard subclasses are cloneable, carrying `name`, `message` and `cause`, but `class HttpError extends Error` comes back as a plain `Error`. The `stack` property is implementation-defined and should not be relied on. **Only own enumerable string-keyed properties survive.** The algorithm enumerates own enumerable string keys and copies those. So a property defined with `enumerable: false` is dropped, and a symbol-keyed property is dropped — quietly, unlike a symbol *value*, which throws. **Accessors are flattened.** A getter is invoked exactly once during serialization and its returned value is stored as a plain data property. The clone therefore holds a snapshot: a getter that computed `Date.now()` now holds a fixed number, and a setter is gone entirely. Any lazily-computed or derived state stops being derived. ```js const obj = { plain: 1 }; Object.defineProperty(obj, 'hidden', { value: 2, enumerable: false }); Object.defineProperty(obj, 'computed', { get: () => 42, enumerable: true }); obj[Symbol('meta')] = 'gone'; const c = structuredClone(obj); console.log(c.hidden, c.computed, Object.getOwnPropertySymbols(c).length); // undefined 42 0 ``` **A `RegExp` keeps source and flags but not `lastIndex`.** Fine for most uses, surprising for a stateful global regex. ## How to debug one in practice Browsers name the offending value in the exception message, but not always its path in the graph. The reliable technique is to reduce: clone the suspect object's branches one at a time, or write a small walker that tries `structuredClone` on each leaf and reports the first path that throws. In the long run, prevention beats debugging — define an explicit plain-data shape for anything that crosses a boundary and build it deliberately rather than handing over whatever object you happen to be holding. ## Why the design is this way The rules are not arbitrary. The receiving side may be a different thread, a different document, or a database file read back tomorrow — there is no shared heap and no shared code. A function's closure cannot be reconstructed there, a DOM node belongs to one document's tree, and a class's prototype only exists if the receiver happens to have loaded the same class definition. The algorithm copies *data*, never *behaviour or identity*, and every rule above follows from that single line.