javascriptcytoscape.jscytoscape-web

Trying to find a stray '{' and/or '}' curly bracket


I get 2 errors testing through my code, and it was working before I turned my function to an async and added the new Promise to the loop.

Uncaught SyntaxError: missing } after property list
note: { opened at line 624, column 26

What's confusing is that it says it's on line 624 which doesn't make sense because emy code is only about 200 lines. (I'm assuming it counts each loop as a line maybe?)

And clicking on the links to the error line send me to these two lines specifically:

data: {
       id: await checkID(node_point)

I've put my code through beautifiers, through bracket counters, and I tried reading the documentation of Cytoscape to see if the formatting was correct for the function (cy.add).

I'm convinced its something else that's causing the issue.

Here is the rest of the code for reference:

async function draw() {

    api = await apiPromise;
    nodes = await api.query.proxy.proxies.entries();
    proxy_actions = await api.query.proxy.announcements.entries();

    addNodePromises = [];
    for (node in nodes) {

        addNodePromise = new Promise(() => {

            node_point = nodes[node][0].toHuman()[0]; //nodes in graph
            edges = nodes[node][1][0].toHuman(); //node edges/graph connections

            //Adding node points    
            cy.add([{
                group: "nodes",
                data: {
                    id: await checkID(node_point)
                },
                position: {
                    x: 0,
                    y: 0
                }
            }, ]);

            //And here the deleates
            for (proxy of edges) {
                cy.add([{
                    group: "nodes",
                    data: {
                        id: await checkID(proxy.delegate)
                    },
                    position: {
                        x: 0,
                        y: 0
                    }
                }, ]);
            }

            //Adding edges
            var i = 0;
            for (proxy of edges) {
                cy.add([{
                    group: "edges",
                    data: {
                        id: proxy.proxyType + i + "\n",
                        source: await checkID(node_point),
                        target: await checkID(proxy.delegate)
                    }
                }, ]);
                i++;
            }

        }); //end promise
        addNodePromises.append(addNodePromise);

    } //end for loop
    await Promises.all(addNodePromises);
    lay();
}

Solution

  • The main thing I see is an await that's not in an async function:

            addNodePromise = new Promise(() => {
            // ...
                            id: await checkID(proxy.delegate)
            // ...
            }); //end promise
    

    Your new Promise also doesn't have a resolve/reject even defined as arguments. Which means it would never resolve.

    The easiest way to fix is probably to declare this way instead of using new Promise syntax:

            addNodePromise = async () => {
            // ...
            }; //end promise
    
            // invoke async function; note change here:
            addNodePromises.append(addNodePromise());
    

    Edit: if you're not already using a good JavaScript linter, like eslint, I'd recommed it. It will help you find things like this.