AppMap Agent for JavaScript

About

appmap-agent-js is a JavaScript package for recording AppMaps of your code.

The AppMap data format includes code structure (packages, modules, classes, and methods), trace events (function calls, web services, RPC calls, SQL, parameters, return values, exceptions, etc), and code metadata (repo URL, commit SHA, etc). It’s more granular than a performance profile, but it’s less granular than a full debug trace. It’s designed to be optimal for understanding the design intent and structure of code and key data flows.

Supported versions

Installation

Run this command in your Node.js project folder (where package.json is located):

npx @appland/appmap@latest install

You will be guided through a series of steps for installing and configuring the agent.

To use AppMaps in your code editor, you’ll also want to install the corresponding AppMap extension:

Configuration

When you run your program, the agent reads configuration settings from appmap.yml. The install command creates a default appmap.yml file by scanning the project directories. We recommend that you review the generated appmap.yml file and confirm your application name and a list of directories that will be recorded.

Here’s a sample configuration file for a typical JavaScript project:

# 'name' should generally be the same as the code repo name.
name: MyApp
packages:
  - path: src/server/controllers
  - path: src/server/data
  - path: src/server/models
  - path: src/server/routes
  - path: src/server/lib
    shallow: true
    exclude: 
      - src/server/lib/util
  • name Provides the project name (required)
  • packages A list of packages, classes and methods which should be instrumented.

packages

Each entry in the packages list is a YAML object which has the following keys:

  • path A path to JavaScript sources files

    • For projects with JavaScript source maps: add paths to sources to be recorded. For example:

      name: MyApp
packages:
  - path: src/server/controllers
  - path: src/server/routes

    • For projects without JavaScript source maps: include build folders. For example:

      name: MyApp
packages:
  - path: dist/controllers
  - path: dist/routes
  • exclude A list of sub-packages, sub-classes and sub-methods that will be ignored. The exclude list only applies to the path specified in the same package entry.
  • shallow When set to true, only the first function call entry into a package will be recorded. Subsequent function calls within the same package are not recorded unless code execution leaves the package and re-enters it. Default: false.

Tests recording

When running test cases with the agent attached to the JavaScript engine, a new AppMap file will be created for each unique test case.

Recording mocha test cases:

  1. Run appmap-agent-js with the mocha command and its parameters following the -- delimiter. For example:

     npx appmap-agent-js -- mocha 'test/**/*.ts'

  2. appmap-agent-js will run the tests. When the tests are complete, the AppMaps will be stored in the default output directory tmp/appmap/mocha.

Recording jest test cases:

  1. Run appmap-agent-js with the jest command and its parameters following the -- delimiter. For example: 
     npx appmap-agent-js -- jest 'test/**/*.ts'
  2. appmap-agent-js will run the tests. When the tests are complete, the AppMaps will be stored in the default output directory tmp/appmap/jest.

Remote recording

appmap-agent-js supports the AppMap remote recording API. This functionality is provided by the AppMap agent. It will hook an existing HTTP engine, serving HTTP requests to toggle recording on and off.

Note Your application must be using Express.js (directly or indirectly) for remote recording to work. Express.js is requried because AppMap injects its control routes into the Express.js middleware stack. Express-based frameworks such as Nest.js will work, as long as they are using Express under the hood.

  1. Run appmap-agent-js with the application-starting command and its parameters following the -- delimiter. For example: 
     npx appmap-agent-js -- node app/main.js --param1 hello --param2=world
  2. appmap-agent-js will start the app and inject itself in its http stack. It will listen for remote recording requests on all http ports of the application.
  3. Start the remote recording:
  4. Interact with your application or service to exercise code included in appmap.yml
  5. Stop the recording and save the new AppMap to disk.

Process recording

appmap-agent-js can record an entire JavaScript process tree from start to finish.

Run the appmap-agent-js command and give it an argument for starting your application and an argument for starting process recording.

npx appmap-agent-js --command="put the command to start your app here" --recorder=process

Then interact with your app using its UI or API, and AppMaps will be generated automatically. You will see them appear in the ‘AppMaps’ tab in the left sidebar and on the ‘Explore AppMaps’ page of the instructions.

appmap-agent-js parameters

The most frequently used appmap-agent-js parameters are:

  • --recorder=[mocha|jest|remote|process] : process recorder
    • default recorder is inferred from the starting command:
      • mocha if the the command contains mocha
      • jest if the the command contains jest
      • process in all other cases
    • mocha and jest recorders record AppMaps from test cases automatically
    • remote recorder has to be started and stopped manually with http requests
    • process recorder records entire processes automatically, from start to finish
  • --command="_start command_" : alternate method of specifying the app- or tests-starting command, wrapped in quotes
  • --log-level=[debug|info|warning|error] : defaults to info
  • --log-file=_file_ : defaults to stderr
  • --output-dir=_directory_ : location of recorded AppMap files, default is tmp/appmap/<recorder> – eg: tmp/appmap/mocha
  • --help prints out help message to stdout
  • --version installed version

Example

npx appmap-agent-js --log-level=error --recorder=remote -- node built/app.js

System Properties

  • APPMAP_CONFIGURATION_PATH Path to the appmap.yml config file. Default: appmap.yml
  • APPMAP_REPOSITORY_DIRECTORY Path to the project’s local git folder. Default: .

Viewing AppMaps

Recorded AppMap are saved as .appmap.json files in the project folders (default location: tmp/appmap.)

Follow the documentation for your IDE to open the recorded .appmap.json files:

GitHub repository

https://github.com/getappmap/appmap-agent-js

Was this page helpful? thumb_up Yes thumb_down No
Thank you for your feedback!