Run WebdriverIO tests via Mocha in WebStorm - mocha.js

Question

I want to run WebdriverIO + Mocha tests from the WebStorm gutter (the green triangle icons on the left side, by the line numbers).
But when I press run triangle - error occurred:
/Users/ilyubin/.nvm/versions/node/v10.15.0/bin/node /Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/bin/_mocha --ui bdd --reporter /Applications/WebStorm.app/Contents/plugins/NodeJS/js/mocha-intellij/lib/mochaIntellijReporter.js /Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/test/specs/catalog/not.found.page.spec.js --grep "^Тесты страницы ошибок Поиск несуществующего запроса$"
/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/test/specs/catalog/not.found.page.spec.js:1
(function (exports, require, module, __filename, __dirname) { import {expect} from 'chai';
^
SyntaxError: Unexpected token {
at new Script (vm.js:79:7)
at createScript (vm.js:251:10)
at Object.runInThisContext (vm.js:303:10)
at Module._compile (internal/modules/cjs/loader.js:657:28)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
at /Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/mocha.js:324:27
at Array.forEach (<anonymous>)
at Mocha.loadFiles (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/mocha.js:321:14)
at Mocha.run (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/mocha.js:763:10)
at Object.exports.singleRun (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/cli/run-helpers.js:196:16)
at exports.runMocha (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/cli/run-helpers.js:291:13)
at Object.exports.handler.argv [as handler] (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/cli/run.js:292:3)
at Object.runCommand (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/node_modules/yargs/lib/command.js:238:44)
at Object.parseArgs [as _parseArgs] (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/node_modules/yargs/yargs.js:1072:28)
at Object.parse (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/node_modules/yargs/yargs.js:566:25)
at Object.exports.main (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/lib/cli/cli.js:62:6)
at Object.<anonymous> (/Users/ilyubin/git/ozon.ru/packages/ozon.ru-ui-tests/node_modules/mocha/bin/_mocha:10:23)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)
How to run WebdriverIO tests from WebStorm?
My versions:
WebStorm 2018.3.3
Build #WS-183.5153.33, built on January 9, 2019
JRE: 1.8.0_152-release-1343-b26 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
macOS 10.14.2
➜ ~ node -v
v10.15.0
➜ ~ mocha --version
5.2.0
My dependencies:
"dependencies": {
"#wdio/allure-reporter": "^5.4.9",
"#wdio/cli": "^5.4.13",
"#wdio/local-runner": "^5.4.13",
"#wdio/mocha-framework": "^5.4.13",
"#wdio/spec-reporter": "^5.4.3",
"#wdio/sync": "^5.4.13",
...
},

Answer 1

You can't run wdio specs using mocha test runner, so Mocha run configuration can't be used here. You need using Node.js run configuration instead:
Also, as you are using ES6 syntax in your tests, you have to configure wdio to use babel. See https://webdriver.io/docs/babel.html for instructions:
npm install --save-dev #babel/core #babel/cli #babel/preset-env #babel/register
in the project root folder, create a file babel.config.js:
module.exports = {
presets: [
['#babel/preset-env', {
targets: {
node: 8
}
}]
]
}
in your wdio.conf.js, set up mocha as follows;
mochaOpts: {
ui: 'bdd',
timeout: 60000,
compilers: ['js:#babel/register']
},