Angular : get the caller Html element inside a component method

Viewed 65

I'm working on creating a log statements injector in order to instrument already made front-end applications coded on Angular, the applications doesn't contain enough log statements (console.logs for example) to track user interaction with the app, in some sort I have to inject logs inside all the methods of these apps in order to get more informations (I'm using ts-morph in order to do that automatically), at the moment I'm inserting a simple log statement of this type :

methodToTrack(param:any){
//log statement injected
console.log(Date.now()+" methodToTrack(param:any) is called from Component: myComponent.ts");
}

I want to add some details about how my method was called in the context of user's intercation with the template in order to get something like that :

methodToTrack(param:any){
//log statement injected
console.log(Date.now()+" methodToTrack(param:any) is called from Component: myComponent.ts, the template caller element is buttonID/formID/droplistID...");
}

Keep in mind that the code of these applications is already made so it's not possible to manipulate their template files (HTML files) in order to send element ids when calling any methods (i.e (click)="imageClick('association')" => (click)="imageClick('association','buttonID')" this transformation is not possible), also it would be better to avoid using external modules in order to prevent dependencies issues (this is not mandatory currently but it would be better to avoid this).

0 Answers
Related