Vencord Support

[D3SOX]

From #58

But since some people seem to use this as their main Discord client, I still think this is a valid feature request that could maybe be implemented behind a toggle in the settings.

I think this is great as a main Discord client, especially because it's better for privacy as it's the web version which doesn't have access to your processes etc.

---

The only major thing I'm missing is custom CSS support now. Not sure if that's feasible for the project though.

Perhaps this could be accomplished by allowing to inject Vencord. It has experimental browser support but I haven't tested it yet. I'm not sure if the Qt WebView can load extensions but executing JS should be possible.

[maltejur]

Thanks for the tip, sounds interesting and like a pretty good idea. Injecting Vencord was quite easy:

I am not really sure how to add custom CSS though. Since this is the web version you probably can't place stuff in ~/.config/Vencord and I am not sure if the web version has any other mechanism to do that yet.

I will continue working on this testing out some stuff. My current code is on the vencord branch.

By the way, the way I currently modify the DOM is kinda hacky, so if I get Vencord running I may switch all the DOM manipulation to a Vencord plugin.

[D3SOX]

Hm, okay not sure how custom CSS works with the browser version. Maybe we would need to open an issue for that over on the Vencord repo.

[maltejur]

From looking at VencordNativeStub.ts, I could probably override window.VencordNative to get some native functionality again.

[maltejur]

And about custom CSS, right now that seems to be stored in LocalStorage with the key VencordQuickCss

[D3SOX]

For reference: I use this as custom CSS with the desktop version right now

@import url(https://discord-modifications.github.io/dark-discord/src/source.css);
@import url(https://d3sox.github.io/complementary-discord-theme/complementary.theme.css);

I've compiled the branch but was unable to open devtools. I think for now a small native Qt window that can set that entry would be useful.

[maltejur]

For now you can run discord-screenaudio --remote-debugging, open devtools in a chromium browser via chrome://inspect, and then edit the LocalStorage that way.

[maltejur]

Okay I now have custom CSS from a file working, but there are some major problems with chromium blocking requests to third party domains.

[D3SOX]

Hm, a workaround would be to copy the contents instead of importing it from a remote location. This would come with the drawback of no updates though

[D3SOX]

https://github.com/Vendicated/Vencord/commit/9c7b548a9e8dbcf39360d3eb5eef9e5dad29e40b Maybe that commit helps

[D3SOX]

It now has an editor for custom CSS as of https://github.com/Vendicated/Vencord/commit/4b1e96b76ee4eea16fcb3b5cae74e173541b3c74

[D3SOX]

I've tested the branch with the latest Vencord using the build script and plugins worked, although it was a bit wonky at first. The custom CSS did not work. I saw this weird message in terminal [default] QIODevice::read (QFile, "/home/nico/.config/discord-screenaudio/vencord/quickCss.css"): WriteOnly device and the quickCss.css file is always emptied when starting the client.

[maltejur]

Oh yeah my bad, should be fixed now. The CSP issue remains and still is the main thing holding this back. I still haven't found a clean way to disable CSP in QtWebEngine.

[Curve]

Okay I now have custom CSS from a file working, but there are some major problems with chromium blocking requests to third party domains.

This could be fixed by installing a network interceptor and then just replying back the original content with cors headers

[Curve]

Okay I now have custom CSS from a file working, but there are some major problems with chromium blocking requests to third party domains.

This could be fixed by installing a network interceptor and then just replying back the original content with cors headers

See https://doc.qt.io/qt-6/qwebengineurlrequestinterceptor.html

Qt5 doesn't allow web request interception in such a feature rich fashion as WebView2 but one could use redirect within the interceptor callback and redirect it to a local webserver which then takes care of fetching the original source and adjusting the cors headers (or you could just redirect it to some corseverywhere site)

I may add support for this in saucer soon if I find a prettier way to do it ^^

[ghost]

I cloned and compiled discord-screenaudio from vencord branch and I get this,

[D3SOX]

Yeah, seems like upstream did some changes that need fixing in discord-screenaudio. I guess VencordNativeStub needs to be updated.

[ItsRogueRen]

The one thing holding me back from using this as my daily driver, I need that custom CSS to match my desktop lol

[maltejur]

The one thing holding me back from using this as my daily driver, I need that custom CSS to match my desktop lol

I am not sure if I ever add Vencord to discord-screenaudio, because there is still a lot of work and it probably also isn't that easily maintainable.

But for now I've opted for a much simpler solution. You can now just put your styles into ~/.config/discord-screenaudio/userstyles.css and they will be loaded (see faq for slightly more explanation). Here it is running Alexis Modern Theme:

[ardishko]

How can I inject Vencord into this? I would like to use this client with that.

[TheArcaneBrony]

It seems that styles in userstyles.css are ignored? Is there any way to debug this?

[main] Found userstyles: "/home/root@Rory/.config/discord-screenaudio/userstyles.css"
[main] Injecting  "userstyles.js"

Vencord also crashes the app.

[ardishko]

How do you even get Vencord on this client?

[maltejur]

@TheArcaneBrony what theme are you trying to use? The whole feature is still a bit experimental and does only work in a limited way with external files (any time @import or url() is used in the theme and a web request is made).

@ardishco-the-great right now Vencord is not supported at all. I have done some initial work, but that is broken right now and as previously stated I currently do not work on fixing it.

[maltejur]

I have updated the vencord code a bit to work again with the latest version and included it behind a toggle in the master branch. The CSP issue persists, preventing effective use of theming in Vencord.

[nervyalloy51]

hello, while testing this out i ran into another CSP related problem with the one plugin i wanted to use specifically vencord-listenbrainz-rpc that is based on the built-in LastFMRichPresence, which displays the same issue.

here's the bit of the error (from the official plugin) that seems relevant (LastFM API URL removed for clarity): [discord] Refused to connect to '[URL]' because it violates the following Content Security Policy directive: "connect-src 'self' [list of allowed URLs]

[jvyden]

Did a bit of digging to see if I could find anything that could help but qtwebkit just simply doesn't expose the option to control CSP unfortunately. There's a feature request here but it hasn't seen movement since 2020. A member of the organization did reply in 2019 so I'll give it another bump.

[jvyden]

Whoops, turns out that was an issue for an entirely different project. The maintainer there gave an interesting idea, though. We could maybe patch out the CSP checks and link qtwebengine statically?

It would likely complicate the build process, but I think it's also unlikely that any feature to disable CSP would make it into the Qt5 version since they seem to be pushing things for Qt6 releases.