Merge pull request #4700 from ArekSredzki/async-document-hidden

Cache browser visibility state & emit visibilitychange event on change

atom/browser/api/atom_api_window.cc

@@ -191,6 +191,14 @@ void Window::OnWindowFocus() {
   Emit("focus");
 }
 
+void Window::OnWindowShow() {
+  Emit("show");
+}
+
+void Window::OnWindowHide() {
+  Emit("hide");
+}
+
 void Window::OnWindowMaximize() {
   Emit("maximize");
 }

atom/browser/api/atom_api_window.h

@@ -58,6 +58,8 @@ class Window : public mate::TrackableObject<Window>,
   void OnWindowClosed() override;
   void OnWindowBlur() override;
   void OnWindowFocus() override;
+  void OnWindowShow() override;
+  void OnWindowHide() override;
   void OnWindowMaximize() override;
   void OnWindowUnmaximize() override;
   void OnWindowMinimize() override;

atom/browser/native_window.cc

@@ -428,6 +428,14 @@ void NativeWindow::NotifyWindowFocus() {
   FOR_EACH_OBSERVER(NativeWindowObserver, observers_, OnWindowFocus());
 }
 
+void NativeWindow::NotifyWindowShow() {
+  FOR_EACH_OBSERVER(NativeWindowObserver, observers_, OnWindowShow());
+}
+
+void NativeWindow::NotifyWindowHide() {
+  FOR_EACH_OBSERVER(NativeWindowObserver, observers_, OnWindowHide());
+}
+
 void NativeWindow::NotifyWindowMaximize() {
   FOR_EACH_OBSERVER(NativeWindowObserver, observers_, OnWindowMaximize());
 }

atom/browser/native_window.h

@@ -210,6 +210,8 @@ class NativeWindow : public base::SupportsUserData,
   void NotifyWindowClosed();
   void NotifyWindowBlur();
   void NotifyWindowFocus();
+  void NotifyWindowShow();
+  void NotifyWindowHide();
   void NotifyWindowMaximize();
   void NotifyWindowUnmaximize();
   void NotifyWindowMinimize();

atom/browser/native_window_mac.mm

@@ -79,6 +79,21 @@ bool ScopedDisableResize::disable_resize_ = false;
   return self;
 }
 
