drawio-obsidian icon indicating copy to clipboard operation
drawio-obsidian copied to clipboard

New Release? Everything broken in new Obsidian.

Open ckdarby opened this issue 1 year ago • 24 comments
trafficstars

Hi @zapthedingbat,

The project appears to still get commits every once in a while, but I notice there hasn't been a release in over 2 years.

Within Obsidian v1.5.3 it appears this community plugin is now entirely broken in both sketch and full mode.

Are you open to releasing a new version? Or do you need help from me to try to automate the releasing process to be able to have these go out for the community?

ckdarby avatar Dec 26 '23 14:12 ckdarby

I also encountered this issue

hunterzhang86 avatar Dec 27 '23 05:12 hunterzhang86

Also facing this issue

AdvMaple avatar Dec 28 '23 04:12 AdvMaple

me too,I hope someone can solve it

calmwaves111 avatar Dec 28 '23 04:12 calmwaves111

I think the question is really urgent

qiudebenge avatar Dec 28 '23 09:12 qiudebenge

I also encountered this issue.

NekkroTech avatar Dec 28 '23 15:12 NekkroTech

have to use the Official client,but it is inconvenient https://www.drawio.com/

poplar-hub avatar Dec 29 '23 07:12 poplar-hub

I have look through this for a bit and these are my finding:

The error seem to be cause by Obsidian 1.5

Minimal 1.4 setup console.log, using the latest drawio version. image

After update to 1.5 image

The blob:null is not an issue image

VM207:15 Refused to load the stylesheet 'blob:null/67c6b0e5-a81c-4dde-bf52-04c91145380f' because it violates the following Content Security Policy directive: "style-src 'unsafe-inline' 'self' https://fonts.googleapis.com". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

(anonymous) @ VM207:15
(anonymous) @ VM207:15
onWindowMessage @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:8
postMessage (async)
sendMessage @ plugin:drawio-obsidian:15
addScriptToFrame @ plugin:drawio-obsidian:15
handleMessage @ plugin:drawio-obsidian:15
listener @ plugin:drawio-obsidian:15
postMessage (async)
(anonymous) @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:13
VM208:242 Refused to load the stylesheet 'blob:null/985d0a81-0bcb-4d02-ad96-5a6ab1ceba4d' because it violates the following Content Security Policy directive: "style-src 'unsafe-inline' 'self' https://fonts.googleapis.com". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

link @ VM208:242
(anonymous) @ VM208:245
o.addScript @ VM207:15
o.handleMessages @ VM207:15
listener @ VM207:1
postMessage (async)
sendMessage @ plugin:drawio-obsidian:15
addScriptToFrame @ plugin:drawio-obsidian:15
handleMessage @ plugin:drawio-obsidian:15
listener @ plugin:drawio-obsidian:15
postMessage (async)
(anonymous) @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:13
VM208:242 Refused to load the stylesheet 'blob:null/7d28a99c-7b9f-44e9-9ffd-47f9afff6637' because it violates the following Content Security Policy directive: "style-src 'unsafe-inline' 'self' https://fonts.googleapis.com". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

