- Docker and Docker Compose
- Node.js 20+
- npm
npm ci
./scripts/dev-setup.shThis builds the JavaScript, starts Nextcloud 33 with MariaDB in Docker, waits for it to be ready, and enables the draw.io app. Takes about a minute on first run (image pulls).
Open http://localhost:8088 and log in with admin / admin.
For JavaScript/CSS changes (src/):
npm run build # rebuild JS bundles
# then reload browserOr use npm run watch for automatic rebuilds on save.
For PHP changes (lib/, templates/):
Changes are live immediately (volume-mounted). Just reload the browser.
For MIME type or migration changes:
./scripts/dev-rebuild.sh # rebuilds JS + clears NC caches + re-runs MIME registrationdocker compose down # stop containers, keep data
docker compose down -v # stop containers AND wipe all data (fresh start)App won't enable / "update required" error:
Don't change the version in appinfo/info.xml during development. If you already did:
docker compose down -v # wipe and start fresh
./scripts/dev-setup.shPermission errors in container:
docker compose exec nextcloud chown -R www-data:www-data /var/www/html/custom_apps/drawioStale PHP cache:
docker compose exec -u 33 nextcloud php occ maintenance:repairRebuilding from scratch:
docker compose down -v
./scripts/dev-setup.shAfter making changes, walk through the relevant sections:
- Navigate to Settings > Administration > Draw.io
- All form fields render (URL, theme, dark mode, language, offline, autosave, libraries, previews, config textarea)
- Change settings, click Save > success toast appears
- Settings persist after page reload
- In Files app, click "+" > "New draw.io Diagram" appears
- Click it > new
.drawiofile created, editor opens - In Files app, click "+" > "New draw.io Whiteboard" appears
- Click it > new
.dwbfile created, editor opens
- Open an existing
.drawiofile > draw.io editor loads in iframe - Draw something, wait for autosave > status message appears
- Close editor > returns to Files app, file size updated
- Reopen the file > previous edits preserved
- With previews enabled: edit a diagram, close > preview thumbnail visible in Files list
- With previews disabled in admin settings: no thumbnail generated
- Share a
.drawiofile via public link - Open the public link in an incognito window > editor loads
- Verify read-only vs read-write based on share permissions
- Change NC user language to German (Settings > Personal > Language)
- Admin settings page shows translated strings
- File menu entries show translated text ("Neues draw.io Diagramm")
- Edit and save a file multiple times
- Check if version history is accessible from the editor