Debug Configuration in WebStorm for CucumberJS and TestCafe based project - testing

I am trying to set up WebStorm for one of the TestCafe project integrated with CucumberJS (Link: https://github.com/rquellh/testcafe-cucumber).
I am able to sort the debug configuration so far using WebStorm help, however, when I debug the project, it throws the following error to the console:
I am passing the following cucumber.js arguments:
--require testlab/**/step_definitions/*.js --tags #debug
And while I debug, I get the following error:
ReferenceError: testController is not defined
at World.<anonymous>
Test ignored.
Test ignored.
Failures:
1) Scenario: Searching for TestCafe on GitHub #
testlab\features\finAPIDemo.feature:6
× Given I open the GitHub page # testlab\step_definitions\github.js:5
ReferenceError: testController is not defined
I am expecting the debug to execute correctly, however, it is not working, the alternative I believe would be to write a js config and pass through as mentioned in the CucumberJS document page, however, I am not sure how to achieve that.
Any input or help will be appreciated.

This error only occurs when running cucumber with --tags #debug, and it's not specific to the IDE - you will face the same issue when starting your tests in terminal with node node_modules/cucumber/bin/cucumber-js --tags #debug:
node node_modules/cucumber/bin/cucumber-js --tags #debug
0 scenarios
0 steps
0m00.000s
E:\WebstormProjects\testcafe-cucumber\features\support\hooks.js:77
if (testController.testRun.lastDriverStatusResponse === 'test-done-confirmation') {
^
ReferenceError: testController is not defined
at Timeout.checkLastResponse [as _onTimeout] (E:\WebstormProjects\testcafe-cucumber\features\support\hooks.js:77:9)
at ontimeout (timers.js:436:11)
at tryOnTimeout (timers.js:300:5)
at listOnTimeout (timers.js:263:5)
at Timer.processTimers (timers.js:223:10)
I'm not sure why you need this option... There are no scenarios marked with #debug in your project, as far as I can see.
I'd suggest using a standard Cucumber.js run configuration for debugging. It works fine for me - tests are run, and breakpoints are hit:

You need to add the #debug directive for the scenario that you want to debug.
See the full setup in this help topic.

I would recommend using cucumber profiles and call that profile instead of using cli commands. Looking at the error you are receiving it looks like you are missing more required directories such as a custom world directory?

Under the hooks.js I have updated the import statements with const assignment and that worked for me:
Replaced:
'import errorHandling from "./support/errorHandling.js";\n' +
'import testControllerHolder from "./support/testControllerHolder.js";\n\n' +
with
'const errorHandling = require("./support/errorHandling.js");\n' +
'const testControllerHolder = require("./support/testControllerHolder.js");\n\n' +

Related

Validation Error: Preset #vue/cli-plugin-unit-jest not found

While executing Jest Test in PHPStorm I receive the following error in the console.
Debugger listening on ws://127.0.0.1:58148/15341a94-78d6-4475-94d6-c89c7e9e3c39
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
● Validation Error:
Preset #vue/cli-plugin-unit-jest not found.
Configuration Documentation:
https://facebook.github.io/jest/docs/configuration.html
Waiting for the debugger to disconnect...
I tried to $ vue add #vue/cli-plugin-unit-jest in order to add plugin but error still persists.
In my case Jest Run/Debug Configuration 'Jest Package' path had to be changed to /your-project-path/node_modules/#vue/cli-service

Property 'config' does not exist on type 'BrowserObject' in Webdriver.io

I'm using webdirevio to make some tests, and I'd like to access the configs from the tests as described here:
https://webdriver.io/docs/browserobject.html
But when I write browser.config in my tests I get the error in the title.
Edit:
As requested in the comments, wdio version is 5.12.4.
I'm using cucumber.js so I put console.log(browser.config) in my steps but even the IDE (Webstorm) doesn't recognize it
and if I continue to run the test I get the error in the log
ERROR #wdio/runner: TSError: ⨯ Unable to compile TypeScript:
tests/features/step_definitions/steps.ts(84,25): error TS2339: Property 'config' does not exist on type 'BrowserObject'.
This was an issue in webdriver.io.
It was fixed in commit https://github.com/webdriverio/webdriverio/commit/29690864b30efd163c1c82bc28ac124d7948e519
Fix will be present in v5.15.6

Configuring protractor with cucumber in Intellij

I am trying to configure Protractor with Cucumber in Intellij But I have an error when I run the test with the current configuration.
run configuration
I am receiving the error bellow
Testing started at 18:30 ...
/usr/local/bin/node /Users/marianojover/IdeaProjects/AutomationTest_PRO/node_modules/cucumber/bin/cucumber /Users/marianojover/IdeaProjects/AutomationTest_PRO/features/test.feature --format "../../../Library/Application Support/IntelliJIdea2018.1/CucumberJavaScript/lib/cucumberjs_formatter_v2.js" --format-options "{\"cucumberLibPath\": \"/Users/marianojover/IdeaProjects/AutomationTest_PRO/node_modules/cucumber/lib\"}" --require /Users/marianojover/IdeaProjects/AutomationTest_PRO/features
internal/modules/cjs/loader.js:583
throw err;
^
Error: Cannot find module '/Users/marianojover/IdeaProjects/AutomationTest_PRO/node_modules/cucumber/bin/cucumber'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
at startup (internal/bootstrap/node.js:236:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:560:3)
Process finished with exit code 1
The error is not giving information that I can consider useful in order to solve the problem.
Running Cucumber.js 4.x is not currently supported, please follow WEB-33787 for updates
Please make sure you have cucumber added to the node_modules folder which is in your project directory. I hope it is there by looking at the paths in your run configuration.
You can also add cucumber cli path to "Cucumber.js arguments" in your run configuration. The path to add is ./node_modules/.bin/cucumber-js (should be modified based on your directory structure). Please see https://github.com/cucumber/cucumber-js/blob/master/docs/cli.md
If the above does not work then you can also use node.js runner to run your protractor test. Just add a new run configuration and add node.js and then add the parameters in configuration tab of the runner, some are given below -
Working Directory -> This will be the path to your project.
Javascript File -> node_modules\protractor\built\cli.js
Application Paramters -> --specs=<path to your feature file><space><path to your protractor.conf.js>

TestCafe: Uncaught ReferenceError: pagespeed is not defined

New to TestCafe.
Expected
Given .js below, expected behavior when running testcafe chrome this.js is to click on the header logo.
Actual
Uncaught ReferenceError: pagespeed is not defined (at the click below).
On our prod site, this error doesn't happen so most likely some configuration (possibly my version of Apache?) but I wanted to make sure there weren't any TestCafe specific issues. Followed installation using the standard docs (npm)
Thanks in advance!
import { Selector } from 'testcafe';
fixture `A set of examples that illustrate how to use Little Passports`
.page `https://xxx.xxdev.us/`;
test('My Company', async t => {
await t.
click('.header-logo');
});
I think I'll currently get around this by adding -e, but I'll keep this open just in case there's something else to consider...
By default, a test fails when there is a JavaScript error on page. The "-e (--skip-js-errors)" parameter allows running tests by skipping this JS error.
To check if there are any errors on your page, open your browser console. If there are any, you can either fix the errors at the application level (a preferable approach) or skip them during test run using the "-e" parameter.

getting more information from phantomjs "SyntaxError: Parse error" message

I have a long script that was not written by me. When i run it I get:
phantomjs file.js
SyntaxError: Parse error
i checked out the manual and --help, and the best i could came up with was:
phantomjs --debug=yes file.js
(irrelevant debug statement from CookieJar)
SyntaxError: Parse error
Is there any better way to get at least a line number? or any hint at all?
Run the file with node. If there is a parse error it will report it.
If the file is valid, then node will also try to run it, which will fail if your script depends on something not available in your node environment. So you'll have to ignore any runtime errors.
For example, given hello-world.js:
// Say Hello World twice
for (var i=0; i<2; i++) {
console.log("Hello World") );
}
Run it with node:
node hello-world.js
Output:
/home/someone/somewhere/hello-world.js:3
console.log("Hello World") );
^
SyntaxError: Unexpected token )
at Module._compile (module.js:439:25)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)
at startup (node.js:119:16)
at node.js:901:3
Your file.js contains an invalid syntax. You should check it with a syntax validator. An online tool which I have created can be one possible solution, check out http://esprima.org/demo/validate.html.
Getting More Information From PhantomJS
The next version of PhantomJS (presumably it will be 1.9.8, whatever comes after 1.9.7) will output errors like this:
SyntaxError: Parse error
http://localhost:9000/scripts/49e8b4f4.vendor.js:8
So that's slightly more useful than the current message.
Unfortunately there are no nightly builds for PhantomJS, so at this time you will need to compile your own version of master if you want to try this.
Debugging Minified files
If you are working with a minified file, often the line number won't be very helpful, and often debugging the un-minified file won't give you the parse error.
To solve this, once you get phantomjs to give you the name of the file, you can use the online demo of Esprima to get an actual parse of your JavaScript code:
http://esprima.org/demo/parse.html
From there, you can enter strategic line breaks to isolate the actual error.
Lint Tools are Sub-optimal for this use-case
A lint tool like jslint or jshint are more opinionated than a real parser, so if you are looking for a very specific syntax error, I would recommend using a real parser, since it will check only for code validity, and not opinionated styling guidelines. I'm not implying lint tools don't have value, just that they won't be as helpful for solving this type of problem.
You can also use syntax linters like jslint or jshint
I received SyntaxError: Parse error while trying to require a custom minified jquery.
I found the solution was to add a blank line to the bottom of jquery.min.js.
Hopefully this helps someone. Using PhantomJS 1.9.7.
I use a simple shell script that will run Phantom normally if no parse errors are found, otherwise it will display the errors. It runs the script through node, checks for SyntaxError in the output and then re-runs node to the terminal if there are errors. It passes all the command line arguments along to Phantom.
Failure mode for this method is if your node parser is significantly different from your Phantom parser. Mine are close enough that it's never been a problem.
usage: ./debug.sh --myArg1 val1 --myArg2 val2
debug.sh:
ERROR=$(node myscript.js 2>&1 >/dev/null | grep "SyntaxError")
if [ "$ERROR" = "" ]; then
echo "No parse errors, running script..."
# run the script with Phantom and pass all the args to it
phantomjs accession.js $*
else
echo "*********************************************************"
echo "********* There are parse errors in the script: *********"
echo "*********************************************************"
# show the errors by running again but not redirecting
node accession.js
fi
I did have the same issue, but none of the solutions worked for me.
I figured that the issue was probably an unsupported syntax by PhantomJS's webkit, since my page was working correctly in current browsers' versions.
What I did was finding out which webkit version PhantomJS was using, for 1.9.* it's here, 34.534.
Now we have to find the Chromium version using the same webkit, or close to it, in here (for Mac).
Ended up going with the Mac OSX 267668 and installed it.
Loaded the same URL as PhantomJS, and here it was, a real Uncaught SyntaxError: Unexpected token with a full stack trace.
Hope that helps.