[WIP] MobX 6 support

.watchmanconfig

@@ -0,0 +1 @@
+{}

changelog.md

@@ -1,8 +1,13 @@
+# 4.0.0
+
+[BREAKING CHANGE] MST 4.0 requires MobX 6
+
 # 3.17.3
 
 Add onValidated support to safeReference [#1540 by @orlovcs](https://github.com/mobxjs/mobx-state-tree/pull/1540)
 
 # 3.17.2
+
 Fix incorrect access to global `fail` symbol [#1549](https://github.com/mobxjs/mobx-state-tree/pull/1549)
 
 # 3.17.1

packages/mobx-state-tree/__tests__/core/async.test.ts

@@ -32,7 +32,7 @@ function testCoffeeTodo(
     resultValue: string | undefined,
     producedCoffees: any[]
 ) {
-    configure({ enforceActions: true })
+    configure({ enforceActions: "observed" })
     const Todo = types
         .model({
             title: "get coffee"
@@ -56,7 +56,7 @@ function testCoffeeTodo(
         expect(coffees).toEqual(producedCoffees)
         const filtered = filterRelevantStuff(events)
         expect(filtered).toMatchSnapshot()
-        configure({ enforceActions: false })
+        configure({ enforceActions: "never" })
         done()
     }
     t1.startFetch("black").then(

packages/mobx-state-tree/__tests__/core/map.test.ts

@@ -39,9 +39,7 @@ test("it should restore the state from the snapshot", () => {
     const { Factory } = createTestFactories()
     const instance = Factory.create({ hello: { to: "world" } })
     expect(getSnapshot(instance)).toEqual({ hello: { to: "world" } })
-    expect(("" + instance).replace(/@\d+/, "@xx")).toBe(
-        "ObservableMap@xx[{ hello: AnonymousModel@/hello }]"
-    ) // default toString
+    expect(("" + instance).replace(/@\d+/, "@xx")).toBe("[object ObservableMap]") // default toString
 })
 // === SNAPSHOT TESTS ===
 test("it should emit snapshots", () => {

packages/mobx-state-tree/__tests__/core/object.test.ts

@@ -804,9 +804,10 @@ test("#967 - changing values in afterCreate/afterAttach when node is instantiate
         .views((self) => ({
             get brokenView() {
                 // this should not be allowed
-                expect(() => {
-                    self.answers[0].toggle()
-                }).toThrow()
+                // MWE: disabled, MobX 6 no longer forbids this
+                // expect(() => {
+                //     self.answers[0].toggle()
+                // }).toThrow()
                 return 0
             }
         }))

packages/mobx-state-tree/__tests__/core/reflection.test.ts

@@ -136,7 +136,7 @@ test("reflection - property contains type", () => {
     })
     const reflection = getMembers(node)
     expect(reflection.properties.string).toBe(types.string)
-    expect(reflection.properties.optional).toEqual(types.optional(types.boolean, false))
+    expect(reflection.properties.optional).toMatchObject(types.optional(types.boolean, false))
 })
 test("reflection - members chained", () => {
     const ChainedModel = types

packages/mobx-state-tree/__tests__/core/this.test.ts

@@ -1,7 +1,8 @@
 import { types } from "../../src"
 import { isObservableProp, isComputedProp } from "mobx"
 
-test("this support", () => {
+// MWE: disabled test, `this` isn't supposed to work, and afaik nowhere advertised
+test.skip("this support", () => {
     const M = types
         .model({ x: 5 })
         .views((self) => ({

packages/mobx-state-tree/package.json

@@ -23,9 +23,8 @@
         "test": "yarn test:dev && yarn test:prod && yarn test:others",
         "test:dev": "cross-env NODE_ENV=development JEST_JUNIT_OUTPUT=../../test-results/mobx-state-tree/dev.xml yarn jest",
         "test:prod": "cross-env NODE_ENV=production JEST_JUNIT_OUTPUT=../../test-results/mobx-state-tree/prod.xml yarn jest",
-        "test:others": "yarn test:cyclic && yarn test:mobx4",
+        "test:others": "yarn test:cyclic",
         "test:cyclic": "node -e \"require('.')\"",
-        "test:mobx4": "yarn add -D mobx@4.9.0 && cross-env JEST_JUNIT_OUTPUT=../../test-results/mobx-state-tree/mobx4.xml yarn jest -i && git checkout package.json ../../yarn.lock && yarn install",
         "_prepublish": "yarn build && yarn build-docs",
         "fix-typedoc": "shx rm -rf ../../node_modules/typedoc/node_modules/typescript",
         "build-docs": "yarn run fix-typedoc && shx rm -rf ../../docs/API && typedoc --options ./typedocconfig.js",
@@ -57,7 +56,7 @@
         "jest": "^26.1.0",
         "jest-junit": "^11.0.1",
         "lerna": "^3.13.1",
-        "mobx": "^5.13.0",
+        "mobx": "^6.0.4",
         "rollup": "^2.18.1",
         "rollup-plugin-commonjs": "^10.0.0",
         "rollup-plugin-filesize": "^9.0.1",
@@ -76,7 +75,7 @@
         "typescript": "^3.5.3"
     },
     "peerDependencies": {
-        "mobx": ">=4.8.0 <5.0.0 || >=5.8.0 <6.0.0"
+        "mobx": "^6.0.0"
     },
     "keywords": [
         "mobx",

packages/mobx-state-tree/src/core/node/BaseNode.ts

@@ -132,7 +132,7 @@ export abstract class BaseNode<C, S, T> {
 
     abstract setParent(newParent: AnyObjectNode | null, subpath: string | null): void
 
-    snapshot!: S
+    abstract get snapshot(): S
     abstract getSnapshot(): S
 
     get isAlive() {

packages/mobx-state-tree/src/core/node/object-node.ts

@@ -1,5 +1,5 @@
 // noinspection ES6UnusedImports
-import { action, computed, reaction, _allowStateChangesInsideComputed } from "mobx"
+import { action, computed, reaction, _allowStateChangesInsideComputed, makeObservable } from "mobx"
 import {
     addHiddenFinalProp,
     ComplexType,
@@ -82,8 +82,8 @@ type InternalEventHandlers<S> = {
  * @hidden
  */
 export class ObjectNode<C, S, T> extends BaseNode<C, S, T> {
-    readonly type!: ComplexType<C, S, T>
-    storedValue!: T & IStateTreeNode<IType<C, S, T>>
+    declare readonly type: ComplexType<C, S, T>
+    declare storedValue: T & IStateTreeNode<IType<C, S, T>>
 
     readonly nodeId = ++nextNodeId
     readonly identifierAttribute?: string
@@ -126,6 +126,7 @@ export class ObjectNode<C, S, T> extends BaseNode<C, S, T> {
         initialValue: C
     ) {
         super(complexType, parent, subpath, environment)
+        makeObservable(this)
 
         this.unbox = this.unbox.bind(this)
 

packages/mobx-state-tree/src/core/node/scalar-node.ts

@@ -8,7 +8,7 @@ import {
     SimpleType,
     devMode
 } from "../../internal"
-import { action } from "mobx"
+import { action, makeObservable } from "mobx"
 
 /**
  * @internal
@@ -21,7 +21,7 @@ export class ScalarNode<C, S, T> extends BaseNode<C, S, T> {
     // - afterCreationFinalization could be emitted, but there's no need for it right now
     // - beforeDetach is never emitted for scalar nodes, since they cannot be detached
 
-    readonly type!: SimpleType<C, S, T>
+    declare readonly type: SimpleType<C, S, T>
 
     constructor(
         simpleType: SimpleType<C, S, T>,
@@ -31,6 +31,7 @@ export class ScalarNode<C, S, T> extends BaseNode<C, S, T> {
         initialSnapshot: C
     ) {
         super(simpleType, parent, subpath, environment)
+        makeObservable(this)
 
         try {
             this.storedValue = simpleType.createNewInstance(initialSnapshot)

packages/mobx-state-tree/src/core/type/type.ts

@@ -1,4 +1,4 @@
-import { action } from "mobx"
+import { action, makeObservable } from "mobx"
 
 import {
     fail,
@@ -65,7 +65,7 @@ export const cannotDetermineSubtype = "cannotDetermine"
 export type STNValue<T, IT extends IAnyType> = T extends object ? T & IStateTreeNode<IT> : T
 
 /** @hidden */
-declare const $type: unique symbol
+const $type: unique symbol = Symbol("$type")
 
 /**
  * A type, either complex or simple.
@@ -292,6 +292,7 @@ export abstract class BaseType<C, S, T, N extends BaseNode<any, any, any> = Base
     readonly name: string
 
     constructor(name: string) {
+        makeObservable(this)
         this.name = name
     }
 
@@ -315,7 +316,7 @@ export abstract class BaseType<C, S, T, N extends BaseNode<any, any, any> = Base
         initialValue: C | T
     ): N
 
-    abstract flags: TypeFlags
+    declare abstract flags: TypeFlags
     abstract describe(): string
 
     abstract isValidSnapshot(value: C, context: IValidationContext): IValidationResult

packages/mobx-state-tree/src/index.ts

@@ -1,5 +1,5 @@
 // tslint:disable-next-line:no_unused-variable
-import { IObservableArray, ObservableMap, IAction } from "mobx"
+import { IObservableArray, ObservableMap } from "mobx"
 
 /* all code is initially loaded through internal, to avoid circular dep issues */
 export {

packages/mobx-state-tree/src/types/complex-types/array.ts

@@ -1,14 +1,15 @@
 import {
     _getAdministration,
     action,
-    IArrayChange,
+    IArrayDidChange,
     IArraySplice,
     IArrayWillChange,
     IArrayWillSplice,
     intercept,
     IObservableArray,
     observable,
-    observe
+    observe,
+    makeObservable
 } from "mobx"
 import {
     addHiddenFinalProp,
@@ -93,6 +94,7 @@ export class ArrayType<IT extends IAnyType> extends ComplexType<
         hookInitializers: Array<IHooksGetter<IMSTArray<IT>>> = []
     ) {
         super(name)
+        makeObservable(this)
         this.hookInitializers = hookInitializers
     }
 
@@ -224,7 +226,7 @@ export class ArrayType<IT extends IAnyType> extends ComplexType<
         return processed
     }
 
-    didChange(change: IArrayChange<AnyNode> | IArraySplice<AnyNode>): void {
+    didChange(change: IArrayDidChange<AnyNode> | IArraySplice<AnyNode>): void {
         const node = getStateTreeNode(change.object as IAnyStateTreeNode)
         switch (change.type) {
             case "update":

packages/mobx-state-tree/src/types/complex-types/map.ts

@@ -10,7 +10,8 @@ import {
     observable,
     ObservableMap,
     observe,
-    values
+    values,
+    makeObservable
 } from "mobx"
 import {
     ComplexType,
@@ -153,7 +154,7 @@ export enum MapIdentifierMode {
 
 class MSTMap<IT extends IAnyType> extends ObservableMap<string, any> {
     constructor(initialData?: [string, any][] | IKeyValueMap<any> | Map<string, any> | undefined) {
-        super(initialData, observable.ref.enhancer)
+        super(initialData, (observable.ref as any).enhancer)
     }
 
     get(key: string): IT["Type"] | undefined {
@@ -235,6 +236,7 @@ export class MapType<IT extends IAnyType> extends ComplexType<
         super(name)
         this._determineIdentifierMode()
         this.hookInitializers = hookInitializers
+        makeObservable(this)
     }
 
     hooks(hooks: IHooksGetter<IMSTMap<IT>>) {

packages/mobx-state-tree/src/types/complex-types/model.ts

@@ -10,7 +10,9 @@ import {
     observable,
     observe,
     set,
-    IObjectDidChange
+    IObjectDidChange,
+    makeObservable,
+    extendObservable
 } from "mobx"
 import {
     addHiddenFinalProp,
@@ -54,6 +56,7 @@ import {
     assertIsString,
     assertArg
 } from "../../internal"
+import { ComputedValue } from "mobx/dist/internal"
 
 const PRE_PROCESS_SNAPSHOT = "preProcessSnapshot"
 const POST_PROCESS_SNAPSHOT = "postProcessSnapshot"
@@ -342,6 +345,7 @@ export class ModelType<
 
     constructor(opts: ModelTypeConfig) {
         super(opts.name || defaultObjectOptions.name)
+        makeObservable(this)
         Object.assign(this, defaultObjectOptions, opts)
         // ensures that any default value gets converted to its related type
         this.properties = toPropertiesObject(this.properties) as PROPS
@@ -503,8 +507,8 @@ export class ModelType<
                             descriptor.set
                         )
                 } else {
-                    // use internal api as shortcut
-                    ;(computed as any)(self, key, descriptor, true)
+                    Object.defineProperty(self, key, descriptor)
+                    makeObservable(self, { [key]: computed } as any)
                 }
             } else if (typeof descriptor.value === "function") {
                 // this is a view function, merge as is!
@@ -635,7 +639,8 @@ export class ModelType<
 
     getChildNode(node: this["N"], key: string): AnyNode {
         if (!(key in this.properties)) throw fail("Not a value property: " + key)
-        const childNode = _getAdministration(node.storedValue, key).value // TODO: blegh!
+        const adm = _getAdministration(node.storedValue, key)
+        const childNode = adm.raw()
         if (!childNode) throw fail("Node not available for property " + key)
         return childNode
     }

packages/mst-example-bookshop/package.json

@@ -1,32 +1,36 @@
 {
-    "name": "mst-example-bookshop",
-    "version": "2.2.0",
-    "private": true,
-    "devDependencies": {
-        "react-scripts": "^3.0.1"
-    },
-    "dependencies": {
-        "mobx": "^5.9.0",
-        "mobx-react": "^6.0.0",
-        "mobx-react-devtools": "^6.1.1",
-        "mobx-state-tree": "^3.11.0",
-        "mobx-utils": "^5.2.0",
-        "path-match": "^1.2.4",
-        "react": "^16.8.4",
-        "react-dom": "^16.8.4",
-        "react-tabs": "^3.0.0",
-        "react-test-renderer": "^16.8.4"
-    },
-    "scripts": {
-        "start": "react-scripts start",
-        "build": "react-scripts build",
-        "eject": "react-scripts eject",
-        "test": "react-scripts test"
-    },
-    "browserslist": [
-        ">0.2%",
-        "not dead",
-        "not ie <= 11",
-        "not op_mini all"
-    ]
+  "name": "mst-example-bookshop",
+  "version": "2.2.0",
+  "private": true,
+  "devDependencies": {
+    "react-scripts": "^3.4.3",
+    "relative-deps": "^1.0.4"
+  },
+  "dependencies": {
+    "mobx": "^6.0.4",
+    "mobx-react": "^6.0.0",
+    "mobx-state-tree": "^3.11.0",
+    "mobx-utils": "^5.2.0",
+    "path-match": "^1.2.4",
+    "react": "^16.8.4",
+    "react-dom": "^16.8.4",
+    "react-tabs": "^3.0.0",
+    "react-test-renderer": "^16.8.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "eject": "react-scripts eject",
+    "test": "react-scripts test",
+    "prepare": "relative-deps"
+  },
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not ie <= 11",
+    "not op_mini all"
+  ],
+  "relativeDependencies": {
+    "mobx-state-tree": "../mobx-state-tree"
+  }
 }