improvement: hide "browser not supported" warning

eclipse-che · Jan 11, 2023 · 5c7ea6a · 5c7ea6a
1 parent 915a51e
commit 5c7ea6a
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 11 deletions.
diff --git a/...ashboard-frontend/src/components/BannerAlert/NotSupportedBrowser/__tests__/index.spec.tsx b/...ashboard-frontend/src/components/BannerAlert/NotSupportedBrowser/__tests__/index.spec.tsx
@@ -13,23 +13,28 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import BannerAlertNotSupportedBrowser from '..';
-import { isSafari } from '../../../../services/helpers/detectBrowser';
+
+const mockIsSupportedBrowser = jest.fn();
+jest.mock('../isSupportedBrowser', () => ({
+  isSupportedBrowser: () => mockIsSupportedBrowser(),
+}));
 
 const unsupportedBrowserMessage = 'The browser you are using is not supported.';
 
 describe('BannerAlertNotSupportedBrowser component', () => {
   it('should not show error message', () => {
+    mockIsSupportedBrowser.mockReturnValue(true);
     render(<BannerAlertNotSupportedBrowser />);
+
     expect(
       screen.queryByText(unsupportedBrowserMessage, {
         exact: false,
       }),
     ).toBeFalsy();
   });
 
-  it('should show error message when error found after mounting', () => {
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (isSafari as any) = true;
+  it('should show error message', () => {
+    mockIsSupportedBrowser.mockReturnValue(false);
     render(<BannerAlertNotSupportedBrowser />);
 
     expect(

diff --git a/packages/dashboard-frontend/src/components/BannerAlert/NotSupportedBrowser/index.tsx b/packages/dashboard-frontend/src/components/BannerAlert/NotSupportedBrowser/index.tsx
@@ -12,25 +12,25 @@
 
 import { Banner } from '@patternfly/react-core';
 import React from 'react';
-import { isSafari } from '../../../services/helpers/detectBrowser';
+import { isSupportedBrowser } from './isSupportedBrowser';
 
 type Props = unknown;
 
 type State = {
-  isNotSupported: boolean;
+  isSupportedBrowser: boolean;
 };
 
 export default class BannerAlertNotSupportedBrowser extends React.PureComponent<Props, State> {
   constructor(props: Props) {
     super(props);
 
     this.state = {
-      isNotSupported: isSafari,
+      isSupportedBrowser: isSupportedBrowser(),
     };
   }
 
   render() {
-    if (this.state.isNotSupported === false) {
+    if (this.state.isSupportedBrowser === true) {
       return null;
     }
 

diff --git a/...end/src/services/helpers/detectBrowser.ts → ...otSupportedBrowser/isSupportedBrowser.tsx b/...end/src/services/helpers/detectBrowser.ts → ...otSupportedBrowser/isSupportedBrowser.tsx
@@ -10,4 +10,7 @@
  *   Red Hat, Inc. - initial API and implementation
  */
 
-export const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+// Tests browser for features it has to support
+export function isSupportedBrowser(): boolean {
+  return true;
+}
diff --git a/packages/dashboard-frontend/src/components/BannerAlert/index.tsx b/packages/dashboard-frontend/src/components/BannerAlert/index.tsx
@@ -14,7 +14,6 @@ import React from 'react';
 import BannerAlertBranding from './Branding';
 import BannerAlertWebSocket from './WebSocket';
 import BannerAlertCustomWarning from './Custom';
-import BannerAlertNotSupportedBrowser from './NotSupportedBrowser';
 
 type Props = unknown;
 
@@ -27,7 +26,6 @@ export class BannerAlert extends React.PureComponent<Props, State> {
     super(props);
     this.state = {
       bannerAlerts: [
-        <BannerAlertNotSupportedBrowser key="BannerAlertNotSupportedBrowser"></BannerAlertNotSupportedBrowser>,
         <BannerAlertWebSocket key="BannerAlertWebSocket"></BannerAlertWebSocket>,
         <BannerAlertBranding key="BannerAlertBranding"></BannerAlertBranding>,
         <BannerAlertCustomWarning key="BannerAlertCustomWarning"></BannerAlertCustomWarning>,