Global reduced motion config

[JacksonKearl]

On MacOS (and probably windows too), there's a global "reduce motion" configuration. It would be nice if we could have something similar, possibly using that global value by default.

[JacksonKearl]

Started to implement this with f76d07f, using workbench.welcomePage.preferReducedMotion

[isidorn]

I think this makes sense. However we should have a global workbench setting, and not a setting per area. So the user could just flip one setting, and it is up to various workbench areas to respect this setting. Due to that I suggest to name this
workbench.reduceMotion. And in the setting description to explain that this is only supported for now by the welcome page...
preferReducedMotion is not very concise and I am not sure what prefer brings?

[bpasero]

I agree this should be global and Electron has API to ask the OS for its configuration: https://github.com/electron/electron/blob/44491b023ac2653538b7ac36bb73f3085a938666/docs/api/system-preferences.md#systempreferencesgetanimationsettings

[isidorn]

If we can already get this from the OS as @bpasero says maybe we should just respect it out of the box and we do not need a setting at all. Only in the future if users want to disable this automatic respecting of OS setting we can introduce a setting.
I guess we can not get this automatically from the browser? So when in web a setting might make sense.

So I suggest

workbench.reduceMotion: "auto" | "on" | "off"

auto is the default and that means pick ip up from Electron API. For web users would have to explicitly set to "on"

[bpasero]

I think you will always find users that want a setting if you wait long enough. This is probably similar to the settings we have around detecting high contrast theme or dark mode in the OS where we have a setting to override this.

[JacksonKearl]

Added reduce-motion / enable-motion classes to the base .monaco-workbench and some new bits on IAccessibilityService:

readonly onDidChangeReducedMotion: Event<void>;
isMotionReduced(): boolean;

[isidorn]

@JacksonKearl this is a great start.
I think we can disable all usages of animations in css when motion is reduced. A good way to find animation is to search for "keyframe" or "animation-name" in our repository. On top of that we could change the cursor to "editor.cursorBlinking": "solid"

fyi @bpasero @joaomoreno for animations we use

I just tried Apple reduce motion and they do not change mouse hover interaction. So I suggest we keep that.
I will consult accessibility team if there are other things we should disable.

[JacksonKearl]

Interesting, from Apple's Human Interface Guidelines:

Be cautious when displaying moving or blinking elements. Although subtle movement and blinking can draw the user’s attention, these effects can also be distracting and they aren’t useful for people with visual disabilities. Worse, some blinking elements can cause epileptic episodes. In all cases, avoid using movement and blinking as the only way to convey information.

But then they don't disable blinking cursors. Also, with system wide Reduce Motion enabled, I still see blinking cursors everywhere. I think it makes good sense to edit the motion reducing text to include "animation" for queries though, that's what many related settings use already.

[isidorn]

@JacksonKearl thanks for looking into Apple's guidelines.
I have reached out to @DanteGagne and he informed me that Windows has a setting for disabling cursor blink - it is in the old Keyboard Properties section in Control Panel, so it’s not particularly discoverable, but it’s there. VS respects this setting. Also VS does not have a lot of animations so there is not much to disable for them.

@JacksonKearl I guess that on Windows we can not automatically detect if the user disabled the cursor blink?
I leave it up to you if turning this on should disable cursor blinking. I am leaning towards yes, but we can fine tune after we get feedback.