Double-click drawing to edit functionality does not work using the markdown on Safari #1451

New Issue

OVERLORD · 2026-02-05T00:56:16+03:00

OVERLORD commented

2026-02-05 00:56:16 +03:00

Originally created by @mkrzysztofowicz on GitHub (Nov 14, 2019).

I can't seem to find a way, when using Markdown editor, to edit an existing draw.io drawing. I can add a new drawing, but after it was added, can't seem to find a way to edit it.

I know cmd + click Insert Drawing opens the Drawing Manager which allows me to select a drawing to be inserted into the document or delete a drawing, however it seems there's no way to edit an existing drawing.

This functionality IS available in the WYSIWYG editor.

Am I missing something or is this feature in fact not there yet?

Running BookStackApp 0.27.5 on CentOS 7.6 with NGINX and php-fpm, with php 7.2.24 from remi-repos.

Thanks!

Originally created by @mkrzysztofowicz on GitHub (Nov 14, 2019). I can't seem to find a way, when using Markdown editor, to edit an existing draw.io drawing. I can add a new drawing, but after it was added, can't seem to find a way to edit it. I know `cmd + click` Insert Drawing opens the Drawing Manager which allows me to select a drawing to be inserted into the document or delete a drawing, however it seems there's no way to edit an existing drawing. This functionality *IS* available in the WYSIWYG editor. Am I missing something or is this feature in fact not there yet? Running BookStackApp 0.27.5 on CentOS 7.6 with NGINX and php-fpm, with php 7.2.24 from remi-repos. Thanks!

OVERLORD added the 🐛 Bug 🔒 Security 💻 Front-End labels 2026-02-05 00:56:16 +03:00

OVERLORD commented

2026-02-05 00:56:21 +03:00

@lommes commented on GitHub (Nov 15, 2019):

As mentioned in #1127:

Edit the page and double click the image in the markdown preview

I did not know this until now, too

@lommes commented on GitHub (Nov 15, 2019): As mentioned in #1127: Edit the page and double click the image in the markdown preview I did not know this until now, too

OVERLORD commented

2026-02-05 00:56:29 +03:00

@mkrzysztofowicz commented on GitHub (Nov 15, 2019):

Ah, OK. It doesn't seem to work in Safari on macOS, however it DOES work in Firefox on macOS.

I'm running macOS Catalina 10.15.1 and Safari 13.0.3 (15608.3.10.1.4).

What's interesting is that using the WYSIWYG editor on the exact same computer (macOS 10.15.1 and Safari 13.0.3 as above) does seem to allow double-click to edit an image.

So, to make sure this is clear, following is the scenario for macOS Catalina 10.15.1 and Safari 13.0.3:

Describe the bug
Editing draw.io diagrams doesn't work in Markdown editor when using Safari 13.0.3 on macOS Catalina 10.15.1.

note, editing in WYSIWYG editor using macOS Catalina 10.15.1 and Safari 13.0.3 does work
note, editing in Markdown editor using macOS Catalina 10.15.1 and Firefox 70.0.1 does work

Steps to reproduce

Create a new Book Page with macOS and Safari, using Markdown editor
Click "Insert Drawing" and draw a simple diagram with draw.io
Click File / Save to insert the diagram into your Book Page and to bring you back to Markdown Editor
In the Preview pane, double-click on your diagram with the intention to edit it - nothing happens. The image is surrounded by a blue frame when you hover the mouse over it, but double click does nothing
- when looking at the Web Inspector, I can see the following message in the Console after the double click: Blocked script execution in 'about:srcdoc' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.

Expected behaviour
Double clicking on the diagram in the preview pane of the Markdown editor opens the diagram in draw.io for editing

Your Configuration (please complete the following information):
Server:

Exact BookStack Version (Found in settings): v0.27.5
CentOS Linux release 7.7.1908 (Core)
PHP 7.2.24 (cli) (built: Oct 22 2019 11:15:01) ( NTS ) from remi-php72 repo
PHP 7.2.24 (fpm-fcgi) (built: Oct 22 2019 11:16:17) from remi-php72 repo
nginx version: nginx/1.16.1

Client:

MacBook Pro 13" with TouchBar, 2017 model
macOS Catalina 10.15.1
Safari 13.0.3

