From a3def9f55530f05ecaccfcd6fd77f57e36d7034f Mon Sep 17 00:00:00 2001
From: Wouter Admiraal <wouter.admiraal@sonarsource.com>
Date: Wed, 19 Jun 2019 09:54:01 +0200
Subject: [PATCH] SONAR-11684 Make 'Set as homepage' link more accessible

---
 .../js/components/controls/HomePageSelect.tsx | 21 ++++++++-----------
 .../__tests__/HomePageSelect-test.tsx         |  2 +-
 .../HomePageSelect-test.tsx.snap              |  9 ++++----
 .../resources/org/sonar/l10n/core.properties  |  2 +-
 4 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/server/sonar-web/src/main/js/components/controls/HomePageSelect.tsx b/server/sonar-web/src/main/js/components/controls/HomePageSelect.tsx
index a0dac5630cb..1562f3f97d8 100644
--- a/server/sonar-web/src/main/js/components/controls/HomePageSelect.tsx
+++ b/server/sonar-web/src/main/js/components/controls/HomePageSelect.tsx
@@ -21,6 +21,7 @@ import * as React from 'react';
 import * as classNames from 'classnames';
 import { connect } from 'react-redux';
 import Tooltip from './Tooltip';
+import { ButtonLink } from '../ui/buttons';
 import HomeIcon from '../icons-components/HomeIcon';
 import { translate } from '../../helpers/l10n';
 import { getCurrentUser, Store } from '../../store/rootReducer';
@@ -41,9 +42,7 @@ interface Props extends StateProps, DispatchProps {
 }
 
 class HomePageSelect extends React.PureComponent<Props> {
-  handleClick = (event: React.SyntheticEvent<HTMLAnchorElement>) => {
-    event.preventDefault();
-    event.currentTarget.blur();
+  handleClick = () => {
     this.props.setHomePage(this.props.currentPage);
   };
 
@@ -61,20 +60,18 @@ class HomePageSelect extends React.PureComponent<Props> {
     return (
       <Tooltip overlay={tooltip}>
         {checked ? (
-          <span className={classNames('display-inline-block', this.props.className)}>
+          <span
+            aria-label={tooltip}
+            className={classNames('display-inline-block', this.props.className)}>
             <HomeIcon filled={checked} />
           </span>
         ) : (
-          <a
-            className={classNames(
-              'link-no-underline',
-              'display-inline-block',
-              this.props.className
-            )}
-            href="#"
+          <ButtonLink
+            aria-label={tooltip}
+            className={classNames('link-no-underline', 'set-homepage-link', this.props.className)}
             onClick={this.handleClick}>
             <HomeIcon filled={checked} />
-          </a>
+          </ButtonLink>
         )}
       </Tooltip>
     );
diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/HomePageSelect-test.tsx b/server/sonar-web/src/main/js/components/controls/__tests__/HomePageSelect-test.tsx
index 6a4fa3aa3b9..899985011e2 100644
--- a/server/sonar-web/src/main/js/components/controls/__tests__/HomePageSelect-test.tsx
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/HomePageSelect-test.tsx
@@ -50,7 +50,7 @@ it('should set new home page', async () => {
     users: { currentUser: { isLoggedIn: true } }
   } as Store);
   const wrapper = getWrapper(homepage, store);
-  click(wrapper.find('a'));
+  click(wrapper.find('ButtonLink'));
   await new Promise(setImmediate);
   const currentUser = getCurrentUser(store.getState() as Store) as T.LoggedInUser;
   expect(currentUser.homepage).toEqual(homepage);
diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/HomePageSelect-test.tsx.snap b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/HomePageSelect-test.tsx.snap
index 6a95b160deb..75104dd2245 100644
--- a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/HomePageSelect-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/HomePageSelect-test.tsx.snap
@@ -5,6 +5,7 @@ exports[`should render checked 1`] = `
   overlay="homepage.current"
 >
   <span
+    aria-label="homepage.current"
     className="display-inline-block"
   >
     <HomeIcon
@@ -18,14 +19,14 @@ exports[`should render unchecked 1`] = `
 <Tooltip
   overlay="homepage.check"
 >
-  <a
-    className="link-no-underline display-inline-block"
-    href="#"
+  <ButtonLink
+    aria-label="homepage.check"
+    className="link-no-underline set-homepage-link"
     onClick={[Function]}
   >
     <HomeIcon
       filled={false}
     />
-  </a>
+  </ButtonLink>
 </Tooltip>
 `;
diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
index 43371e87325..4bbe463e6f2 100644
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -3164,7 +3164,7 @@ maintenance.sonarqube_is_offline.text=The connection to SonarQube is lost. Pleas
 #
 #------------------------------------------------------------------------------
 homepage.current=This page is your homepage. Click on the top-left logo to find it anytime.
-homepage.check=Check to make the current page your homepage
+homepage.check=Click to make the current page your homepage
 
 
 
-- 
2.39.5