question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Support for `structuredClone`

See original GitHub issue

New DOM api structuredClone should be added.

MDN: https://developer.mozilla.org/en-US/docs/Web/API/structuredClone

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:10
  • Comments:12 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
cawa-93commented, Dec 11, 2022

This type declaration works for me:

type Cloneable<T> = T extends Function | Symbol
  ? never 
  : T extends Record<any, any> 
    ? {-readonly [k in keyof T]: Cloneable<T[k]>}
    : T

declare function structuredClone<T>(value: Cloneable<T>, options?: StructuredSerializeOptions | undefined): Cloneable<T>
  1. Return type = value type
  2. In the returned type, all fields are writable. But maybe returned type should keep readonly?
  3. Will throw a type error if the passed object at any depth contains data that cannot be cloned (function or symbol). This is most important, in my opinion.
const value = {foo: 1} as const
structuredClone(value) // { foo: 1 } Note, foo now writable

const value = {foo: 1, fn() {}} as const
structuredClone(value) // expect type error because function can't be cloned and it will throw DOMException in runtime

Playground

1reaction
GabrielDelepinecommented, Dec 8, 2022

Any chance we could get a typed return value in the future?

Something like declare function structuredClone(value: T, options?: StructuredSerializeOptions): T; ?

I know that structuredClone is not returning a strictly identical object (functions are silently removed for instance). Maybe that’s the reason to use : any here?

Read more comments on GitHub >

github_iconTop Results From Across the Web

"structuredClone" | Can I use... Support tables for ... - CanIUse
"Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
Read more >
structuredClone() - Web APIs - MDN Web Docs
The global structuredClone() method creates a deep clone of a given value using the structured ... It also supports circular references, as shown...
Read more >
Deep-copying in JavaScript using structuredClone - web.dev
Structured cloning can handle cyclical data structures, support many built-in data types and is generally more robust and often faster. However, ...
Read more >
Deep Cloning with structuredClone() in JavaScript
The global structuredClone() method creates a deep clone of a given value using the structured clone algorithm. It is compatible with all the ......
Read more >
`structuredClone()`: deeply copying objects in JavaScript - 2ality
structuredClone () is a new function that will soon be supported by most browsers, Node.js and Deno. It creates deep copies of objects....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found