debugging – chrome webdev: can step break only in main source code?

I have limited understanding about how debugging works.
Can I use step debugging only in my main source code?

Suppose I have react app, I set a break point in my main file. Then I want to track where the program goes step by step and analyse it’s variable value and I only want to analyse within my source code.

Now it just goes deep into my included dependencies and it takes long long time to get back to my main app.

If there isn’t a way to tell step debugger only breaks when it hits my source, is there any alternative that provides a way to do what I intended to do? Thanks!

I already googled it, get random result. I really don’t know what the keyword is.

debugging – chrome webdev: can step debugging break only in main source code?

I have limited understanding about how debugging works.
Can I use step debugging only in my main source code?

Suppose I have react app, I set a break point in my main file. Then I want to track where the program goes step by step and analyse it’s variable value and I only want to analyse within my source code.

Now it just goes deep into my included dependencies and it takes long long time to get back to my main app.

If there isn’t a way to tell step debugger only breaks when it hits my source, is there any alternative that provides a way to do what I intended to do? Thanks!

I already googled it, get random result. I really don’t know what the keyword is.

Chrome debugging reference error

For a few days I’ve a strange behaviour debugging with Chrome, now each variable is not defined, I’ll attach a screen to show you the error, some one know why this is happening?

Chrome debugging referenceError

chrome devtools protocol Runtime.consoleAPICalled doesn’t work in https

I’m using chrome devtools protocol through websocket client (wscat on nodejs) and I used Runtime.enable to get Runtime events but I can only get Runtime.executionContextCreated events in https

but I want also to get Runtime.consoleAPICalled as I’m using console.log() in my functions

I also tried to use Log.enable and Console.enable but this did nothing

Detect the code acting on an element in DevTools

I have a web-page with the open Dev/F12 Tools (in Chrome).

When the page is resized, one of the observed div’s style properties is modified certainly by some JavaScript code (chrome displays modified properties in purple):
enter image description here

Is there a way to know, what exactly JS code does it, track the JS source of the modification of a DOM element?