◐ Shell
clean mode source ↗

add signal consumer breakpoints by eduhmc · Pull Request #69383 · angular/angular

angular-robot

@eduhmc

  • feat(core): expose debuggableFn for effects in signal debug graph
  • feat(devtools): add prototype for setting signal breakpoints
 
Expose the underlying user function (fn) as debuggableFn for effect nodes in the signal debug graph. This allows debugging tools to locate and set breakpoints on effects.
Add a 'Set Breakpoint' button to the signal details panel. It uses the Chrome Console Utilities debug() and inspect() APIs to programmatically set breakpoints and navigate to the source code without requiring extra permissions for the prototype.

SkyZeroZx

override setSignalBreakpoint(position: SignalNodePosition, target: Frame): void {
const setBreakpoint = `
(() => {
const fn = inspectedApplication.findSignalNodeByPosition('${JSON.stringify(position)}');

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could it be that we want to use stringifyAndEscape to follow the same standard that was added at #69309?

const fn = inspectedApplication.findSignalNodeByPosition('${JSON.stringify(position)}');
const fn = inspectedApplication.findSignalNodeByPosition('${stringifyAndEscape(position)}');