link @ VM208:242
EditorUi.initTheme @ VM208:10507
(anonymous) @ VM208:10511
(anonymous) @ VM208:10794
o.addScript @ VM207:15
o.handleMessages @ VM207:15
listener @ VM207:1
postMessage (async)
sendMessage @ plugin:drawio-obsidian:15
addScriptToFrame @ plugin:drawio-obsidian:15
handleMessage @ plugin:drawio-obsidian:15
listener @ plugin:drawio-obsidian:15
postMessage (async)
(anonymous) @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:13
VM207:15 XHR GET blob:null/a9024585-1f4b-423b-8c86-c0b68797ce25
(anonymous) @ VM207:15
mxXmlRequest.send @ VM208:372
get @ VM208:287
(anonymous) @ VM208:287
getAll @ VM208:287
c @ VM208:11237
b @ VM208:11245
App.main @ VM208:11254
(anonymous) @ VM209:15
(anonymous) @ VM209:15
o.addScript @ VM207:15
o.handleMessages @ VM207:15
listener @ VM207:1
postMessage (async)
sendMessage @ plugin:drawio-obsidian:15
addScriptToFrame @ plugin:drawio-obsidian:15
handleMessage @ plugin:drawio-obsidian:15
listener @ plugin:drawio-obsidian:15
postMessage (async)
(anonymous) @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:13
VM208:10263     GET https://app.diagrams.net/math/MathJax.js?config=TeX-MML-AM_SVG-full net::ERR_ABORTED 404
Editor.initMath @ VM208:10263
App.main @ VM208:11253
(anonymous) @ VM209:15
(anonymous) @ VM209:15
o.addScript @ VM207:15
o.handleMessages @ VM207:15
listener @ VM207:1
postMessage (async)
sendMessage @ plugin:drawio-obsidian:15
addScriptToFrame @ plugin:drawio-obsidian:15
handleMessage @ plugin:drawio-obsidian:15
listener @ plugin:drawio-obsidian:15
postMessage (async)
(anonymous) @ data:text/html,%0A%3Cscript%3E%0Aconst%20onWindowMessage%20%3D%20(messageEvent)%20%3D%3E%20%7B%0A%20%20const%20message%20%3D%20JSON.parse(messageEvent.data)%3B%0A%20%20if(message.action%3D%3D%3D%22script%22)%7B%0A%20%20%20%20const%20scriptElement%20%3D%20document.createElement(%22script%22)%3B%0A%20%20%20%20scriptElement.text%20%3D%20message.script%3B%0A%20%20%20%20document.head.appendChild(scriptElement)%3B%0A%20%20%7D%0A%20%20window.removeEventListener(%22message%22%2C%20onWindowMessage)%3B%0A%7D%0Awindow.addEventListener(%22message%22%2ConWindowMessage)%3B%0Awindow.parent.postMessage(%22%7B%5C%22event%5C%22%3A%5C%22iframe%5C%22%7D%22%2C'*')%3B%0A%3C%2Fscript%3E:13
data:text/html,%0A%…:1 Refused to execute script from 'https://app.diagrams.net/math/MathJax.js?config=TeX-MML-AM_SVG-full' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Delete update file make it work normally image

My current solution:

Downgrade back to Obsidian 1.4 image

AdvMaple avatar Dec 30 '23 11:12 AdvMaple

Quick Solution Found

Created a bug report on Obsidian Forum: forum

Delete this file in obsidian-1.5.3.asar works!!

image

If you guy need the file editted and packed. Just replace the file obsidian-1.5.3.zip

Prove

image

Step to do it your self:

Command used:

  1. Install asar: npm install -g asar
  2. unpack the update
  3. edit the bug causing line in index.html
  4. pack the file
  5. run Obsidian again, and it works now.

image

AdvMaple avatar Dec 30 '23 12:12 AdvMaple

Thank you for the quick-fix. When I try the commands in the Terminal (Mac), I get only: ".: is a directory" I also tried replacing the .asar file, but the finder does not find it.

Could you maybe explain it for someone who has no idea about those things?

BeJa1996 avatar Jan 06 '24 14:01 BeJa1996

Thank you for the quick-fix. When I try the commands in the Terminal (Mac), I get only: ".: is a directory" I also tried replacing the .asar file, but the finder does not find it.

Could you maybe explain it for someone who has no idea about those things?

Please include a full log of the commands you've run and their output next time. I'm guessing code . is giving you the error. At that part you should just open the build_unpack folder, open the index.html and delete the line that has been already given in the previous line.


From Obsidian 1.5, a new Content Security Policy is enforced for external themes, images, audios and anything being media/style related. WhiteNoise, a Obsidian Developer, stated that this won't change to preserve the security of the user. Instead of loading those remotely, we should embed them in the code using base64.

I will try to look for the stylesheets that are loaded remotely myself, but as I am pretty inexperienced with the code-base of this project, some support would speed this up a notch.

SteinGaming avatar Jan 07 '24 10:01 SteinGaming

Update, found the solution to the majority of the problem. It lies within the loadStylesheet(href: string) function in src/drawio-client/init/RequestManager.ts:

