14

enter image description here

What is the difference of "Step" and "Step into" in Google Chrome Developer tools,? I even can't find it in docs https://developers.google.com/web/tools/chrome-devtools/javascript/step-code

enter image description here

10
  • step: execute a line of code, step into: Same as step but if it's a function then it will go into that function and then pause the debugger at it's first line, which will allow you to debug the called functions too
    – Asesh
    Oct 19, 2020 at 15:54
  • 2
    @Asesh so step will step over that function? then what'll the step over do
    – user956609
    Oct 20, 2020 at 2:30
  • Yes you are right. Step over will step out of function, incase you don't want to go through that function
    – Asesh
    Oct 20, 2020 at 2:34
  • @Asesh Hi, I still don't know the difference of 'step' and 'step into' ``` function fun(a,b){ console.log(23); console.log(15); console.log(1);console.log(2); return a+b } debugger console.log(fun(1,2)); console.log(15); console.log(r); ``` this looks work same, can you explain it again? thank you
    – user956609
    Oct 20, 2020 at 16:11
  • 1
    @user956609, no, step over does NOT step out of a function. That is step out (default S-F11).
    – RichieHH
    Nov 8, 2020 at 20:00

1 Answer 1

19

You can spot the difference while running async code or multi-threaded code.

Step into: DevTools assumes that you want to pause in the asynchronous code that eventually runs

Step: DevTools pause in code as it chronologically ran

Consider this example:

setTimeout(() => {
    console.log('inside')
}, 3000);
console.log('outside')

After stopping on the breakpoint on the first line (setTimeout(() => {).

Step into: it waits 3 seconds and stops on the 2nd line (console.log('inside'))

Step it pauses on the 4th line (console.log('outside'))

Link to the docs: https://developers.google.com/web/updates/2018/01/devtools#async

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.