Desktop notification support

Last update on August 19 2022 21:50:37 (UTC/GMT +8 hours)

In the previous tutorial we introduced you to mocha's support for the browser. Today we will examine desktop notification support for mocha.

Desktop notification permits asynchronous communication of events without forcing you to react to a notification immediately. Their appearance and specific functionality will vary across platforms. Typically, they will disappear after a short delay, but their content will often be stored in some manner that will allow you to access past notifications.

Growl was an early notification system implementation for windows and OS X, thus, we have the name of Mocha's -growl option.

Once desktop notification support is enabled, when your root suite has completed test execution, a desktop notification has to appear informing you whether your tests passed or failed.

Node-based notification

Before you can use desktop notification on the command-line interface (CLI), first, you must install some platform-specific prerequisite software.

You should enable Mocha's desktop notification as follows:

mocha -growl

Browser-based notification

The current versions of modern browsers are making web notification support available.

You should ensure your browser version supports both promises and web notifications. Because the Notification API has evolved over time, should not expect the minimum browser version to necessarily work.

You can enable mocha's web notification with a slight modification to your client-side mocha HTML. You should add a call to mocha.growl() prior to running your tests as shown below:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Mocha Tests</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0 " />
    <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
  </head>
  <body>
    <div id="mocha"></div>

    <script src="https://unpkg.com/chai/chai.js"></script>
    <script src="https://unpkg.com/mocha/mocha.js"></script>

    <script class="mocha-init">
      mocha.setup('bdd');
      mocha.growl(); // <-- will enable web notifications
    </script>
    <script src="test.spec.js"></script>
    <script class="mocha-exec">
      mocha.run();
    </script>
  </body>
</html>