[SOLVED] Can't make local javascript work on markdown files


I’ve seen multiple examples of markdown javascript on the forum but I just can’t make it work. For example something like that:

document.addEventListener('DOMContentLoaded', () => {
    document.body.innerHTML = "";

It does not work on Devonthink mardown preview, nor on HTML preview after conversion in Devonthink.

The javascript works when opening the converted HTML file in Firefox. But it does not work in Safari unless you activate the developer tools. So I guess it is a Webkit security thing that somehow disallows local file scripts, because my js file is in my Documents folder and Firefox asked me access to the folder when I ran the file there for the first time.

Am I doing something wrong? Because for me it seems that the feature is not working, or at least very poorly labelled.

And if the problem does not come from me, I can suggest a solution. Devonthink could inject the script directly in a script tag in the HTML of the markdown render, instead of linking it to the local file, which is the actual behavior. Because like that the problem is solved and I don’t see any downside. There’s even an upside if the fix is extended to the HTML conversion: it will be usable outside of your computer too, as when the script in an online script. And it will work on Safari. I believe that the same comment could be made for local CSS, but I didn’t play with it yet.

Thank you for your attention

Which probably indicates that the JS is either

  • correctly loaded from your file system
  • or copied inside a script element into the HTML document

What do Firefox‘ developer tools tell you about that?

Again: what do the developer tools of this browser tell you? No need to guess, it’s all there …

It is working. But with the little input you gave, it’s impossible to tell what to do to make it behave in your case.

You might perhaps search the forum, too. I’m quite confident that this has been discussed in depth before.

Well I’ve seen your posts on multiple topics where people have issues with the feature, and I am glad if it is working for you, yet it does not work for me.

Sorry if I wasn’t clear enough but yes, on Firefox and on Safari (with developer options on), the file is correctly loaded. I don’t really know what kind of input I can add. I tried with other file locations, same issue.

For example how you’re specifying the JS file. And what you see the HTML source in this context.

Well, I juist tried your example. Put the event handler into a file in ~/Desktop, and set the JavaScript file in the global MD preferences to /Users/me/Desktop/name-of-JS-file. Works like a charm (in that there’s nothing to see in the rendered MD, which is to be expected).

So: The function works as expected.

One more thing: Webkit caches the JS (and CSS). So whenever you change it, you must restart DT to see the new code/styles in action.

1 Like

Thank you. It does work in the desktop folder! Download folder too. It seems there are the two places where it works for me (I didn’t try them because they are the junkyards of my computer). Other places in my user folder (such as its root or iCloud drive) does not work. Is it because of some sort of permission issues?

The HTML conversion still does not work on Safari (with no dev mode), and the file location restriction is annoying, so maybe my suggestion is still worth looking at. Unless of course it is indeed a permission issue on my side.

Anyway, thank you for the solution, I will do with the Desktop folder for the moment.

I don’t know. And I don’t see why something would work in DT but not in Safari, given that both use the same engine.

Well I think it’s because of the “Files and Folder” privacy setting in System Preferences. I just tried again with the documents folder, but I typed the path instead of using the “Select…” tool. This time Devonthink asked me the access to the folder like Firefox did and now it works with the Documents folder. I didn’t have any luck with other folders though.

Screenshot 2023-09-14 at 21.12.22

Safari does not appear in the settings, probably because it never requested any access.

Ah, the brilliant security features of macOS :cry:

1 Like

DEVONthink should be given Full Disk Access.


Ok, that’s the setting I’m looking for, thank you!

You’re welcome :slight_smile: