React 18 required wrap all setState with #act, how to prevent it

Question

For ex, following is my code when I upgrade react from 17 to 18, ReactDom render become async, so I use #act to wrap react ReactDom render but react always require wrap all setState with #act

if not it will raise warn When testing, code that causes React state updates should be wrapped into act(...), it's huge work

so I expect a way make ReactDom render sync like React 17 and without #act warn

    class C extends Component<{}, { k: number }> {
        constructor(p: any) {
            super(p)
            this.state = {k: 0}
        }

        render() {
            return <div onClick={() => {
                // act(() => {
                // assume this.setState is lib code not test code, I cannot always use act wrap setState
                this.setState({k: this.state.k + 1})
                // })
            }}>{this.state.k}</div>
        }
    }

    var r = ReactDOM.createRoot(document.querySelector("#root"))
    var c: C
    act(() => {
        r.render(<C ref={e => c = e}/>)
    })
    c // act wrap r.render is required in react 18, since react 18 #render is async but many my old project test codes are sync

Answer 1

I find the solution, is not above my question's code bug

the err reason is:

(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true
act(() => {
    root.render(testTemplate)
});

enable IS_REACT_ACT_ENVIRONMENT will always require setState should be wrapped with #act

so following is solution

(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true
act(() => {
    root.render(testTemplate)
});
(globalThis as any).IS_REACT_ACT_ENVIRONMENT = false