Skip to content

React 19.2 dev mode breaks MST: "creation of the observable instance must be done on the initializing phase" #2279

@scottlet

Description

@scottlet

Bug report

  • I've checked documentation and searched for existing issues and discussions
  • I've made sure my project is based on the latest MST version

This is the same issue that was raised at the bottom of the conversation on #2277

Also added to the discussion here: facebook/react#35126

Describe the expected behavior

Not to error with React 19.2

Describe the observed behavior

React 19.2 introduced logComponentRender which calls addObjectDiffToProperties to deeply traverse component props/state for dev logging

This traversal accesses MST proxy objects and triggers:

  • Lazy observable initialization at the wrong lifecycle phase
  • Access to detached nodes after array/object replacement (e.g., in our basket model we do self.menu_items = cast(data.menu_items)) - the original node becomes detached and then React inspects it throwing warnings about trying to read or write to an object that is no longer part of a state tree.

Works fine in React < 19.2, breaks in 19.2.x
Only affects development mode
Stack trace shows the issue originates from
react-dom-client.development.js
→ addObjectDiffToProperties → MST proxy getters

We could potentially work around this by eg converting models to snapshots before rendering but that is a big refactor for us as we use models extensively throughout our online ordering platform.

I’m not sure this is an MST issue per-se, but maybe you could add to the React conversation if you don’t feel it’s something you should fix because I’m definitely not the only person experiencing this.

Happy to help trying to debug/test but it only happens in a few places in our code and I’ve not been able to simplify it enough to get a working sandbox example. Will continue trying

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugConfirmed bugneeds reproduction/infoNeeds more info or reproduction in order to fix it

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions