Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Desktop hack is not working #73

Closed
aabed opened this issue Aug 16, 2016 · 156 comments
Closed

Desktop hack is not working #73

aabed opened this issue Aug 16, 2016 · 156 comments

Comments

@aabed
Copy link

aabed commented Aug 16, 2016

Hello,
I've tried the hack you posted on your blog but when slack opens I still get the same old theme
But there are errors with slack, I don't know if they matter or not

/usr/bin/slack --disable-gpu %U "slack://?s=');jQuery.ajax({url:'https://cdn.rawgit.com/laCour/slack-night-mode/master/css/black.css',success:function(e){jQuery('<style></style>').appendTo('head').html(e.slice(35).slice(0,-2))}});//" Creating Slack Application (electron) submitUrl is deprecated. Use submitURL instead. (electron) ipc module is deprecated. Use require("electron").ipcMain instead. [Error: Failed to get path] (electron) options.preload is deprecated. Use options.webPreferences.preload instead. (electron) loadUrl is deprecated. Use loadURL instead.

I am using the desktop client on Archlinux

@laCour
Copy link
Owner

laCour commented Aug 16, 2016

Unfortunately this hack no longer works as noted in the blog post, the Slack team fixed this exploit less than a day after I made it public. It's unlikely that there will be/is a way to style the desktop client. I might look into this more in the future if I have time.

@exstral
Copy link

exstral commented Aug 26, 2016

Tip for mac users:
I'm running Slack using the Fluid app. In it you have full access to the web developer inspector and can run a script to activate the theme. If you pay for it you can also add that as a userscript run on every startup :)

Startup script copied from your blog post:

$.ajax({
  url: "https://raw.githubusercontent.com/laCour/slack-night-mode/master/css/raw/black.css",
  success: function(css) {
    $("<style></style>").appendTo("head").html(css.slice(35).slice(0, -2));
  }
});

Thank you for this awesome styling!

⚠️ AUTHOR WARNING: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@laCour
Copy link
Owner

laCour commented Mar 17, 2017

@RUSshy Yeah, I've known about this. It works, but it's a less than ideal solution. I'd prefer a way that doesn't modify Slack's source.

Similarly, with this theme you'd just append the following to app.asar.unpacked/src/static/ssb-interop.js:

document.addEventListener('DOMContentLoaded', function() {
 $.ajax({
   url: 'https://raw.githubusercontent.com/laCour/slack-night-mode/master/css/raw/black.css',
   success: function(css) {
     $("<style></style>").appendTo('head').html(css);
   }
 });
});

On Arch, this is in /usr/lib/slack/resources.

🛑 READ FIRST: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@widget-
Copy link

widget- commented Mar 20, 2017

@laCour You can get it to modify the team bar on the left too. See widget-/slack-black-theme/readme.md.

@laCour
Copy link
Owner

laCour commented Apr 23, 2017

@widget- Thanks for the info! I'll be adding styles for the team bar shortly.

@potto007
Copy link

potto007 commented Jun 9, 2017

Thanks for sharing this, @laCour. I slapped a rough script together for my team, thought I'd share it here for those wishing to reduce number of steps to 1. ;)

darkify_slack.sh.zip

⚠️ AUTHOR WARNING: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@jeffwklein
Copy link

jeffwklein commented Jun 9, 2017

@potto007 worked great -- thanks for the script!

@pointlessbuttonstudios
Copy link

Oh thank you so much, I was being blinded!!
All my code environments and most of my other programs are dark themed, this was absolutely fantastic!
❤️

@MHaendel
Copy link

This is awesome, please integrate as an option

@Lemmmy
Copy link
Contributor

Lemmmy commented Jul 22, 2017

it can't really be integrated with an option

@olets
Copy link
Contributor

olets commented Aug 1, 2017

Thanks @potto007! To save others from having to look: on macOS, the file is at

/Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js

@jkremser
Copy link
Contributor

jkremser commented Aug 2, 2017

Thanks for the script, here is a modification of it that works on Fedora https://gist.github.com/Jiri-Kremser/2716ff5c6918cc6538f96b56e46f8c13

⚠️ AUTHOR WARNING: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@olets olets mentioned this issue Aug 2, 2017
@ransagy
Copy link

ransagy commented Aug 6, 2017