export function loadStylesheet(href: string) {
  const link = document.createElement("link");
  link.setAttribute("rel", "stylesheet");
  link.setAttribute("href", href);
  document.head.appendChild(link);
}

This function gets called by src/drawio-client/init/index.ts with the string "local://drawio.css".


Even though the url uses the prefix local://, it's still considered a external stylesheet.

Found simple fix

import drawioCss from "inline!./src/drawio-client/drawio.css";
export function loadStylesheet() {
  const style = document.createElement("style");
  style.innerHTML = drawioCss
  document.head.appendChild(style);
}

Problem

This fix repairs the Layout, but does not respect any themes selected e. g. it's always in light mode.

SteinGaming avatar Jan 07 '24 12:01 SteinGaming

An official fix for this issue would make this person very very happy!

jn-novasol avatar Jan 17 '24 12:01 jn-novasol

Also looking for an official fix in lieu of downgrading. Is an official fix being actively worked on?

molaw avatar Jan 17 '24 15:01 molaw

Not the ideal solution, but I've built the project with the fix proposed by @SteinGaming. The transpiled "main.js"-file needs to be swapped out in the local plugin folder, e.g. "[vault_name]/.obsidian/plugins/drawio-obsidian" to include the changes in your local installation. The changes apply after restarting obsidian.

For anyone who does not want to build the project themselves, a transpiled "main.js"-file can be downloaded from https://drive.google.com/file/d/13Ow5pKLMWzNOUMG3zNZA1szMBE9lKvT-/view?usp=drive_link

plc-dev avatar Jan 25 '24 08:01 plc-dev

Not the ideal solution, but I've built the project with the fix proposed by @SteinGaming. The transpiled "main.js"-file needs to be swapped out in the local plugin folder, e.g. "[vault_name]/.obsidian/plugins/drawio-obsidian" to include the changes in your local installation. The changes apply after restarting obsidian.

For anyone who does not want to build the project themselves, a transpiled "main.js"-file can be downloaded from https://drive.google.com/file/d/13Ow5pKLMWzNOUMG3zNZA1szMBE9lKvT-/view?usp=drive_link

@plc-dev I appreciate you making this fix however please upload it into a gist or a branch/fork instead of google drive!

