How to debug protractor in VS CODE?

问题

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.

回答1:

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!

回答2:

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.

来源：https://stackoverflow.com/questions/54016095/how-to-debug-protractor-in-vs-code

标签

protractor

web-testing