directus-extension-hook-admin-script-injector

Inject JavaScript into Directus Studio from a Directus collection.

What it does

The extension injects this external script into Directus Studio:

<script src="/admin-script-injector.js" defer></script>

The endpoint reads all published JavaScript snippets from:

admin_script_injector

Then it concatenates them in this order:

sort ASC
id ASC

This avoids inline JavaScript and does not require CSP unsafe-inline.

Directus collection to create manually

Create a regular collection named:

admin_script_injector

Recommended fields:

status
  Type: String
  Interface: Dropdown
  Choices:
    published
    draft
    archived
  Required: true
  Purpose: only published records are injected

sort
  Type: Integer
  Required: false
  Purpose: controls execution order

name
  Type: String
  Required: true
  Purpose: short description of what this script does

script
  Type: Text
  Interface: Code or Textarea
  Required: false
  Purpose: JavaScript to inject into Directus Studio

Keep the default id field.

Example records

status: published
sort: 100
name: Hide actions on gerar collections
script: console.log('hide actions loaded');

status: published
sort: 200
name: Auto discard gerar changes
script: console.log('auto discard loaded');

CSP requirement

The script is loaded from the same Directus origin.

Required CSP:

script-src 'self'

No unsafe-inline is required.

Browser verification

Open Directus Studio and run:

document.querySelector('script[src="/admin-script-injector.js"]') !== null

Expected:

true

Then open:

/admin-script-injector.js

Expected:

The concatenated JavaScript from all published admin_script_injector records.

Security

Anyone who can edit admin_script_injector.script can execute JavaScript inside Directus Studio.

Only technical admins should have write access to this collection.