Struggles defining custom JavaScript in a plugin

Developers
#1

I’m looking to package up some of my homegrown TiddlyWiki functionality into a nicer plugin package. In doing so, I’m learning about plugins (using the TiddlyWiki Markdown and Kookma Commander plugins as templates). I’ve got a $/plugins/peter/asdf with this in the text:

{
    "tiddlers" : {
        "$:/plugins/peter/asdf/js_demo.js" : {"created":"20250325032635462","text":"alert(\"test\");","title":"$:/plugins/peter/asdf/js_demo.js","modified":"20250325032701920","module-type":"library","type":"application/javascript"}
    }
}

This ought to create a plugin with one tiddler - that has alert("test"); in its text. It does when I save and reload my wiki (and the shadowing of the tiddler works as I’d expect). The thing I’m struggling with is that the JavaScript is never run.

I’m sure I’m missing something. I didn’t find anything in the documentation. Besides marking the module-type, is there any other secret sauce to getting the JavaScript to execute?

Thanks!

#2

Hey Peter,

The javascript is probably being executed when you reload the wiki - as any tiddler with a module-type field is picked up by the boot process and loaded by running the eval() function. For your javascript that load step will execute your javascript ( providing the alert popup) … but after that TW has no reason to execute your code again nor any handle on which to do so (as something needs to be export ed for TW to store that for use later).

What may work better as a starting point is to write a macro in javascript - see how here JavaScript Macros. The key here is there is a javascript run() function that exported back to TW so it is called whenever your macro is rendered in the wiki.

Depending on what your functionality does, you may also consider writing an widget or an action-widget that can be trigggered using button clicks etc.

As an aside - i have been toying with writing an action-widget that when triggered would execute some javascript from a tiddler and then display the result - much the same look as jupyter notebooks do.

Finally - there are much easier ways to write a plugin than to write the json in a tiddler… check out How to create plugins in the browser - or you grab my plugin that uses this capability to help create plugins - its available here

Cheers
CB

#3

You should look at the example of the startup module

#4

Manually writing that JSON will be a nightmare.

Try Modern.TiddlyDev or Gatha Studio Workspace 2.0.1 — develop plugin using Gatha and Gatha-Thirdflow on Node.JS

And to execute JS, module-type should be startup

/*\
title: $:/plugins/tiddlywiki/external-attachments/startup.js
type: application/javascript
module-type: startup

Startup initialisation

\*/
// Export name and synchronous status
exports.name = "external-attachments";
exports.platforms = ["browser"];
exports.after = ["startup"];
exports.synchronous = true;

exports.startup = function() {
  alert("test");
};
#5

This is the internal startup procedure: https://tiddlywiki.com/dev/#Microkernel%20Description

module-type: library only initialises the code to be used later on. Nothing will be executed.

You may be interested in: https://tiddlywiki.com/dev/#Javascript%20Widget%20Tutorial – If you follow the steps, you will be able to create your own widgets. But you have to start at the beginning