I have opened a PR with what is essentially the fix offered in this thread (thanks ya'll!) It's open at #90. The dark/light mode switching doesn't seem to be working and dark mode is partial (but better than nothing). If you don't want it, remove the line adding the dark mode css from that init file. Open to feedback/help getting things working correctly since this project seems unmaintained atm!

CobyPear avatar Jan 27 '24 16:01 CobyPear

Quick Solution Found

Created a bug report on Obsidian Forum: forum

Delete this file in obsidian-1.5.3.asar works!!

image

If you guy need the file editted and packed. Just replace the file obsidian-1.5.3.zip

Prove

image

Step to do it your self:

Command used:

  1. Install asar: npm install -g asar
  2. unpack the update
  3. edit the bug causing line in index.html
  4. pack the file
  5. run Obsidian again, and it works now.

image

Thank you a lot!!

AlexShyXie avatar Feb 06 '24 03:02 AlexShyXie

Not the ideal solution, but I've built the project with the fix proposed by @SteinGaming. The transpiled "main.js"-file needs to be swapped out in the local plugin folder, e.g. "[vault_name]/.obsidian/plugins/drawio-obsidian" to include the changes in your local installation. The changes apply after restarting obsidian. For anyone who does not want to build the project themselves, a transpiled "main.js"-file can be downloaded from https://drive.google.com/file/d/13Ow5pKLMWzNOUMG3zNZA1szMBE9lKvT-/view?usp=drive_link

@plc-dev I appreciate you making this fix however please upload it into a gist or a branch/fork instead of google drive!

I have opened a PR with what is essentially the fix offered in this thread (thanks ya'll!) It's open at #90. The dark/light mode switching doesn't seem to be working and dark mode is partial (but better than nothing). If you don't want it, remove the line adding the dark mode css from that init file. Open to feedback/help getting things working correctly since this project seems unmaintained atm!

Extremely grateful !!!

rainleon avatar Feb 07 '24 03:02 rainleon

This problem is affecting me too. For obvious reasons, I am reluctant to download and sideload unofficial code. Would very much like an official release that can updated within Obsidian. Thanks!

axb21 avatar Feb 14 '24 18:02 axb21

Not the ideal solution, but I've built the project with the fix proposed by @SteinGaming. The transpiled "main.js"-file needs to be swapped out in the local plugin folder, e.g. "[vault_name]/.obsidian/plugins/drawio-obsidian" to include the changes in your local installation. The changes apply after restarting obsidian. For anyone who does not want to build the project themselves, a transpiled "main.js"-file can be downloaded from https://drive.google.com/file/d/13Ow5pKLMWzNOUMG3zNZA1szMBE9lKvT-/view?usp=drive_link

@plc-dev I appreciate you making this fix however please upload it into a gist or a branch/fork instead of google drive!

I have opened a PR with what is essentially the fix offered in this thread (thanks ya'll!) It's open at #90. The dark/light mode switching doesn't seem to be working and dark mode is partial (but better than nothing). If you don't want it, remove the line adding the dark mode css from that init file. Open to feedback/help getting things working correctly since this project seems unmaintained atm!

Much appreciated. However, AWS logo's on general are still shitty - has anyone encountered this issue?

zMynxx avatar Feb 19 '24 09:02 zMynxx

@zMynxx Curious as to why this file is so much bigger than the original Original, 6,480KB Your File, 8,091KB

Hunanbean-Collective avatar Mar 24 '24 10:03 Hunanbean-Collective

There hasn't been a release of this plugin on Obsidian 2y now, but can confirm the PR introduced by @plc-dev works on my end. Is there a reason the plugin* author hasn't updated the plugin via Obsidian yet is still maintaining the repo?

austin-millan avatar Mar 26 '24 21:03 austin-millan

Should maybe a fork be made, and plugin maintained on a new repo?

JorgenSQ avatar Apr 11 '24 19:04 JorgenSQ

There hasn't been a release of this plugin on Obsidian 2y now, but can confirm the PR introduced by @plc-dev works on my end. Is there a reason the plugin* author hasn't updated the plugin via Obsidian yet is still maintaining the repo?

this fix is sooo close to working, however, there is still a bug when you try to embed a fresh drawio diagram in excalidraw, such that if you try to save the edited text in some diagram, it breaks your ability to input any text in all of obsidian

snip

image

bllendev avatar May 28 '24 17:05 bllendev

Welcome to try my modified version of obsidian-diagrams-net, added several improvements as followed:

  • Changed how it opens on the TAB and now it will load into the modal window
  • Added a Dark mode, which follows the obsidian setting
  • Double-click to enter the edit
  • Fixed the issue of refreshing after editing in edit and preview modes

likemuuxi avatar Sep 23 '24 02:09 likemuuxi

Not the ideal solution, but I've built the project with the fix proposed by @SteinGaming. The transpiled "main.js"-file needs to be swapped out in the local plugin folder, e.g. "[vault_name]/.obsidian/plugins/drawio-obsidian" to include the changes in your local installation. The changes apply after restarting obsidian. For anyone who does not want to build the project themselves, a transpiled "main.js"-file can be downloaded from https://drive.google.com/file/d/13Ow5pKLMWzNOUMG3zNZA1szMBE9lKvT-/view?usp=drive_link

@plc-dev I appreciate you making this fix however please upload it into a gist or a branch/fork instead of google drive!

I have opened a PR with what is essentially the fix offered in this thread (thanks ya'll!) It's open at #90. The dark/light mode switching doesn't seem to be working and dark mode is partial (but better than nothing). If you don't want it, remove the line adding the dark mode css from that init file. Open to feedback/help getting things working correctly since this project seems unmaintained atm!

Just a heads up: the PR is part of the 1.5.1 release that was launched on 1/14.

I believe the best course of action for this particular ticket to be split into individual issues. I see at least couple active bugs mentioned here, so will list all separate tickets and close this one soon.

wizentex avatar Jan 16 '25 04:01 wizentex