TypeScript-Call-Graph icon indicating copy to clipboard operation
TypeScript-Call-Graph copied to clipboard

Arrow function are not taken into account in the Call graph

Open kasra0 opened this issue 3 years ago • 4 comments

Hi,

It seems that arrow functions are not taken into account today right ? I just changed few of them with regular function and it worked. It would be nice to have that feature.

Thanks.

kasra0 avatar Oct 13 '22 08:10 kasra0

Hello @kasra0 - thank you for the bug report 😁

I think we discussed this issue before #2 and fixed it with #5 🤔

To save some time, if you happen to have a copy of a function that didn't work, could you share (even pseudo code is fine) 👍

whyboris avatar Oct 13 '22 17:10 whyboris

Hello @whyboris,

Yes of course.

function f(x:number){
    return x
}
const g = (x:number)=>x

function main(){
    const arr = [1,2,3]    

    //const a   = arr.map(f)          // KO
    //const b   = arr.map((x)=>f(x))  // OK
    const c   =  g(10)              // KO 
}
$ tcg ./src/tcgTest.ts 
[ './src/tcgTest.ts' ]
? Are these the files you want to analyze? Yes

======================================        
[ 'f', 'main' ]
--------------------------------------        
Map(1) { 'main' => [ 'g' ] }
--------------------------------------        
Functions:                       2
Functions that call others:      1
--------------------------------------        
Map(0) {}
╭───────────────────────────╮
│      Graph visible @      │
│   http://localhost:3000   │
│      Ctrl + C to quit     │
╰───────────────────────────╯

The package is installed globally. package.json :

{
  "name": "typescript-call-graph",
  "version": "0.0.3",
  "description": "Create a call graph of your TypeScript files",
  "keywords": [
    "TypeScript",
    "call graph",
    "callgraph"
  ],
  "author": "Boris Yakubchik",
  "homepage": "https://yboris.dev",
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "https://github.com/whyboris/TypeScript-Call-Graph.git"
  },
  "main": "bin/index.js",
  "bin": {
    "tcg": "./bin/index.js"
  },
  "scripts": {
    "start": "tsc && node bin/index.js index.ts",
    "test": "node bin/index.js index.ts extract.ts cascade.ts graphviz.ts helper.ts xyz.ts",
    "global": "npm install -g ."
  },
  "dependencies": {
    "@types/node": "14.0.11",
    "d3-graphviz": "3.1.0",
    "express": "4.17.1",
    "graphviz": "0.0.9",
    "inquirer": "7.2.0",
    "kleur": "4.0.2",
    "mermaid": "8.5.2",
    "open": "7.0.4",
    "typescript": "3.9.5"
  },
  "devDependencies": {}
}

If I just uncomment the 'a' line, I have an empty graphic If I just uncomment the 'b' line, I have the correct graphic If I just uncomment the 'c' line, I have an empty graphic

The case 'a' is actually another problem, but it would be nice to have this ability too. It seams that we have to call explicity functions no ?

a really useful TypeScript AST viewer with the code

Hope It Helps Thanks !!

kasra0 avatar Oct 14 '22 08:10 kasra0

If you consider the arr.map(f) case as a bug or something that should be supported and it's not, It's better than I open another issue. It's a tricky case, because for those who code in a more functional style ( higher-order function, partial application, currying...), then there is some arity checking to do etc... arr.map(f) is the simplest case.

Let me know if you are interested in that topic

kasra0 avatar Oct 14 '22 09:10 kasra0

oops, it was my mistake. Arrow functions are taken into account! ;-)

However, It seems that Lines like that: arr.map(f) are not taken into account

Thanks

kasra0 avatar Oct 17 '22 11:10 kasra0