Interceptor Debugging

When it comes to interceptor troubleshooting, browser development tools are your best friends. You will need to get familiar with tabs console, network and sources.

In examples we will use Chromium based browser, but all browsers have similar dev tools.

How to open Dev Tools

Right-clicking on a webpage and pressing inspect is the easiest way to open development tools.

image-20241010-111112.png

Dev Tools Tabs

Console

In this tab, you can see all the logs, when pricefx is in CRM then you will see pricefx and CRM logs.

If you want to display some data here from interceptor, then just write console.log("Your content goes here"), if you see [object Object][object Object], then use it like this console.log(JSON.stringify("Your content goes here"))

Sources

This tab is extremely useful and is a much better tool for checking what variables return comparing to console.log()

Check this documentation to learn how to debug JavaScript in a browser using debugger; Debug JavaScript  |  Chrome DevTools  |  Chrome for Developers

Network

This tab is familiar to some CE's, as it can be used to check the performance of the logic.

Also, this tab can be used to:

  • Check CLIC detail header inputs and other inputs.

  • Find what inputs Dashboard has.

  • Check CLIC list filter (Writing filters from CLIC lists can be complicated, as a hack you can create desirable filter in CLIC list and copy it from network package to interceptor).

    image-20241010-114401.png