ts-mocha in Webstorm

Running Typescript tests with Mocha from command line

To run Typescript tests with Mocha, the easiest way is to install ts-mocha and configure your package.json as follow:

"scripts": {
    "test": "ts-mocha \"src/**/*.spec.ts\""
}

From here, you can run npm test as expected.

But you cannot run your test from Webstorm directly. It fails with a SyntaxError due to missing compilation.

Running Typescript tests with Mocha in Webstorm

Edit the “Run/Debug Configurations” > Templates > Mocha and add --require ts-node/register/transpile-only in the Mocha options

Now you can run your tests from WebStorm.

You don’t actually need ts-mocha for this solution, only ts-node (which is a dependency of ts-mocha).

Webstorm, Husky and Commitizen

Note: this article is valid only for Husky <= 4

Husky 7 has changed the way they interface with Git

Our team is using Commitizen to enforce format of git commit messages (this is later used to auto-generate changelogs and bump version). And we’re using Husky to make sure everyone joining the team has commitizen running as a git hook.

Now, I am using Webstorm and I create my commit directly from my IDE.  The commitizen git hook prepare-commit-msg clashes with Webstorm because it is meant to be used in a CLI environment.

The solution I am using is

  • Use Git Commit Template plugin for Webstorm to format git messages
  • After a fresh `​npm install` (husky recreates its git hook), I have to
    • Manually edit `.git/hooks/prepare-commit-msg`
    • To comment the line that runs husky by simply adding a # at the beginning of the line
      `. “$(dirname “$0”)/husky.sh”`

Of course, Webstorm is configured to “Run git hooks”. So it will keep running the others hooks we have (lint, tests, …). But it will skip the prepare-commit-msg hook.

Prettier, Webstorm, NVM and Linux

I installed Webstorm and wanted Prettier.

I simply installed the Prettier extension and added a File Watcher (as stated in the Doc)

But Prettier refused to run with “node not found” something…

I added this line to my .bashrc file to make sure NVM creates a symlink to the current node version:

export NVM_SYMLINK_CURRENT=true

Then I edited my environment sudo nano /etc/environment and added this folder at the end of my PATH /home/tanguy/.nvm/current/bin (the NVM symlink)

Now Webstorm will launch and Node will be in the PATH so Prettier runs fine.

Oh and I had to add some command line arguments to the Prettier File Watcher on Webstorm because the plugin was not reading my eslintrc.js configuration file.

Jetbrains editor (webstorm, inteliJ, pycharm…) – Blurry window on external monitor

Replace “Webstorm” by whatever editor you use.

  1. In Webstorm, go to Help > Edit Custom Properties
  2. Add/edit the line for sun.java2d.uiScale.enabled to be true
    1. sun.java2d.uiScale.enabled=true
  3. In Webstorm, go to Help > Edit Custom VM Options
  4. Remove any line that looks like Dhidpi=true or Dhidpi=false
  5. Find the shortcut that starts Webstorm (on the desktop or find the executable on the location you installed Webstorm)
  6. Right-click it and select Properties
  7. Go to Compatibility tab
  8. Check the box marked Override high DPI scaling behavoir
  9. Set the dropdown list titlted Scaling performed by: System

You’re done.

This solution comes from: https://youtrack.jetbrains.com/issue/IDEA-141456#comment=27-2343957