Nice, This also helped me use the theme when wrapping the slack web version in Electron (don't ask), where even injecting the css itself didn't seem to work.

@BluefireJaguar
Copy link

QQ, the highlight when someone mentions you or uses @everyone is realllllly unreadable. Any chance this can be updated to be better?

@Lemmmy
Copy link
Contributor

Lemmmy commented Aug 11, 2017

post a separate issue with screenshots @BluefireJaguar

@kingbyter
Copy link

I don't think this works anymore. My laptop auto-updated to the latest slack, and now this doesn't work anymore. Am I doing something wrong? Or is it just that I updated?

@laCour
Copy link
Owner

laCour commented Aug 20, 2017

@BattleLord4000 This will break across updates. You'll need to reapply the changes.

@kingbyter
Copy link

I did that
now I'm trying reinstalling slack and doing it again

@kingbyter
Copy link

is there a specific location in which you need to put the code?

@laCour
Copy link
Owner

laCour commented Aug 20, 2017

@BattleLord4000 I can confirm that this still works with the latest update. The code should be placed at the very bottom of the ssb-interop.js file. The location of this file depends on your OS; others have shared several paths above.

@kingbyter
Copy link

I know where the file is, I was just wondering where to paste the code, because I had been pasting it in the middle of the code. I think this should work thanks.

@kingbyter
Copy link

It worked, thanks for everything!

@Chase-Bullock
Copy link

Chase-Bullock commented Aug 21, 2017

This is not working for me, I pasted the code at the bottom of the file ssb-interop.js I tried it at it's current location and also tried putting it below the last line 'start'.

//do not migrate preload script into TypeScript
require('../stat-cache');

const profiler = require('../utils/profiler.js');
if (profiler.shouldProfile()) profiler.startProfiling();

let assignIn = require('lodash').assignIn;
let path = require('path');
let isPrebuilt = require('../utils/process-helpers').isPrebuilt;

// tslint:disable-next-line
process.on('uncaughtException', (e) => console.error(e));

// Warning: You almost certainly do *not* want to edit this code - instead, you
// want to edit src/ssb/main.js instead
let start = function(loadSettings) {
  window.loadSettings = loadSettings;

  const mainModule = path.join(loadSettings.resourcePath, 'src', 'ssb', 'main.ts');
  const isDevMode = loadSettings.devMode && isPrebuilt();
  require('electron-compile').init(loadSettings.resourcePath, mainModule, !isDevMode);
};

const processRef = window.process;
process.nextTick(function() { // eslint-disable-line
  // Patch global back in
  window.process = processRef;
});

// NB: For whatever reason, we have to wait longer to restore 'global'
// Update (2017.Jan.18): This context 'restoration' causes unexpected state mutation in post,
// especially related to check selection state via $("selection.user") when compositionupdate event fired.
// As it does not have clear usecases at the moment, blocking it to prevent webapp abnormality
// setTimeout(function() { window.global = window; }, 10);

document.addEventListener('DOMContentLoaded', function() {
 $.ajax({
   url: 'https://cdn.rawgit.com/laCour/slack-night-mode/master/css/raw/black.css',
   success: function(css) {
     $("<style></style>").appendTo('head').html(css);
   }
 });
});

start(assignIn({}, require('electron').remote.getGlobal('loadSettings'), { windowType: 'WEBAPP' }));

⚠️ AUTHOR WARNING: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@potto007
Copy link

Hmm - if I recall correctly, I had to quit out of Slack and reopen it prior to running the script this time around... it was late though, so I don't recall clearly. Can you try that, followed by CMD-R inside of Slack?

Thanks,
Paul

@Chase-Bullock
Copy link

ctrl+r worked for me. I appreciate the help.

Thanks,
Chase

@andresmaiden
Copy link

In Gubuntu 17.04 I've to change the path to:
/usr/lib/slack/resources/app.asar.unpacked/src/static/ssb-interop.js

@if1mad
Copy link

if1mad commented Sep 12, 2017

@laCour it seems slack has changed some stuff and your amazing fix no longer works. :(

@laCour
Copy link
Owner

laCour commented Sep 12, 2017

@Qwatuz The Slack client was recently updated, but it still works. Updates will remove the patch in ssb-interop.js. You should reapply the style patch. The theme is a bit out of date due to recent changes, but a release should be coming in the next day or so.

@simbalinux
Copy link

simbalinux commented Jul 30, 2018 via email

@lacostenycoder
Copy link

lacostenycoder commented Sep 22, 2018

Easily toggle between day and night mode

Not sure where my original post went but here is my updated gist for a ruby script which can be run from the terminal in default night-mode or simple toggle back to day mode. It's recently updated and tested with latest version of this theme.
https://gist.github.com/lacostenycoder/23d05ace816de0f39e9e6aa940172b91

⚠️ AUTHOR WARNING: This will request the compiled CSS file from this repository. You are strongly discouraged from using a remote CSS file that is not under your control. It's recommended that you create your own copy. An XSS attack could put your Slack client at risk.

@lvh
Copy link

lvh commented Sep 25, 2018

Suggestion: copy the CSS file to your own gist, or fork the repo. Right now, if anyone can update that CSS file so it ends in </style><script>alert(document.domain);</script\>, they trivially get XSS.

@lacostenycoder
Copy link

lacostenycoder commented Sep 30, 2018

@lvh Thanks! I've forked the repo and updated instructions in the gist to instruct others to do the same. @andrewcartwright1 see instructions on my gist as you'll probably wanna do something similar and update your instructions as well.

@tuandm
Copy link

tuandm commented Oct 1, 2018

@lacostenycoder Thanks for your script, looks like it's not working on Mojave.

@lacostenycoder
Copy link

@tuandm when you say "it's not working", what is the behavior you're getting? Does the script throw any errors? Did you follow the install instructions?

@hapylestat
Copy link

to not download css each time from internet, just use cssminify, replace " to \" and change the stub to:

document.addEventListener('DOMContentLoaded', function() {
  var css="<here is your long minified css>";
   $("<style></style>").appendTo('head').html(css);
}

@tuandm
Copy link

tuandm commented Oct 2, 2018

@tuandm when you say "it's not working", what is the behavior you're getting? Does the script throw any errors? Did you follow the install instructions?

Hi @lacostenycoder, sorry not showing detail issue.
Here are the steps which I've done:

  • Forked github to my repo, make the nightslack.rb executable, then run ./nightslack.rb
➜  bin sudo ./nightslack.rb
Password:
Slack Normal night mode has been set!

The slack app has been restarted but no dark theme is activated. Let me know if you need more information.

Here is the content of my ssb-interop.js (which was changed by nightslack.rb) https://gist.github.com/tuandm/c4363ce8f32e4fddc50f2a91bd071f41

@lacostenycoder
Copy link

@tuandm what version of slack desktop do you have? Also as per instructions in my gist you should fork your own copy of THIS REPO modify the ruby script to pull from your repo so change this line:

url: 'https://rawgit.com/lacostenyc/slack-night-mode/master/css/raw/black.css',
and replace lacostenyc to probably tuandm.

But this has not been tested with any Slack version > 3.3.3(beta)

@lacostenycoder
Copy link

lacostenycoder commented Oct 2, 2018

to not download css each time from internet, just use cssminify, replace " to \" and change the stub to:

document.addEventListener('DOMContentLoaded', function() {
  var css="<here is your long minified css>";
   $("<style></style>").appendTo('head').html(css);
}

Yes I thought of that, however, I don't want to have to maintain the CSS locally and will simply update my fork of this repo when updates are available. And since Slack is pretty useless without an internet connection, I don't care about the ajax call at runtime. I generally don't restart slack too often except when it crashes 😁

@hapylestat
Copy link

@lacostenycoder sure, it makes sense. Hardcode solution could be handy for ppl who uses mobile/limited internet or don't wanna something, what could be compromised (attack to nameserver for example).

@madjomack
Copy link

to not download css each time from internet, just use cssminify, replace " to \" and change the stub to:

document.addEventListener('DOMContentLoaded', function() {
  var css="<here is your long minified css>";
   $("<style></style>").appendTo('head').html(css);
}

@hapylestat
I must be doing something wrong while doing this. Can you send me an example of what the index.js file should look like? I prefer to keep it local and manually update as needed.

Thanks,

@hapylestat
Copy link

@madjomack index.js isthe wrong place, use ssb-interop.js instead

@lacostenycoder
Copy link

I have updated my GIST to check for possible JS code injection and abort if any are found.

@lvh
Copy link

lvh commented Oct 4, 2018

@lacostenycoder Doesn't that ruby script only run once, or am I misunderstanding how this works?

@lvh
Copy link

lvh commented Oct 4, 2018

@lacostenycoder Never mind; I definitely misunderstood :) Some comments:

  • You should also check for img tags, on* attributes, etc etc. Perhaps it would be easier to parse it as CSS via the Sass compiler.
  • On line 27: shouldn't this use the url variable instead of being a hardcoded path? Right now it appears the injected code will still use the original URL.

@lvh
Copy link

lvh commented Oct 4, 2018

I'd also try a link rel=stylesheet; but GitHub serves up the CSS as text/plain which browsers won't attempt to parse as CSS. I don't know of a way to specify a content type. If you serve it up via GitHub pages though, that should work fine and be safer.

I'd also see if you can do it with createElement and setting the textContent instead of using jQuery.

I haven't tried this in electron so I have no idea which ones will work in Chrome but not Electron.

@lacostenycoder
Copy link

@lacostenycoder Never mind; I definitely misunderstood :) Some comments:

  • You should also check for img tags, on* attributes, etc etc. Perhaps it would be easier to parse it as CSS via the Sass compiler.
  • On line 27: shouldn't this use the url variable instead of being a hardcoded path? Right now it appears the injected code will still use the original URL.

I do use the SASS compiler to validate the remote css and it will error if it has anything malicious. I also updated the code to use the downloaded css file (after sass check) and inject it on ajax success. with a secondary check inside the callback. I was unable to directly inject the local css without the ajax callback, not sure why but I'm kinda done with this for now because it's working and I feel safe about security. This works fine in the desktop app (Electron), and I just use Stylish theme for Chrome in the rare case I need it in my browser. Thanks

@lvh
Copy link

lvh commented Oct 5, 2018

Gotcha. But you're running this ruby script every time to start Slack, and so the window for someone to switch it up is very small? That'd be something I've seen exploited if the attacker owns the webserver, but with rawgit I agree that it's probably safe.

That said: keep in mind Stylish has done some bad stuff recently, and is in a position to take over your entire browser: https://securityboulevard.com/2018/07/stylish-extension-stole-all-your-browsing-history-from-chrome-and-firefox/

@lacostenycoder
Copy link

@lvh wow on that stylish stuff... crap. I really like using it. Is there any way to close the security holes I wonder?

@laCour
Copy link
Owner

laCour commented Oct 5, 2018

@lacostenycoder I'll try to provide a suggested solution for this on the weekend using suggestions provided by lvh.

@lacostenycoder
Copy link

lacostenycoder commented Oct 5, 2018

@laCour Thanks. I was referring to Stylish. I hate the white-washed internet. Can we write an open sourced version of Stylish? As for my ruby script, I think the latest version is secure.

Edit: Oh duh... I didn't realize this is right here Stylus

@laCour
Copy link
Owner

laCour commented Oct 5, 2018

@lacostenycoder Ah gotcha. That's why the repo's readme suggests only alternatives to the stylish extension. Nobody should be using it anymore. I'd like to see an alternative to userstyles itself, however.

Edit: Looks like this is a viable one: https://openusercss.org/

@lacostenycoder
Copy link

Is it safe to install styles from https://userstyles.org/ to use in Stylus?

@tobiasboyd
Copy link

@lacostenycoder my impression is that it should be safe, I just went in to a style that was active and added </style><script>alert("oops not so good");</script> to it, saved, and reloaded a page it was applied to - the script tag is ignored by Stylus (this is in FF Dev 63.0b11 on macOS 10.13.6).

@aabed aabed closed this as completed Oct 6, 2018
@lvh
Copy link

lvh commented Oct 6, 2018

@tobiasboyd That's not how it works. <script> tags are normally never executed when added to the DOM; they are exceptionally handled by jQuery. There are a gazillion other ways to get javaScript execution.

@lacostenycoder There are two separate problems here:

  • compromises in the extension that applies styles, which effectively has UXSS (universal XSS aka JavaScript code execution in every domain)
  • compromises in the applied style itself.

If you're actually just injecting CSS, you can plausibly expect that to not result in code execution. But the problem is that any extension that has the capability to inject CSS can actually inject whatever it wants. So nothing will save you from a malicious extension (as happened with Stylish) or a buggy extension (as happened in the past with e.g. Chromecast).

@laCour
Copy link
Owner

laCour commented Oct 6, 2018

I've made a gitter room for this project, as that will be a better place to discuss the theme and desktop use. So, I'll be locking this issue.

Feel free to join: https://gitter.im/slack-night-mode/Lobby

Repository owner locked and limited conversation to collaborators Oct 6, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests