Wire-desktop: [Desktop] Scale up/down the whole content as Slack, Skype, and other Electron-based Apps are already doing

Created on 18 Jan 2018  Â·  10Comments  Â·  Source: wireapp/wire-desktop

I really love WIRE, but the its the most annoying issue for me is its "default only" scale factor of the content.. -- while many other Electron-based Apps are already allowing to adapt content scaling, for ex.:

  • Slack : you can select in preferences to change default 100% scale to lower (90%, etc.) or higher (110%, and so on)
  • Skype : with + or - on Mac (or on other OS) you can increase or decrease the whole content scale
  • etc..

and this is looking like something "natural" for Electron-based Apps (like in any web browser as well, and Electron GUI is a browser, right ?) -- so, I'm getting a feeling here that in Wire Desktop this scaling option is just disabled intentionally.. -- is it so ?

  • if yes : any valid reason for this ? could it be optional (e.g. configurable) ?
  • if not : why not get it enabled ? what are the technical issues here ?

Rgds,
-Dimitri

feature / request ✨

Most helpful comment

Zoom in the desktop app is an extremely important feature for me. I am legally blind. This is a critical accessibility feature, and it's built into Chromium and Electron if it is not explicitly disabled as Wire has done.

Please consider making this work, it's really important for some of us.

All 10 comments

Looks like they have the lines webFrame.setVisualZoomLevelLimits(1, 1); and webFrame.setLayoutZoomLevelLimits(1, 1);, so it seems they are explicitly preventing zoom. Not sure exactly what would happen if these lines were removed but I personally see no reason for them to be there and would like to see zooming as an option.

I just tried forcing it to have a zoom level of two and it does zoom in, but it then only takes up the upper left half of the window. I'm not a js or node developer so I have no idea where to attempt to go from there.

The wire-desktop interface is so small on my screen that it's not properly usable (well, with my vision anyway). Definitely need to be able to zoom, very odd that the devs would explicitly disable it.

Zoom in the desktop app is an extremely important feature for me. I am legally blind. This is a critical accessibility feature, and it's built into Chromium and Electron if it is not explicitly disabled as Wire has done.

Please consider making this work, it's really important for some of us.

Yes, the ability to zoom is not "just a cosmetic feature", but an important accessibility feature to enable visually impaired people using the desktop-version of Wire.
I too am now classified as "legally blind" and the most major obstacle of using wire-desktop for me compared to e.g. Signal-Desktop is that wire-desktop has locked off the native capability to zoom its interface individually but has to be done using the operating system's zoom features (if such exist).

If it remains locked off due to developers not having the time to test the result of zooming on the interface's elements, etc, it could maybe be a feature one has to first enable in the options and there being a text there explicitly describing that zooming as "experimental/advanced feature, not fully tested" or similar.

@wireswiss team, I'm sorry, but are you really that insensitive to the needs of visually impaired users?

This issue is related to https://github.com/wireapp/wire/issues/286

Please make it possible asap? This is a huge accessibility issue!

cc @Yserz @ffflorian

Just commenting out webFrame.setVisualZoomLevelLimits(1, 1) or setting it to webFrame.setVisualZoomLevelLimits(1, 3) instead as the Electron documentation claims should be possible To re-enable it does not work, from my quick tests.
It seems until this usability essential feature is fixed by the Wire team, the zoom level has to be set to a fixed level by setting webFrame.setZoomFactor(1.0) to whichever zoom-level you want permanently, where "1.0" should be replaced by "zoom percent divided by 100, so 300% = 3.0", but because the visual elements are not designed for zooming, the contacts-list will start pushing the actual chat part of the window out of the window pretty quickly and by webFrame.setZoomFactor(1.7) or so (on my machine) already started becoming unusable, sooo... try some values for yourself, ranging maybe from 1.1 to 1.6 then. ;-)

I made my tests by running node:13.8.0-stretch from docker, as run --interactive --tty --rm --volume "T:\Temp\wireout":/mnt/wireout node:13.8.0-stretch bash -l (where "T:Temp" must be replaced by wherever you want the output on your system,
then as the hosting test machine is 64-bit Windows and as Wine is required for the packaging of Wire for Windows, and as there is no usable editor included in that docker-image, ran dpkg --add-architecture i386 && apt update && apt install -y wine wine32 wine64 libwine libwine:i386 fonts-wine vim-tiny (see Debian Wiki's Wine-article).
Now I just followed the instructions by doing git clone https://github.com/wireapp/wire-desktop.git && cd wire-desktop.
Then comes the editing of the source-code, the relevant parts of which are easily found by e.g. grep -ir zoom . (currently TWO files).
After editing is done, run yarn && yarn build:win or your equivalent depending on what system you want the final modified binary to be packaged for (see the instructions in this repo's readme/front page).
Finally just cp -ad wrap/build/ /mnt/wireout/ to get all packaged modified executables and all their dependencies copied to a new directory where you chose in the beginning of this process.
Done.
There probably is some much better way for you to do this, probably e.g. including sed, but that's what I did and it worked.

Don't know how a custom-compiled Wire would behave when it's officially time to update, but presumably you'd still get a notification, so you'd then have to do the above process all over again yourself.

In my quick tests webFrame.setZoomFactor(1.2) didn't work.
With webFrame.setVisualZoomLevelLimits(1.2, 1.2) the content was zoomed, but it was blurred.

I tried a different approach in preload-webview.ts:

const override_css = '.text{font-size:120%; line-height:28px}';
webFrame.insertCSS(override_css);

(You have to increase the line-height together with the font-size.)
This finally works as expected!

Hi @dimitrik-fr and the others, sorry for the long wait! This will be finally available with Desktop version 3.20.

Was this page helpful?
0 / 5 - 0 ratings