devtool doesn't show value of getter

[lake2]

class State {
    spinning = false;

    get number() {
        return this.spinning ? 1 : 0;
    }

    toggle() {
        this.spinning = !this.spinning;
    }
}

const state_3 = proxy(new State());

const Count: React.FC = React.memo(function Count(props) {
    return (
        <div>
            <button onClick={() => state_3.toggle()}>start 3</button>
            <div>{snap3.number}</div>
        </div>
    );
});

state

diff

[dai-shi]

Thanks for reporting.

Class getters are not own properties, and it's not handled by snapshot(). It's by design.

An easy workaround is to use object getters.

const state_3 = proxy({
  spinning: false,
  get number() {
    return this.spinning ? 1 : 0;
  },
  toggle() {
    this.spinning = !this.spinning;
  },
});

Or maybe coping prototype after instantiating a class...

There might be a devtool specific solution, but that would be fairly complicated and not very maintainable.

[lake2]

thanks