using ts disposable

.changeset/sixty-frogs-doubt.md

@@ -0,0 +1,5 @@
+---
+"mobx": minor
+---
+
+add `_action` helper to use with ts disposables

docs/actions.md

@@ -142,6 +142,21 @@ runInAction(() => {
 })
 ```
 
+<!--using _ = _action();-->
+
+```javascript
+import { observable, runInAction } from "mobx"
+
+const state = observable({ value: 0 })
+
+{
+  using _ = _action();
+  state.value++
+  state.value++
+}
+
+```
+
 <!--END_DOCUSAURUS_CODE_TABS-->
 
 ## Wrapping functions using `action`
@@ -220,6 +235,16 @@ Usage:
 Use this utility to create a temporary action that is immediately invoked. Can be useful in asynchronous processes.
 Check out the [above code block](#examples) for an example.
 
+## `_action()`
+
+Usage:
+
+-   ` using _ = _action();`
+
+Use this utility to create a temporary action. Can be useful in asynchronous processes.
+Behaves the same as `runInAction` but ends action after leaving current block scope.
+Check out the [above code block](#examples) for an example.
+
 ## Actions and inheritance
 
 Only actions defined **on prototype** can be **overridden** by subclass:

package.json

@@ -6,7 +6,7 @@
     ],
     "resolutions": {
         "jest": "^29.5.0",
-        "typescript": "^5.0.2",
+        "typescript": "5.2.2",
         "recast": "^0.23.1"
     },
     "repository": {
@@ -41,8 +41,8 @@
         "@types/prop-types": "^15.5.2",
         "@types/react": "^18.0.0",
         "@types/react-dom": "^18.0.0",
-        "@typescript-eslint/eslint-plugin": "^5.0.0",
-        "@typescript-eslint/parser": "^5.0.0",
+        "@typescript-eslint/eslint-plugin": "6",
+        "@typescript-eslint/parser": "^6",
         "coveralls": "^3.1.0",
         "eslint": "^6.8.0",
         "execa": "^4.1.0",
@@ -68,7 +68,7 @@
         "tape": "^5.0.1",
         "ts-jest": "^29.0.5",
         "tsdx": "^0.14.1",
-        "typescript": "^5.0.2"
+        "typescript": "^5.2.2"
     },
     "husky": {
         "hooks": {

packages/mobx/__tests__/v5/base/_action.ts

@@ -0,0 +1,61 @@
+import { _action } from "../../../src/internal"
+import * as mobx from "../../../src/mobx"
+
+
+// polyfill Symbbol.dispose for tests
+if (typeof Symbol.dispose !== "symbol") {
+    Object.defineProperty(Symbol, "dispose", {
+        configurable: false,
+        enumerable: false,
+        writable: false,
+        value: Symbol.for("dispose")
+    })
+}
+if (typeof Symbol.asyncDispose !== "symbol"){
+    Object.defineProperty(Symbol, "asyncDispose", {
+        configurable: false,
+        enumerable: false,
+        writable: false,
+        value: Symbol.for("asyncDispose")
+    })
+}
+
+test("runInAction", () => {
+    mobx.configure({ enforceActions: "observed" })
+    const values = [] as any[]
+    const events = [] as any[]
+    const spyDisposer = mobx.spy(ev => {
+        if (ev.type === "action")
+            events.push({
+                name: ev.name,
+                arguments: ev.arguments
+            })
+    })
+
+    const observable = mobx.observable.box(0)
+    const d = mobx.autorun(() => values.push(observable.get()))
+
+    {
+        using _ = _action();
+        observable.set(observable.get() + 6 * 2)
+        observable.set(observable.get() - 3) // oops
+    }
+    expect(values).toEqual([0, 9])
+
+    {
+        using _ = _action();
+        observable.set(observable.get() + 5 * 2)
+        observable.set(observable.get() - 4) // oops
+    }
+
+    expect(values).toEqual([0, 9, 15])
+    expect(events).toEqual([
+        { arguments: [], name: "<unnamed action>" },
+        { arguments: [], name: "<unnamed action>" }
+    ])
+
+    mobx.configure({ enforceActions: "never" })
+    spyDisposer()
+
+    d()
+})

packages/mobx/src/api/action.ts

@@ -8,7 +8,9 @@ import {
     isStringish,
     createDecoratorAnnotation,
     createActionAnnotation,
-    is20223Decorator
+    is20223Decorator,
+    _endAction,
+    _startAction
 } from "../internal"
 
 import type { ClassFieldDecorator, ClassMethodDecorator } from "../types/decorator_fills"
@@ -105,3 +107,13 @@ export function runInAction<T>(fn: () => T): T {
 export function isAction(thing: any) {
     return isFunction(thing) && thing.isMobxAction === true
 }
+
+export function _action() {
+    const runInfo = _startAction(DEFAULT_ACTION_NAME, false, this, undefined)
+
+    return {
+        [Symbol.dispose]() {
+            _endAction(runInfo)
+        }
+    }
+}

tsconfig.json

@@ -3,7 +3,7 @@
         "target": "es6",
         "module": "esnext",
         "moduleResolution": "node",
-        "lib": ["es6"],
+        "lib": ["es6", "esnext.disposable"],
         "downlevelIteration": true,
         "alwaysStrict": true,
         "sourceMap": true,