Immer does not work properly with arrow function getter

[Nikita Balikhin]

🐛 Bug Report

If getter in class is arrow function (or bind in constructor), it's result is not handled with immer

Link to repro

https://codesandbox.io/s/immer-arrow-bug-usfy6z

To Reproduce

Steps to reproduce the behavior:

import { produce, immerable } from "immer";

class Dictionary<K extends string, V> {
  [immerable] = true;

  private _data: Record<K, V>;

  public constructor(data: Record<K, V>) {
    this._data = data;
  }

  public get = (key: K): V | undefined => { // <-- Note arrow function here
    return this._data[key];
  };
}

const dictionary1 = new Dictionary({ "1": ["foo"] });

const dictionary2 = produce(dictionary1, (draft) => {
  draft.get("1")?.push("bar");
});

console.log(dictionary1.get("1")); // --> ["foo", "bar"]
console.log(dictionary2.get("1")); // --> ["foo", "bar"]

Observed behavior

Prints

["foo", "bar"] // <-- original mutated
["foo", "bar"]

Expected behavior

Prints

["foo"] // <-- original not mutated
["foo", "bar"]

Environment

We only accept bug reports against the latest Immer version.

• Immer version:
• I filed this report against the latest version of Immer
• Occurs with setUseProxies(true)
• Occurs with setUseProxies(false) (ES5 only)

[Michel Weststrate]

when immer drafts an object, it doesn't run the constructor again. So the function pointer between the old and new object is shared, it's the same pointer. Since you forcibly point it to the original object, that is what it will be operating upon, as that is what `this` refers to in that specific function's context.

…

On Fri, Apr 14, 2023 at 7:28 PM Nikita Balikhin ***@***.***> wrote: 🐛 Bug Report If getter in class is arrow function (or bind in constructor), it's result is not handled with immer Link to repro https://codesandbox.io/s/immer-arrow-bug-usfy6z To Reproduce Steps to reproduce the behavior: import { produce, immerable } from "immer"; class Dictionary<K extends string, V> { [immerable] = true; private _data: Record<K, V>; public constructor(data: Record<K, V>) { this._data = data; } public get = (key: K): V | undefined => { // <-- Note arrow function here return this._data[key]; };} const dictionary1 = new Dictionary({ "1": ["foo"] }); const dictionary2 = produce(dictionary1, (draft) => { draft.get("1")?.push("bar");}); console.log(dictionary1.get("1")); // --> ["foo", "bar"]console.log(dictionary2.get("1")); // --> ["foo", "bar"] Observed behavior Prints ["foo", "bar"] // <-- original mutated["foo", "bar"] Expected behavior Prints ["foo"] // <-- original not mutated["foo", "bar"] Environment We only accept bug reports against the latest Immer version. - *Immer version:* - I filed this report against the *latest* version of Immer - Occurs with setUseProxies(true) - Occurs with setUseProxies(false) (ES5 only) — Reply to this email directly, view it on GitHub <#1033>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAN4NBDNUPNCY4NZCIJF35DXBGCLHANCNFSM6AAAAAAW6WCMSU> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>