[JS] Creating Recursive Call Graphs from a Specific Function

[JEENB]

Hi,

Is there a way I could generate call graph starting from a specific function by tracing all function calls initiated by this function and any subsequent calls made by these functions, recursively?

I wrote a simple query that returns the callee and the caller but not sure how to do this recursively.

import javascript
from DataFlow::InvokeNode call, Function caller, Function callee
where caller = call.getEnclosingExpr().getEnclosingFunction() 
and callee = call.getACallee()
select caller, callee

[mbg]

Hi @JEENB 👋🏻

Yes, this is possible. We get this question somewhat frequently and there are a number of existing issues with a variety of answers for this. Firstly, the QL documentation has a section on recursion. The exact answer then depends a little on what exactly you want. See e.g. this issue or this one for some suggestions. These should be easily portable to Javascript.

Let me know if these pointers are enough or you need more help with this.

[JEENB]

Hi @mbg, Thank you for your response.

I tried few different ways but haven't been able to get exactly what I'm looking for.

So I have 3 files as follows:

1. utils1.ts

import { add } from './utils2';

export function multiply(a: number, b: number): number {
  return a * b;
}

export function divide(a: number, b: number): number {
  return a / b;
}

export function power(a: number, b: number): number {
  return Math.pow(a, b);
}

export function squareAndAdd(a: number, b: number): number {
  const squaredA = multiply(a, a);
  return add(squaredA, b);
}

2. utils2.ts

import { divide, power, multiply } from './utils1';

export function add(a: number, b: number): number {
  return a + b;
}

export function subtract(a: number, b: number): number {
  return a - b;
}

export function calculateHypotenuse(a: number, b: number): number {
  const aSquared = power(a, 2);
  const bSquared = power(b, 2);
  return Math.sqrt(add(aSquared, bSquared));
}

export function calculateAreaOfCircle(radius: number): number {
  const radiusSquared = power(radius, 2);
  return multiply(Math.PI, radiusSquared);
}

and 3) utils3.tx

import { squareAndAdd } from './utils1';
import { calculateHypotenuse, calculateAreaOfCircle } from './utils2';

console.log(squareAndAdd(2, 3)); // Output: 7

console.log(calculateHypotenuse(3, 4)); // Output: 5

console.log(calculateAreaOfCircle(2)); // Output: ~12.566

Now for starting function squareAndAdd, possible call graph would be multiply and add as children node (2 callgraph).

|-squareAndMultiply
|--- multiply
|--- add

For calculateHypotenuse, power will be one child node and add would be another node with sqrt as the parent of add (2 callgraph).
|-calculateHypotenuse
|---power
|---sqrt -> add

Something like creating all possible call graph for a function.