+- (void)windowDidChangeOcclusionState:(NSNotification *)notification {
+  // notification.object is the window that changed its state.
+  // It's safe to use self.window instead if you don't assign one delegate to many windows
+  NSWindow *window = notification.object;
+
+  // check occlusion binary flag
+  if (window.occlusionState & NSWindowOcclusionStateVisible)   {
+     // The app is visible
+     shell_->NotifyWindowShow();
+   } else {
+     // The app is not visible
+     shell_->NotifyWindowHide();
+   }
+}
+
 - (void)windowDidBecomeMain:(NSNotification*)notification {
   content::WebContents* web_contents = shell_->web_contents();
   if (!web_contents)

atom/browser/native_window_observer.h

@@ -42,6 +42,12 @@ class NativeWindowObserver {
   // Called when window gains focus.
   virtual void OnWindowFocus() {}
 
+  // Called when window is shown.
+  virtual void OnWindowShow() {}
+
+  // Called when window is hidden.
+  virtual void OnWindowHide() {}
+
   // Called when window state changed.
   virtual void OnWindowMaximize() {}
   virtual void OnWindowUnmaximize() {}

atom/browser/native_window_views.cc

@@ -302,6 +302,8 @@ bool NativeWindowViews::IsFocused() {
 void NativeWindowViews::Show() {
   window_->native_widget_private()->ShowWithWindowState(GetRestoredState());
 
+  NotifyWindowShow();
+
 #if defined(USE_X11)
   if (global_menu_bar_)
     global_menu_bar_->OnWindowMapped();
@@ -311,6 +313,8 @@ void NativeWindowViews::Show() {
 void NativeWindowViews::ShowInactive() {
   window_->ShowInactive();
 
+  NotifyWindowShow();
+
 #if defined(USE_X11)
   if (global_menu_bar_)
     global_menu_bar_->OnWindowMapped();
@@ -320,6 +324,8 @@ void NativeWindowViews::ShowInactive() {
 void NativeWindowViews::Hide() {
   window_->Hide();
 
+  NotifyWindowHide();
+
 #if defined(USE_X11)
   if (global_menu_bar_)
     global_menu_bar_->OnWindowUnmapped();

docs/api/browser-window.md

@@ -245,6 +245,14 @@ Emitted when the window loses focus.
 
 Emitted when the window gains focus.
 
+### Event: 'show'
+
+Emitted when the window is shown.
+
+### Event: 'hide'
+
+Emitted when the window is hidden.
+
 ### Event: 'maximize'
 
 Emitted when window is maximized.

lib/browser/api/browser-window.js

@@ -20,7 +20,7 @@ BrowserWindow.prototype._init = function() {
   }
 
   // Make new windows requested by links behave like "window.open"
-  this.webContents.on('-new-window', function(event, url, frameName) {
+  this.webContents.on('-new-window', (event, url, frameName) => {
     var options;
     options = {
       show: true,
@@ -32,27 +32,21 @@ BrowserWindow.prototype._init = function() {
 
   // window.resizeTo(...)
   // window.moveTo(...)
-  this.webContents.on('move', (function(_this) {
-    return function(event, size) {
-      return _this.setBounds(size);
-    };
-  })(this));
+  this.webContents.on('move', (event, size) => {
+    return this.setBounds(size);
+  });
 
   // Hide the auto-hide menu when webContents is focused.
-  this.webContents.on('activate', (function(_this) {
-    return function() {
-      if (process.platform !== 'darwin' && _this.isMenuBarAutoHide() && _this.isMenuBarVisible()) {
-        return _this.setMenuBarVisibility(false);
-      }
-    };
-  })(this));
+  this.webContents.on('activate', () => {
+    if (process.platform !== 'darwin' && this.isMenuBarAutoHide() && this.isMenuBarVisible()) {
+      return this.setMenuBarVisibility(false);
+    }
+  });
 
   // Forward the crashed event.
-  this.webContents.on('crashed', (function(_this) {
-    return function() {
-      return _this.emit('crashed');
-    };
-  })(this));
+  this.webContents.on('crashed', () => {
+    return this.emit('crashed');
+  });
 
   // Change window title to page title.
   this.webContents.on('page-title-updated', (event, title) => {
@@ -77,36 +71,40 @@ BrowserWindow.prototype._init = function() {
   });
 
   // Redirect focus/blur event to app instance too.
-  this.on('blur', (function(_this) {
-    return function(event) {
-      return app.emit('browser-window-blur', event, _this);
-    };
-  })(this));
-  this.on('focus', (function(_this) {
-    return function(event) {
-      return app.emit('browser-window-focus', event, _this);
-    };
-  })(this));
+  this.on('blur', (event) => {
+    return app.emit('browser-window-blur', event, this);
+  });
+  this.on('focus', (event) => {
+    return app.emit('browser-window-focus', event, this);
+  });
+
+  // Evented visibilityState changes
+  this.on('show', () => {
+    return this.webContents.send('ATOM_RENDERER_WINDOW_VISIBILITY_CHANGE', this.isVisible(), this.isMinimized());
+  });
+  this.on('hide', () => {
+    return this.webContents.send('ATOM_RENDERER_WINDOW_VISIBILITY_CHANGE', this.isVisible(), this.isMinimized());
+  });
+  this.on('minimize', () => {
+    return this.webContents.send('ATOM_RENDERER_WINDOW_VISIBILITY_CHANGE', this.isVisible(), this.isMinimized());
+  });
+  this.on('restore', () => {
+    return this.webContents.send('ATOM_RENDERER_WINDOW_VISIBILITY_CHANGE', this.isVisible(), this.isMinimized());
+  });
 
   // Notify the creation of the window.
   app.emit('browser-window-created', {}, this);
 
   // Be compatible with old APIs.
-  this.webContents.on('devtools-focused', (function(_this) {
-    return function() {
-      return _this.emit('devtools-focused');
-    };
-  })(this));
-  this.webContents.on('devtools-opened', (function(_this) {
-    return function() {
-      return _this.emit('devtools-opened');
-    };
-  })(this));
-  this.webContents.on('devtools-closed', (function(_this) {
-    return function() {
-      return _this.emit('devtools-closed');
-    };
-  })(this));
+  this.webContents.on('devtools-focused', () => {
+    return this.emit('devtools-focused');
+  });
+  this.webContents.on('devtools-opened', () => {
+    return this.emit('devtools-opened');
+  });
+  this.webContents.on('devtools-closed', () => {
+    return this.emit('devtools-closed');
+  });
   return Object.defineProperty(this, 'devToolsWebContents', {
     enumerable: true,
     configurable: false,

lib/renderer/api/ipc-renderer.js

@@ -3,7 +3,7 @@ const v8Util = process.atomBinding('v8_util');
 
 var slice = [].slice;
 
-// Created by init.coffee.
+// Created by init.js.
 const ipcRenderer = v8Util.getHiddenValue(global, 'ipc');
 
 ipcRenderer.send = function() {

lib/renderer/inspector.js

@@ -3,7 +3,7 @@ window.onload = function() {
   InspectorFrontendHost.showContextMenuAtPoint = createMenu;
 
   // Use dialog API to override file chooser dialog.
-  return WebInspector.createFileSelectorElement = createFileSelectorElement;
+  return (WebInspector.createFileSelectorElement = createFileSelectorElement);
 };
 
 var convertToMenuTemplate = function(items) {

lib/renderer/override.js

@@ -3,6 +3,16 @@ const remote = require('electron').remote;
 
 var slice = [].slice;
 
+// Cache browser window visibility
+var _isVisible = true;
+var _isMinimized = false;
+(function() {
+  var currentWindow;
+  currentWindow = remote.getCurrentWindow();
+  _isVisible = currentWindow.isVisible();
+  _isMinimized = currentWindow.isMinimized();
+})();
+
 // Helper function to resolve relative url.
 var a = window.top.document.createElement('a');
 
@@ -30,7 +40,7 @@ var BrowserWindowProxy = (function() {
     ipcRenderer.once("ATOM_SHELL_GUEST_WINDOW_MANAGER_WINDOW_CLOSED_" + this.guestId, (function(_this) {
       return function() {
         BrowserWindowProxy.remove(_this.guestId);
-        return _this.closed = true;
+        return (_this.closed = true);
       };
     })(this));
   }
@@ -87,7 +97,9 @@ window.open = function(url, frameName, features) {
   ref1 = features.split(/,\s*/);
   for (i = 0, len = ref1.length; i < len; i++) {
     feature = ref1[i];
-    ref2 = feature.split(/\s*=/), name = ref2[0], value = ref2[1];
+    ref2 = feature.split(/\s*=/);
+    name = ref2[0];
+    value = ref2[1];
     options[name] = value === 'yes' || value === '1' ? true : value === 'no' || value === '0' ? false : value;
   }
   if (options.left) {
@@ -168,6 +180,17 @@ if (process.openerId != null) {
   window.opener = BrowserWindowProxy.getOrCreate(process.openerId);
 }
 
+ipcRenderer.on('ATOM_RENDERER_WINDOW_VISIBILITY_CHANGE', function (event, isVisible, isMinimized) {
+  var hasChanged = _isVisible != isVisible || _isMinimized != isMinimized;
+  
+  if (hasChanged) {
+    _isVisible = isVisible;
+    _isMinimized = isMinimized;
+
+    document.dispatchEvent(new Event('visibilitychange'));
+  }
+});
+
 ipcRenderer.on('ATOM_SHELL_GUEST_WINDOW_POSTMESSAGE', function(event, sourceId, message, sourceOrigin) {
   // Manually dispatch event instead of using postMessage because we also need to
   // set event.source.
@@ -212,19 +235,17 @@ Object.defineProperty(window.history, 'length', {
 
 // Make document.hidden and document.visibilityState return the correct value.
 Object.defineProperty(document, 'hidden', {
-  get: function() {
-    var currentWindow;
-    currentWindow = remote.getCurrentWindow();
-    return currentWindow.isMinimized() || !currentWindow.isVisible();
+  get: function () {
+    return _isMinimized || !_isVisible;
   }
 });
 
 Object.defineProperty(document, 'visibilityState', {
   get: function() {
-    if (document.hidden) {
-      return "hidden";
-    } else {
+    if (_isVisible && !_isMinimized) {
       return "visible";
+    } else {
+      return "hidden";
     }
   }
 });

spec/api-browser-window-spec.js

@@ -120,14 +120,55 @@ describe('browser-window module', function() {
   });
 
   describe('BrowserWindow.show()', function() {
-    it('should focus on window', function() {
-      if (isCI) {
-        return;
-      }
+    if (isCI) {
+      return;
+    }
 
+    it('should focus on window', function() {
       w.show();
       assert(w.isFocused());
     });
+
+    it('should make the window visible', function() {
+      w.show();
+      assert(w.isVisible());
+    });
+
+    it('emits when window is shown', function(done) {
+      this.timeout(10000);
+      w.once('show', function() {
+        assert.equal(w.isVisible(), true);
+        done();
+      });
+      w.show();
+    });
+  });
+
+  describe('BrowserWindow.hide()', function() {
+    if (isCI) {
+      return;
+    }
+
+    it('should defocus on window', function() {
+      w.hide();
+      assert(!w.isFocused());
+    });
+
+    it('should make the window not visible', function() {
+      w.show();
+      w.hide();
+      assert(!w.isVisible());
+    });
+
+    it('emits when window is hidden', function(done) {
+      this.timeout(10000);
+      w.show();
+      w.once('hide', function() {
+        assert.equal(w.isVisible(), false);
+        done();
+      });
+      w.hide();
+    });
   });
 
   describe('BrowserWindow.showInactive()', function() {