disable vibrancy while dragging window on buggy windows 10 builds (fixes #949)

app/lib/window.ts

@@ -27,6 +27,8 @@ export class Window {
     private windowConfig: ElectronConfig
     private windowBounds: Rectangle
     private closing = false
+    private lastVibrancy: {enabled: boolean, type?: string} | null = null
+    private disableVibrancyWhileDragging = false
 
     get visible$ (): Observable<boolean> { return this.visible }
 
@@ -118,11 +120,12 @@ export class Window {
     }
 
     setVibrancy (enabled: boolean, type?: string) {
+        this.lastVibrancy = { enabled, type }
         if (process.platform === 'win32') {
             if (parseFloat(os.release()) >= 10) {
                 let attribValue = AccentState.ACCENT_DISABLED
                 if (enabled) {
-                    if (parseInt(os.release().split('.')[2]) >= 17063 && type === 'fluent') {
+                    if (type === 'fluent') {
                         attribValue = AccentState.ACCENT_ENABLE_ACRYLICBLURBEHIND
                     } else {
                         attribValue = AccentState.ACCENT_ENABLE_BLURBEHIND
@@ -132,6 +135,8 @@ export class Window {
             } else {
                 DwmEnableBlurBehindWindow(this.window, enabled)
             }
+        } else {
+            this.window.setVibrancy(enabled ? 'dark' : null as any) // electron issue 20269
         }
     }
 
@@ -294,6 +299,29 @@ export class Window {
         })
 
         this.window.webContents.on('new-window', event => event.preventDefault())
+
+        ipcMain.on('window-set-disable-vibrancy-while-dragging', (_event, value) => {
+            this.disableVibrancyWhileDragging = value
+        })
+
+        this.window.on('will-move', () => {
+            if (!this.lastVibrancy?.enabled || !this.disableVibrancyWhileDragging) {
+                return
+            }
+            let timeout: number|null = null
+            const oldVibrancy = this.lastVibrancy
+            this.setVibrancy(false)
+            const onMove = () => {
+                if (timeout) {
+                    clearTimeout(timeout)
+                }
+                timeout = setTimeout(() => {
+                    this.window.off('move', onMove)
+                    this.setVibrancy(oldVibrancy.enabled, oldVibrancy.type)
+                }, 500)
+            }
+            this.window.on('move', onMove)
+        })
     }
 
     private destroy () {

terminus-core/src/api/index.ts

@@ -19,3 +19,4 @@ export { HostAppService, Platform } from '../services/hostApp.service'
 export { ShellIntegrationService } from '../services/shellIntegration.service'
 export { ThemesService } from '../services/themes.service'
 export { TabsService } from '../services/tabs.service'
+export * from '../utils'

terminus-core/src/services/hostApp.service.ts

@@ -4,6 +4,7 @@ import { Observable, Subject } from 'rxjs'
 import { Injectable, NgZone, EventEmitter } from '@angular/core'
 import { ElectronService } from './electron.service'
 import { Logger, LogService } from './log.service'
+import { isWindowsBuild, WIN_BUILD_FLUENT_BG_MOVE_BUG_FIXED, WIN_BUILD_FLUENT_BG_SUPPORTED } from '../utils'
 
 export enum Platform {
     Linux, macOS, Windows,
@@ -164,6 +165,14 @@ export class HostAppService {
         electron.ipcRenderer.on('host:config-change', () => this.zone.run(() => {
             this.configChangeBroadcast.next()
         }))
+
+
+        if (
+            isWindowsBuild(WIN_BUILD_FLUENT_BG_SUPPORTED) &&
+            !isWindowsBuild(WIN_BUILD_FLUENT_BG_MOVE_BUG_FIXED)
+        ) {
+            electron.ipcRenderer.send('window-set-disable-vibrancy-while-dragging', true)
+        }
     }
 
     /**
@@ -219,14 +228,12 @@ export class HostAppService {
      *
      * @param type `null`, or `fluent` when supported (Windowd only)
      */
-    setVibrancy (enable: boolean, type: string) {
+    setVibrancy (enable: boolean, type: string|null) {
+        if (!isWindowsBuild(WIN_BUILD_FLUENT_BG_SUPPORTED)) {
+            type = null
+        }
         document.body.classList.toggle('vibrant', enable)
-        if (this.platform === Platform.macOS) {
+        this.electron.ipcRenderer.send('window-set-vibrancy', enable, type)
-            this.getWindow().setVibrancy(enable ? 'dark' : null as any) // electron issue 20269
-        }
-        if (this.platform === Platform.Windows) {
-            this.electron.ipcRenderer.send('window-set-vibrancy', enable, type)
-        }
     }
 
     setTitle (title: string) {

terminus-core/src/utils.ts

@@ -3,6 +3,8 @@ import * as os from 'os'
 export const WIN_BUILD_CONPTY_SUPPORTED = 17692
 export const WIN_BUILD_CONPTY_STABLE = 18309
 export const WIN_BUILD_WSL_EXE_DISTRO_FLAG = 17763
+export const WIN_BUILD_FLUENT_BG_SUPPORTED = 17063
+export const WIN_BUILD_FLUENT_BG_MOVE_BUG_FIXED = 18917
 
 export function isWindowsBuild (build: number): boolean {
     return process.platform === 'win32' && parseFloat(os.release()) >= 10 && parseInt(os.release().split('.')[2]) >= build

terminus-settings/src/components/settingsTab.component.ts

@@ -1,5 +1,4 @@
 import * as yaml from 'js-yaml'
-import * as os from 'os'
 import { Subscription } from 'rxjs'
 import { Component, Inject, Input, HostBinding, NgZone } from '@angular/core'
 import {
@@ -14,6 +13,8 @@ import {
     Platform,
     HomeBaseService,
     ShellIntegrationService,
+    isWindowsBuild,
+    WIN_BUILD_FLUENT_BG_SUPPORTED,
 } from 'terminus-core'
 
 import { SettingsTabProvider } from '../api'
@@ -81,9 +82,7 @@ export class SettingsTabComponent extends BaseTabComponent {
             this.hotkeyDescriptions = descriptions
         })
 
-        this.isFluentVibrancySupported = hostApp.platform === Platform.Windows
+        this.isFluentVibrancySupported = isWindowsBuild(WIN_BUILD_FLUENT_BG_SUPPORTED)
-            && parseFloat(os.release()) >= 10
-            && parseInt(os.release().split('.')[2]) >= 17063
     }
 
     async ngOnInit () {

terminus-terminal/src/components/appearanceSettingsTab.component.ts

@@ -5,10 +5,9 @@ import deepEqual from 'deep-equal'
 const fontManager = require('fontmanager-redux') // eslint-disable-line
 
 import { Component, Inject } from '@angular/core'
-import { ConfigService, HostAppService, Platform, ElectronService } from 'terminus-core'
+import { ConfigService, HostAppService, Platform, ElectronService, getCSSFontFamily } from 'terminus-core'
 import { TerminalColorSchemeProvider } from '../api/colorSchemeProvider'
 import { TerminalColorScheme } from '../api/interfaces'
-import { getCSSFontFamily } from '../utils'
 
 /** @hidden */
 @Component({

terminus-terminal/src/components/shellSettingsTab.component.ts

@@ -2,11 +2,10 @@ import slug from 'slug'
 import { Component } from '@angular/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { Subscription } from 'rxjs'
-import { ConfigService, ElectronService, HostAppService, Platform } from 'terminus-core'
+import { ConfigService, ElectronService, HostAppService, Platform, WIN_BUILD_CONPTY_SUPPORTED, WIN_BUILD_CONPTY_STABLE, isWindowsBuild } from 'terminus-core'
 import { EditProfileModalComponent } from './editProfileModal.component'
 import { Shell, Profile } from '../api/interfaces'
 import { TerminalService } from '../services/terminal.service'
-import { WIN_BUILD_CONPTY_SUPPORTED, WIN_BUILD_CONPTY_STABLE, isWindowsBuild } from '../utils'
 
 /** @hidden */
 @Component({

terminus-terminal/src/components/terminalTab.component.ts

@@ -1,11 +1,10 @@
 import { Component, Input } from '@angular/core'
 import { Subscription } from 'rxjs'
 import { first } from 'rxjs/operators'
-import { BaseTabProcess } from 'terminus-core'
+import { BaseTabProcess, WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from 'terminus-core'
 import { BaseTerminalTabComponent } from '../api/baseTerminalTab.component'
 import { SessionOptions } from '../api/interfaces'
 import { Session } from '../services/sessions.service'
-import { WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from '../utils'
 
 /** @hidden */
 @Component({

terminus-terminal/src/frontends/htermFrontend.ts

@@ -1,6 +1,6 @@
 import { Frontend, SearchOptions } from './frontend'
 import { hterm, preferenceManager } from './hterm'
-import { getCSSFontFamily } from '../utils'
+import { getCSSFontFamily } from 'terminus-core'
 
 /** @hidden */
 export class HTermFrontend extends Frontend {

terminus-terminal/src/frontends/xtermFrontend.ts

@@ -1,6 +1,6 @@
+import { getCSSFontFamily } from 'terminus-core'
 import { Frontend, SearchOptions } from './frontend'
 import { Terminal, ITheme } from 'xterm'
-import { getCSSFontFamily } from '../utils'
 import { FitAddon } from 'xterm-addon-fit'
 import { LigaturesAddon } from 'xterm-addon-ligatures'
 import { SearchAddon } from 'xterm-addon-search'

terminus-terminal/src/services/sessions.service.ts

@@ -6,10 +6,9 @@ import * as nodePTY from 'node-pty'
 import { Observable, Subject } from 'rxjs'
 import { first } from 'rxjs/operators'
 import { Injectable } from '@angular/core'
-import { Logger, LogService, ConfigService } from 'terminus-core'
+import { Logger, LogService, ConfigService, WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from 'terminus-core'
 import { exec } from 'mz/child_process'
 import { SessionOptions } from '../api/interfaces'
-import { WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from '../utils'
 
 /* eslint-disable block-scoped-var */
 

terminus-terminal/src/services/uac.service.ts

@@ -1,10 +1,8 @@
 import * as path from 'path'
 import { Injectable } from '@angular/core'
-import { ElectronService } from 'terminus-core'
+import { ElectronService, WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from 'terminus-core'
 import { SessionOptions } from '../api/interfaces'
 
-import { WIN_BUILD_CONPTY_SUPPORTED, isWindowsBuild } from '../utils'
-
 /** @hidden */
 @Injectable({ providedIn: 'root' })
 export class UACService {

terminus-terminal/src/shells/wsl.ts

@@ -2,11 +2,10 @@ import * as fs from 'mz/fs'
 import slug from 'slug'
 
 import { Injectable } from '@angular/core'
-import { HostAppService, Platform } from 'terminus-core'
+import { HostAppService, Platform, isWindowsBuild, WIN_BUILD_WSL_EXE_DISTRO_FLAG } from 'terminus-core'
 
 import { ShellProvider } from '../api/shellProvider'
 import { Shell } from '../api/interfaces'
-import { isWindowsBuild, WIN_BUILD_WSL_EXE_DISTRO_FLAG } from '../utils'
 
 /* eslint-disable block-scoped-var */