SONAR-17096 Display announcement on window focus

diff --git a/server/sonar-web/src/main/js/app/components/SystemAnnouncement.tsx b/server/sonar-web/src/main/js/app/components/SystemAnnouncement.tsx
index 89e23b08ce6bbd539816b0e3fd083f714646cd78..b889cd478dc9585475a343ab698137f5189efda8 100644 (file)
--- a/server/sonar-web/src/main/js/app/components/SystemAnnouncement.tsx
+++ b/server/sonar-web/src/main/js/app/components/SystemAnnouncement.tsx
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 
-import { isEmpty, keyBy } from 'lodash';
+import { isEmpty, keyBy, throttle } from 'lodash';
 import * as React from 'react';
 import { getValues } from '../../api/settings';
 import { Alert } from '../../components/ui/Alert';
@@ -29,6 +29,8 @@ import withAvailableFeatures, {
 } from './available-features/withAvailableFeatures';
 import './SystemAnnouncement.css';
 
+const THROTTLE_TIME_MS = 10000;
+
 interface State {
   displayMessage: boolean;
   message: string;
@@ -40,13 +42,13 @@ export class SystemAnnouncement extends React.PureComponent<WithAvailableFeature
   componentDidMount() {
     if (this.props.hasFeature(Feature.Announcement)) {
       this.getSettings();
-      document.addEventListener('visibilitychange', this.handleVisibilityChange);
+      window.addEventListener('focus', this.handleVisibilityChange);
     }
   }
 
   componentWillUnmount() {
     if (this.props.hasFeature(Feature.Announcement)) {
-      document.removeEventListener('visibilitychange', this.handleVisibilityChange);
+      window.removeEventListener('focus', this.handleVisibilityChange);
     }
   }
 
@@ -65,11 +67,12 @@ export class SystemAnnouncement extends React.PureComponent<WithAvailableFeature
     });
   };
 
-  handleVisibilityChange = () => {
+  // eslint-disable-next-line react/sort-comp
+  handleVisibilityChange = throttle(() => {
     if (document.visibilityState === 'visible') {
       this.getSettings();
     }
-  };
+  }, THROTTLE_TIME_MS);
 
   render() {
     const { displayMessage, message } = this.state;

diff --git a/server/sonar-web/src/main/js/app/components/__tests__/SystemAnnouncement-test.tsx b/server/sonar-web/src/main/js/app/components/__tests__/SystemAnnouncement-test.tsx
index 1b44b1a34bb8b2d1867251fe3b7e838e9a35452a..e958ef8ae4728df9f88f7ae003b900819ad46da2 100644 (file)
--- a/server/sonar-web/src/main/js/app/components/__tests__/SystemAnnouncement-test.tsx
+++ b/server/sonar-web/src/main/js/app/components/__tests__/SystemAnnouncement-test.tsx
@@ -29,6 +29,12 @@ jest.mock('../../../api/settings', () => ({
   getValues: jest.fn()
 }));
 
+jest.mock('lodash', () => {
+  const lodash = jest.requireActual('lodash');
+  lodash.throttle = (fn: any) => () => fn();
+  return lodash;
+});
+
 it('should display system announcement', async () => {
   (getValues as jest.Mock)
     .mockResolvedValueOnce([
@@ -75,13 +81,13 @@ it('should display system announcement', async () => {
   renderSystemAnnouncement();
 
   expect(screen.queryByRole('alert')).not.toBeInTheDocument();
-  fireEvent(document, new Event('visibilitychange'));
+  fireEvent(window, new Event('focus'));
   expect(screen.queryByRole('alert')).not.toBeInTheDocument();
-  fireEvent(document, new Event('visibilitychange'));
+  fireEvent(window, new Event('focus'));
   expect(screen.queryByRole('alert')).not.toBeInTheDocument();
-  fireEvent(document, new Event('visibilitychange'));
+  fireEvent(window, new Event('focus'));
   expect(screen.queryByRole('alert')).not.toBeInTheDocument();
-  fireEvent(document, new Event('visibilitychange'));
+  fireEvent(window, new Event('focus'));
   expect(await screen.findByRole('alert')).toBeInTheDocument();
   expect(screen.getByText('Foo')).toBeInTheDocument();
 });