add test for mobxjs#3776 (mobxjs#3787)

packages/mobx-react/__tests__/timerBasedFinalizationRegistry.tsx

@@ -0,0 +1,36 @@
+import "./utils/killFinalizationRegistry"
+import { cleanup, render, act } from "@testing-library/react"
+import * as mobx from "mobx"
+import * as React from "react"
+import { observer } from "../src"
+import { clearTimers } from "mobx-react-lite"
+
+expect(globalThis.FinalizationRegistry).toBeUndefined()
+
+afterEach(cleanup)
+
+test("should unregister from FinalizationRegistry once commited #3776", async () => {
+ const o = mobx.observable({ x: 0 })
+
+ @observer
+ class TestCmp extends React.Component<any> {
+ render() {
+ return o.x
+ }
+ }
+
+ const { unmount, container } = render(<TestCmp />)
+
+ expect(container).toHaveTextContent("0")
+
+ // If not unregistered, clearTimes disposes reaction
+ clearTimers()
+
+ act(() => {
+ o.x++
+ })
+
+ expect(container).toHaveTextContent("1")
+
+ unmount()
+})

packages/mobx-react/__tests__/utils/killFinalizationRegistry.ts

@@ -0,0 +1,4 @@
+// We want to be able to test reaction cleanup code that based on FinalizationRegistry & timers on the same run
+// For that we import this file on the beginning on the timer based test to the feature detection will pick the timers impl
+// @ts-ignore
+global.FinalizationRegistry = undefined