4

I'm trying to debug protractor test script but I'm not able to find good source to understand how to debug, can any one suggest me few best sites to refer and how many ways can we debug the protractor test script.

Anil
  • 43
  • 1
  • 6
  • Possible duplicate of [How to debug component/typescript code when running Protractor](https://stackoverflow.com/questions/45142915/how-to-debug-component-typescript-code-when-running-protractor) – Bharath Kumar S Jan 03 '19 at 04:26
  • 1
    Not a duplicate. Element explorer is going to be deprecated. This is (hopefully) going to use the `--inspect-brk`. See the following answer https://stackoverflow.com/questions/53986770/run-ng-e2e-with-element-explorer-not-working. Also we have a youtube vid of this: https://www.youtube.com/watch?v=6aPfHrSl0Qk&t=1208s – cnishina Jan 03 '19 at 06:49
  • you can add the launch.json and debug. check this blogs (https://blogs.msdn.microsoft.com/wushuai/2016/08/24/debug-protractor-script-in-visual-studio-code/) (https://lukasbehal.com/2017-06-16-ts-protractor-tests-debugging/) – inbha Jan 03 '19 at 09:11

2 Answers2

5

you have 2 best ways.

Method A:

1) Configure VSCode.

This is my launch configuration: (change the folder path and files as needed).

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch Backoffice",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/node_modules/protractor/bin/protractor",
            "stopOnEntry": false,
            "args": ["${workspaceRoot}/e2e/backoffice/protractor_backoffice.js"],
            "sourceMaps": true,
            "outFiles": [ "${workspaceRoot}/e2e/backoffice/**/*.js" ],
            "smartStep": true
        }
    ]
}

2) Once you have done this you just can run the debugger and it should work.

INFO: To add breakpoints just write in your code "debugger;" (without quotes).

VERY IMPORTANT!!!! To syncronize your code with your browser you have use async functions and await methods.

example of async/await and breakpoint:

async myFunction() {
 debugger;
 await this.myElement.click();
}

Method B:

Open a terminal in VSCode and write:

node --inspect-brk path/to/protractor/bin/protactor path/to/protractorconfig.js

example:

node --inspect-brk .\node_modules\protractor\bin\protractor .\e2e\backoffice\protractor_backoffice.js

It opens dev chrome tools, in there is pretty much as VSCode debugger, but it gives a bit more information.

Good luck!

Artyk
  • 66
  • 2
0

I was facing alot of issues to debug. After so many research i got this solution and my code is not getting debugged.

My Launch.json file

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",

        "program": "${workspaceRoot}/node_modules/protractor/bin/protractor",
            "stopOnEntry": false,
            "args": ["${workspaceRoot}/FolderNameIFAny/conf.js"],
            "sourceMaps": true,
            "outFiles": [ "${workspaceRoot}/JSFiles/Tests/**/*.js" ],
            "smartStep": true
        }
    ]
}

in "args" give your conf.js file in which you will provide your spec file. Dont change "outFiles" and "Program".

If you try to give ts file then it will not run. so please provide .js file path.

after setting the path in conf.ts run command 

tsc

to set your conf.ts file to conf.js

set the breakdown at your mentioned file in conf.ts file and press f5 to debug.

Neh18
  • 152
  • 1
  • 12