JS Engine - chrisgurney/obsidian-note-toolbar GitHub Wiki

Install and enable the JS Engine plugin ↗ to execute JavaScript from Note Toolbar.

Note Toolbar's Scripting option must be enabled in order to use this feature.

[!tip] Example scripts that work with Note Toolbar can be found in this folder ↗

Use JavaScript expressions in any toolbar item

Use JavaScript expressions in labels, tooltips, and URIs, to create dynamic toolbars.

For example, set your label to {{js: return new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' })}} to show today's date, right in your toolbar.

Functions available

After creating a new JS Engine toolbar item, select from one of the below functions.

Evaluate JavaScript

  • Interprets the provided JavaScript expression (which can be multiple lines) and returns the result.

Expression example:

console.log("👋 Hello console!");
new Notice("👋 Hello notice!");

Execute JavaScript file

  • Executes the provided script, optionally putting output in the provided Output callout. File path should be relative to your vault's root.
  • Uses the internal.executeFile API method.

JavaScript file example:

console.log("👋 Hello console!");
new Notice("👋 Hello notice!");
return "👋 Hello note!";

JavaScript file with markdown rendering:

return engine.markdown.create('*test*'); // must use Output callout ID for this to render into

The JS Engine Markdown Builder works as well. See the JS Engine documentation ↗

Input parameters

If input parameters are passed to the script, such as:

param1: "value1", param2: 123

...they can be accessed within the script like so:

if (input) {
  ({param1, param2} = input)
  console.log(param1); // "value1"
}

Import and execute

  • Imports the provided JavaScript file, then executes a function within it. File path should be relative to your vault's root.
  • Parameters can be passed in JSON format, e.g., { "name": "Chris" }. See above for how to use them.
  • ⚠️ Note that the JavaScript file is only imported once. You may have to restart Obsidian in order to pick up changes.
  • Uses the importJs API method.

JavaScript file with function and arguments example:

export function Hello(engine, args) {
    console.log(`👋 Hello ${args['name']}`);
    new Notice(`👋 Hello ${args['name']}`);
}

Note Toolbar Callout support

For Note Toolbar Callouts, use these data attributes:

Function data-js-engine data-src data-expr data-func data-args data-callout
Evaluate JavaScript evaluate n/a expression n/a n/a callout ID (optional)
Execute JavaScript exec JavaScript filename n/a n/a n/a callout ID (optional)
Import and execute JavaScript importExec JavaScript filename n/a function name (optional) arguments (optional) n/a

Example:

> [!note-toolbar] JS Engine Toolbar
> - [Hello World with JS Engine]()<data data-js-engine="exec" data-src="Scripts/JsEngine/HelloWorld.js"/>

Where does output go, and where are errors reported?

For how output and errors are handled, see Executing scripts.


Next: Templater

Learn more: Executing scripts