Mobx-state-tree: TypeError: _this.subType.validate is not a function

Created on 31 Oct 2018 · 3Comments · Source: mobxjs/mobx-state-tree

_Bug report_

[x ] I've checked documentation and searched for existing issues
[x ] I've made sure my project is based on the latest MST version
[ ] Fork this code sandbox or another minimal reproduction.

Type types.maybe(types.map(types.frozen)) gives me an error TypeError: _this.subType.validate is not a function. I'm trying trying to initiliaze property with JSON object.

Full error log:

Uncaught TypeError: _this.subType.validate is not a function
    at mobx-state-tree.module.js:3634
    at Array.map (<anonymous>)
    at MapType$$1.isValidSnapshot (mobx-state-tree.module.js:3633)
    at MapType$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at Union$$1.isValidSnapshot (mobx-state-tree.module.js:5149)
    at Union$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at mobx-state-tree.module.js:4501
    at Array.map (<anonymous>)
    at ModelType$$1.isValidSnapshot (mobx-state-tree.module.js:4500)
    at ModelType$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at typecheck$$1 (mobx-state-tree.module.js:2393)
    at typecheckInternal$$1 (mobx-state-tree.module.js:2379)
    at ModelType$$1.ComplexType$$1.create (mobx-state-tree.module.js:1629)
    at executeAction$$1 (mobx.module.js:646)
    at ModelType$$1.res (mobx.module.js:635)
    at new StudyModuleListView (StudyModuleListView.js:48)
    at constructClassInstance (react-dom.development.js:12221)
    at updateClassComponent (react-dom.development.js:14058)
    at beginWork (react-dom.development.js:14687)
    at performUnitOfWork (react-dom.development.js:17242)
    at workLoop (react-dom.development.js:17281)
    at HTMLUnknownElement.callCallback (react-dom.development.js:144)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:193)
    at invokeGuardedCallback (react-dom.development.js:243)
    at replayUnitOfWork (react-dom.development.js:16536)
    at renderRoot (react-dom.development.js:17374)
    at performWorkOnRoot (react-dom.development.js:18252)
    at performWork (react-dom.development.js:18159)
    at performSyncWork (react-dom.development.js:18132)
    at interactiveUpdates$1 (react-dom.development.js:18442)
    at interactiveUpdates (react-dom.development.js:2320)
    at dispatchInteractiveEvent (react-dom.development.js:5130)
index.js:1452 The above error occurred in the <StudyModuleListView> component:
    in StudyModuleListView (created by inject-StudyModuleListView-with-studyModuleListStore)
    in inject-StudyModuleListView-with-studyModuleListStore (created by inject-inject-StudyModuleListView-with-studyModuleListStore-with-studyYearListStore)
    in inject-inject-StudyModuleListView-with-studyModuleListStore-with-studyYearListStore (at App.js:62)
    in div (created by Container)
    in Container (at Content.js:12)
    in Content (at MainLayout.js:99)
    in main (at MainLayout.js:97)
    in MainLayout (at App.js:61)
    in Route (at App.js:60)
    in Switch (at App.js:34)
    in Router (created by BrowserRouter)
    in BrowserRouter (at App.js:33)
    in App (created by inject-App-with-authStore)
    in inject-App-with-authStore (at src/index.js:45)
    in Provider (at src/index.js:39)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
function.console.(anonymous function) @ index.js:1452
react-dom.development.js:18221 Uncaught TypeError: _this.subType.validate is not a function
    at mobx-state-tree.module.js:3634
    at Array.map (<anonymous>)
    at MapType$$1.isValidSnapshot (mobx-state-tree.module.js:3633)
    at MapType$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at Union$$1.isValidSnapshot (mobx-state-tree.module.js:5149)
    at Union$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at mobx-state-tree.module.js:4501
    at Array.map (<anonymous>)
    at ModelType$$1.isValidSnapshot (mobx-state-tree.module.js:4500)
    at ModelType$$1.ComplexType$$1.validate (mobx-state-tree.module.js:1656)
    at typecheck$$1 (mobx-state-tree.module.js:2393)
    at typecheckInternal$$1 (mobx-state-tree.module.js:2379)
    at ModelType$$1.ComplexType$$1.create (mobx-state-tree.module.js:1629)
    at executeAction$$1 (mobx.module.js:646)
    at ModelType$$1.res (mobx.module.js:635)
    at new StudyModuleListView (StudyModuleListView.js:48)
    at constructClassInstance (react-dom.development.js:12221)
    at updateClassComponent (react-dom.development.js:14058)
    at beginWork (react-dom.development.js:14687)
    at performUnitOfWork (react-dom.development.js:17242)
    at workLoop (react-dom.development.js:17281)
    at renderRoot (react-dom.development.js:17359)
    at performWorkOnRoot (react-dom.development.js:18252)
    at performWork (react-dom.development.js:18159)
    at performSyncWork (react-dom.development.js:18132)
    at interactiveUpdates$1 (react-dom.development.js:18442)
    at interactiveUpdates (react-dom.development.js:2320)
    at dispatchInteractiveEvent (react-dom.development.js:5130)

not a bug

Source

tahv0

Most helpful comment

works (most probably you were not using types.frozen as a function):

import {types} from "mobx-state-tree"

// NOTE: frozen now is a function since v3!
const Store = types.map(types.frozen());

const store = Store.create({
  "a": {hi: 4}
})

console.log(store.get("a"));
// prints "{hi: 4}"

https://codesandbox.io/s/o7m3nm33v9

xaviergonz on 31 Oct 2018

👍2

All 3 comments

works (most probably you were not using types.frozen as a function):

import {types} from "mobx-state-tree"

// NOTE: frozen now is a function since v3!
const Store = types.map(types.frozen());

const store = Store.create({
  "a": {hi: 4}
})

console.log(store.get("a"));
// prints "{hi: 4}"

https://codesandbox.io/s/o7m3nm33v9

xaviergonz on 31 Oct 2018

👍2

just updated the readme btw, it was outdated with how it worked in v2

xaviergonz on 31 Oct 2018