@mkrzysztofowicz commented on GitHub (Nov 15, 2019): Ah, OK. It doesn't seem to work in Safari on macOS, however it DOES work in Firefox on macOS. I'm running macOS Catalina 10.15.1 and Safari 13.0.3 (15608.3.10.1.4). What's interesting is that using the WYSIWYG editor on the exact same computer (macOS 10.15.1 and Safari 13.0.3 as above) does seem to allow double-click to edit an image. So, to make sure this is clear, following is the scenario for **macOS Catalina 10.15.1** and **Safari 13.0.3**: **Describe the bug** Editing draw.io diagrams doesn't work in Markdown editor when using Safari 13.0.3 on macOS Catalina 10.15.1. * note, editing in WYSIWYG editor using macOS Catalina 10.15.1 and Safari 13.0.3 **does** work * note, editing in Markdown editor using macOS Catalina 10.15.1 and Firefox 70.0.1 **does** work **Steps to reproduce** 1. Create a new Book Page with macOS and Safari, using Markdown editor 2. Click "Insert Drawing" and draw a simple diagram with draw.io 3. Click File / Save to insert the diagram into your Book Page and to bring you back to Markdown Editor 4. In the Preview pane, double-click on your diagram with the intention to edit it - **nothing happens**. The image is surrounded by a blue frame when you hover the mouse over it, but double click does nothing - when looking at the Web Inspector, I can see the following message in the Console after the double click: `Blocked script execution in 'about:srcdoc' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.` **Expected behaviour** Double clicking on the diagram in the preview pane of the Markdown editor opens the diagram in draw.io for editing **Your Configuration (please complete the following information):** Server: * Exact BookStack Version (Found in settings): v0.27.5 * CentOS Linux release 7.7.1908 (Core) * PHP 7.2.24 (cli) (built: Oct 22 2019 11:15:01) ( NTS ) from remi-php72 repo * PHP 7.2.24 (fpm-fcgi) (built: Oct 22 2019 11:16:17) from remi-php72 repo * nginx version: nginx/1.16.1 Client: * MacBook Pro 13" with TouchBar, 2017 model * macOS Catalina 10.15.1 * Safari 13.0.3

OVERLORD commented

2026-02-05 00:56:34 +03:00

@ssddanbrown commented on GitHub (Nov 15, 2019):

Hi @mkrzysztofowicz, Thanks for the details information above.

In a recent release I updated the markdown preview to be inside a sandboxed iframe to prevent any potential malicious scripts from being allowed to run if ever inserted.

While sandboxed against scripts, Chrome/FireFox/IE/Edge all allow us to still handle events inside the preview via script created outside of the sandbox to handle actions such as drawing click. Unfortunately Safari/Webkit behaves differently in this regard and seems to block all scripts and events. The WYSWIG editor does not have this security feature since it generally does a lot more filtering of input itself.

I think we'd need to use a different security feature, CSP, to disable potentially malicious scripts in a full cross-browser compatible way. This would generally make many of areas of BookStack much more secure but is a larger undertaking, since it has a wider impact that needs to be considered and it'll need to be compatible with admin-specific customizations.

I'll update the title of this issue to be specific to the issue of not being able to edit images in Safari when using the Markdown editor.

@ssddanbrown commented on GitHub (Nov 15, 2019): Hi @mkrzysztofowicz, Thanks for the details information above. In a recent release I updated the markdown preview to be inside a sandboxed iframe to prevent any potential malicious scripts from being allowed to run if ever inserted. While sandboxed against scripts, Chrome/FireFox/IE/Edge all allow us to still handle events inside the preview via script created outside of the sandbox to handle actions such as drawing click. Unfortunately Safari/Webkit behaves differently in this regard and seems to block all scripts and events. The WYSWIG editor does not have this security feature since it generally does a lot more filtering of input itself. I think we'd need to use a different security feature, [CSP](https://content-security-policy.com/), to disable potentially malicious scripts in a full cross-browser compatible way. This would generally make many of areas of BookStack much more secure but is a larger undertaking, since it has a wider impact that needs to be considered and it'll need to be compatible with admin-specific customizations. I'll update the title of this issue to be specific to the issue of not being able to edit images in Safari when using the Markdown editor.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#1451