JSON.stringify circular dependency when not using the object that could cause the erorr?

Question

I am working on a nextjs Application. The App has a Controller, which also uses the App as an object. Yes, this does cause the cirular dependency, however not at a time you would expect it to.

I am using a JSON object to make an api call, which is supposed to be stringified by JSON.stringify(). The Controller makes the api call, which is then handled in another script. When doing this (only for api calls that will delete something!), I get the error I was talking about.

This is not the case when only using a single parameter as an argument for the api call and for any of the other api calls. Any ideas on what I might be missing?

I am only partly familiar with the code as this is not an Application that I created, I am just adjusting it. So I want to change as minimal as possible, even though my current solution seems to work just fine. I do not know what caused the change in this working.

EDIT: Wanted to clarify the dependency at hand here.

In app.jsx:

class App extends React.Component {
    constructor(){
        super()
        this.state = {changed: false};
        this.controller = new Controller(this);
    }
[...]

In controller.js:

class Controller{

    /**
     * Initializes a new controller
     * 
     * @param {React.Component} app - The root element of the react DOM
     */
    constructor(app){
        /**
         * The basic react components
         */
        this.app = app
[...]

This causes the circular dependency with app -> controller -> app -> controller and so forth. Is there maybe a way I can avoid this?

EDIT2:

I have tried this:

async deleteReport(report){
        console.log(report)
        console.log(JSON.stringify(report));
        let data = await this.request('/itt/api/deleteReport', {id: report.id})
        if(data){
            this.toast(this.lang.deletedReport, 3000)
            this.showReports()
        }
    }

The report object logged looks fine, however I get the same error here as well. So maybe there is a loop inside the controller itself that only throws an error for JSON.stringify()?

This is also where the API call is made. This is how the post is made:

static post(path, data){
        return new Promise((resolve, reject) => {
            const timer = setTimeout(() => {
                reject({
                    url: path,
                    event: new Event('timeout'),
                })
            }, Config.request.timeout)

            fetch(path, {
                method: 'POST',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(data)
            }).then(response => {
                clearTimeout(timer);
                response.json().then(data => {
                    if(response.status == 200)
                        resolve({...data, event: new Event(data.eventMsg)})
                    else
                        reject({...data, event: new Event(data.eventMsg)})
                }).catch(err => {
                    reject({
                        url: response.url,
                        status: response.status,
                        statusText: response.statusText,
                        event: new Event('serverError')
                    })
                })

            }).catch(err => {
                reject({
                    err: err,
                    event: new Event('serverError')
                })
            })
        })
    }

Here, data is the same as the report object in the other function.

EDIT3: App and Controller are unrelated classes/objects and not an instance of report. The object report here contains only information but no other dependency on other objects.

What I have tried now is to remove the circular dependency I just mentioned, but now im getting an error for another circular dependency at hand.