TypeError Cannot read property 'notifyDied' of undefined

[aniket-banyal]

I have a TaskModel and a TaskStore which contains - overdue, due and completed tasks

const TaskModel = types
  .model('TaskModel', {
    id: types.identifierNumber,
    title: types.maybeNull(types.string),
    description: types.maybeNull(types.string),
    due_datetime: types.maybeNull(types.string),
    completed_at: types.maybeNull(types.string),
    contacts: types.maybeNull(
      types.optional(
        types.array(
          types.frozen({
            id: types.string,
            first_name: types.maybeNull(types.string),
            middle_name: types.maybeNull(types.string),
            last_name: types.maybeNull(types.string),
          }),
        ),
        [],
      ),
    ),
  })
  .actions(withSetPropAction)
  .actions((self) => ({
    async markAsCompleted() {
      const response = await api.updateTask(self.id, {
        completed_at: new Date().toISOString(),
      });
      if (response.kind === 'ok') {
        self.setProp('completed_at', new Date().toISOString());
      }
    },
  }));

  
const TaskDataModel = types
  .model('TaskData', {
    tasks: types.array(TaskModel),
    page: types.number,
    hasMore: types.boolean,
    loading: types.boolean,
    count: types.number,
  })

const taskInitialData = {
  tasks: [],
  page: 1,
  hasMore: true,
  loading: false,
  count: 0,
};

const TasksStoreModel = types
  .model('Tasks')
  .props({
    overdueTasksData: types.optional(TaskDataModel, taskInitialData),
    dueTasksData: types.optional(TaskDataModel, taskInitialData),
    completedTasksData: types.optional(TaskDataModel, taskInitialData),
  })
  .actions((store) => ({
    markTaskAsCompleted(task: Task) {
      if (isAlive(task)) detach(task);
      else {
        task = TaskModel.create(task);
      }

      store.completedTasksData.tasks.unshift(task);
      store.completedTasksData.count += 1;
    },
  }));

  
const RootStoreModel = types
  .model('RootStore')
  .props({
    contactsStore: types.optional(ContactsStoreModel, {}),
    activityLogStore: types.optional(ActivityLogStoreModel, {}),
    notificationStore: types.optional(NotificationsStoreModel, {}),
    webhooksStore: types.optional(WebhooksStoreModel, {}),
    facebookStore: types.optional(FacebookStoreModel, {}),
    taskStore: types.optional(tasksStoreModel, {}),
  })
  .actions((self) => ({
    reset() {
      self.contactsStore = ContactsStoreModel.create({});
      self.activityLogStore = ActivityLogStoreModel.create({});
      self.notificationStore = NotificationsStoreModel.create({});
      self.webhooksStore = WebhooksStoreModel.create({});
      self.facebookStore = FacebookStoreModel.create({});
      self.taskStore = tasksStoreModel.create({});
    },
  }));

On logout, the stores are reset, but in production sentry reported an error for line - self.taskStore = tasksStoreModel.create({});

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'TaskModel', Path upon death: '/taskStore/dueTasksData/tasks/12', Subpath: '', Action: '/taskStore/dueTasksData/tasks/12.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'frozen[]', Path upon death: '/taskStore/dueTasksData/tasks/12/contacts', Subpath: '', Action: '/taskStore/dueTasksData/tasks/12/contacts.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'TaskModel', Path upon death: '/taskStore/dueTasksData/tasks/13', Subpath: '', Action: '/taskStore/dueTasksData/tasks/13.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'frozen[]', Path upon death: '/taskStore/dueTasksData/tasks/13/contacts', Subpath: '', Action: '/taskStore/dueTasksData/tasks/13/contacts.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

...

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'TaskModel', Path upon death: '/taskStore/dueTasksData/tasks/27', Subpath: '', Action: '/taskStore/dueTasksData/tasks/27.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'frozen[]', Path upon death: '/taskStore/dueTasksData/tasks/27/contacts', Subpath: '', Action: '/taskStore/dueTasksData/tasks/27/contacts.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

...

TypeError: Cannot read property 'notifyDied' of undefined

[coolsoftwaretyler]

Hey @Dummy26 - I have two different hypotheses:

Nodes being modified after an asynchronous task loses a race condition

