Has anyone developed a good solution for wrapping a webapp as a desktop app on nixos? I have issues with nativefier, etc. And using the shortcuts in chrome have oddities with multiple logins, etc…
Thanks for the suggestions!
2 Likes
I got really annoyed at the discord desktop app and its lack of wayland/nvidia support so I wrote a module to make firefox “apps” even though it doesn’t support ssb: https://github.com/TLATER/dotfiles/blob/7ce77190696375aab3543f7365d298729a548df5/home-modules/firefox-webapp.nix
It’s worked quite well for me, no real issues because it’s literally just browser profiles with some fluff. And as a bonus, no chrome, and no bloat from running dozens of subtly different browsers.
There’s also https://ferdium.org/ if you’re ok with them all sharing one window.
3 Likes
Has anyone developed a good solution for wrapping a webapp as a desktop app on nixos?
What’s the use-case here? Isn’t it a lot easier to just run firefox with the multi-account-container addon?
A few things:
- Having a different WMClass lets me manage the window with my window manager (and bind global keybindings through hyprland, since wayland typically makes mute bindings impossible).
- I use the tab restore feature, this way the clutter of effectively desktop applications doesn’t stick around permanently.
- I get to have separate desktop icons (read: drun entries).
- I don’t need to have a urlbar I don’t use get in the way of what the application is doing.
2 Likes
Faster alt-tab access with a visual indicator (icon). I have a billion tabs open, but a few of them are tools I am referencing all day long. Plus FF does not work with the sites I need to access - so I do not use FF.
Are you sure that’s not just the usual user-agent string matches? Full incompatibilities are rather uncommon, it comes down to essentially just a few codecs that are occasionally used for RTC stuff.
The most high-profile one I’m aware of is Microsoft teams, but even they recently started supporting firefox.
Google haven’t managed to completely delete web standards just yet ;p
No, it’s browser support. For example, I use voice dictation for work in Google Docs. Chrome only. Zoom works better and has more options (use web for transcription on notes), etc.
I love FF, but it just doesn’t work for the services I need.
1 Like
For anyone that comes back to this, I ended up doing this with Chrome (pretty sure it would work for Chromium).
- I prefer this way, as it always loads the explicit URL vs creating the desktop shortcut from the GUI in Chrome. With google accounts, the default account would always load into the app. I have separate “apps” for different Google-related services/IDs.
- caveat, there are no Windows controls which is fine with me due to the tiling controls that I use.
I create a desktop file like this:
[Desktop Entry]
Type=Application
Name=Nixos Discourse
Comment=Launch Nixos Discourse
Icon=/home/dustin/.local/share/icons/hicolor/48x48/apps/nix.png
Exec=google-chrome-stable --app="https://discourse.nixos.org/" %U
Terminal=false
Then via home-manager, I places the files:
home.file."nix-discourse.desktop" = {
source = ./desktop-files/nix-discourse.desktop;
target = ".local/share/applications/nix-discourse.desktop";
};
home.file."nix.png" = {
source = ./icons/nix.png;
target = ".local/share/icons/hicolor/48x48/apps/nix.png";
};
It works great for what I wanted. And all the apps are now declared in Nix!
I did something similar to you, thanks for the idea!
I encounter 1 issue, the icon of the app in the dock it blurry, it starts with the shiny Icon I provided in the desktop file and then changes to this:
Did it happen to you as well?
One other thing, I wonder if there is a way to minimize it to the tray, I fear it’s not possible.
I believe you need to have the image use the correct dimensions and resolution. I have some that are blurry, but I have not spent the time to go back to figure out what is “right.”
Hey TLATER how to import only this part to my nix flake configuration? Only have to import file and use the options?
I don’t currently mark it as an output, and I’m not planning to keep a stable API, so copy the file to your config and just add it to your home-manager modules’ imports.
Then set the options as needed, here’s an example for discord: dotfiles/home-config/config/graphical-applications/discord.nix at 7ce77190696375aab3543f7365d298729a548df5 · TLATER/dotfiles · GitHub
Hey @TLATER - I am attempting to use your FF web wrapper, but I keep getting:
error: attribute 'profiles' missing
at /nix/store/7142iqix4nyp0zbf3rg4wxbphpylxdmy-source/modules/apps/vitally/default.nix:12:23:
11|
12| extraSettings = config.programs.firefox.profiles."Default".settings; # must match the profile name I did in my FF module
| ^
13| backgroundColor = "#202225";
- lib file is here
- I import it here
- and here is a sample of me defining an app here
- And my FF install is here
This is driving my nuts. 
Thanks for your time.
Huh, that’s bizarre. My best guess is that it’s because the module is imported in a different module from where you are defining the app, I’m not sure how well the module system handles imports when done this way. But you’d think that the app module would be missing in that case, so that’s probably not it.
Ah, no. I think it’s because your attrset has that profile name lowercase, you probably want:
extraSettings = config.programs.firefox.profiles.default.settings;
The .name attribute gets its default value from the attribute name, not the other way around.
As a side note, @drupol has prodded me to migrate this stuff to a public repo here: GitHub - TLATER/nix-webapps
I’ve been utterly swamped with work the last couple of weeks, but I intend to make that a usable way of depending on this module (+ allow creating profiles without having to go through home-manager, as @drupol implemented for chromium in the repo).
2 Likes
hm, looking at it, looks like you are now using chromium vs firefox. I was trying to move away from it. Do I still need to have the browser installed?
I was thrown by this:
environment.systemPackages = [
pkgs.nix-webapps.electron
(pkgs.nix-webapps-lib.mkChromiumApp {
appName = "teams";
desktopName = "Microsoft Teams";
icon = ./Microsoft_Office_Teams.svg;
url = "https://teams.microsoft.com";
class = "chrome-teams.microsoft.com__-Default";
})
];
Also, how are you getting the class?
One thing to clarify… I had actually fixed that up. I just realized I pasted in an older error.
extraSettings = config.programs.firefox.profiles.”Default”.settings reflects what I have.