I adapted your code to a minimum reproducible example here, where you can see the reset action works fine on its own, but with an artificially long async action that comes back after a second reset, we get similar errors:

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'TaskModel', Path upon death: '/taskStore/overdueTasksData/tasks/0', Subpath: 'completed_at', Action: '/taskStore/overdueTasksData/tasks/0.setCompletedAt()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Calling an action on a detached node

However, that error message I found reads differently than what you posted. Based on the errors you're seeing, it looks like something in your application is calling reset on Task objects and Contact objects:

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'TaskModel', Path upon death: '/taskStore/dueTasksData/tasks/12', Subpath: '', Action: '/taskStore/dueTasksData/tasks/12.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

Error: [mobx-state-tree] You are trying to read or write to an object that is no longer part of a state tree. (Object type: 'frozen[]', Path upon death: '/taskStore/dueTasksData/tasks/12/contacts', Subpath: '', Action: '/taskStore/dueTasksData/tasks/12/contacts.reset()'). Either detach nodes first, or don't use objects after removing / replacing them in the tree.

I don't see a reset action on anything other than your RootStoreModel, but is it possible you've got some code that's working with items that have been detached, since you detach tasks in markTaskAsCompleted?

Let me know if either of those ideas are helpful. If not, it might be good to see more usage examples, or see if you can boil your code down to a minimum reproducible example as well to provide more context.

[aniket-banyal]

There is no reset action present on task or contact objs, and nowhere in my code is such a function being called (except for RootStore)
As of now I haven't been able to reproduce this in my codebase, will update if I find something.

[coolsoftwaretyler]

Can you share more of the stack trace? This seems strange to me if you only call reset on the root store object:

Action: '/taskStore/dueTasksData/tasks/12.reset()').

Something must be calling task.reset() on a Task item with ID of 12 here to see that. Any use of applyAction` in the codebase that might be calling it where you don't expect it to be?

[aniket-banyal]

There is no use of applyAction and no reset call other than on RootStore.
Here's the stack trace

TypeError: Cannot read property 'notifyDied' of undefined
  at value(app:///index.android.bundle:1:989067)
  at anonymous(app:///index.android.bundle:1:989123)
  at forEach(native)
  at value(app:///index.android.bundle:1:989050)
  at anonymous(app:///index.android.bundle:1:989123)
  at forEach(native)
  at value(app:///index.android.bundle:1:989050)
  at value(app:///index.android.bundle:1:988912)
  at apply(native)
  at executeAction(app:///index.android.bundle:1:1032357)
  at value(app:///index.android.bundle:1:1032308)
  at value(app:///index.android.bundle:1:991924)
  at value(app:///index.android.bundle:1:1014713)
  at value(app:///index.android.bundle:1:1009293)
  at interceptChange(app:///index.android.bundle:1:1042802)
  at setObservablePropValue_(app:///index.android.bundle:1:1062135)
  at set_(app:///index.android.bundle:1:1062528)
  at set(app:///index.android.bundle:1:1052783)
  at reset(app:///index.android.bundle:1:954590)
  at apply(native)
  at executeAction(app:///index.android.bundle:1:1032357)
  at bound reset(app:///index.android.bundle:1:1032308)
  at apply(native)
  at runMiddleWares(app:///index.android.bundle:1:968083)
  at runWithActionContext(app:///index.android.bundle:1:967544)
  at res(app:///index.android.bundle:1:967842)
  at ?anon_0_(app:///index.android.bundle:1:2089393)
  at next(native)
  at asyncGeneratorStep(app:///index.android.bundle:1:429097)
  at _next(app:///index.android.bundle:1:429367)
  at tryCallOne(app:///index.android.bundle:1:194647)
  at anonymous(app:///index.android.bundle:1:195323)
  at apply(native)
  at anonymous(app:///index.android.bundle:1:204941)
  at _callTimer(app:///index.android.bundle:1:203938)
  at _callReactNativeMicrotasksPass(app:///index.android.bundle:1:204102)
  at callReactNativeMicrotasks(app:///index.android.bundle:1:206004)
  at __callReactNativeMicrotasks(app:///index.android.bundle:1:188539)
  at anonymous(app:///index.android.bundle:1:187678)
  at __guard(app:///index.android.bundle:1:188416)
  at flushedQueue(app:///index.android.bundle:1:187589)
  at invokeCallbackAndReturnFlushedQueue(app:///index.android.bundle:1:187532)