From 98598c2f9120c5f554801142b54771f7283a2ad5 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Gr=C3=A9goire=20Aubert?= Date: Wed, 24 Apr 2019 09:52:58 +0200 Subject: [PATCH] Fix MetaLink close button --- .../main/js/apps/overview/meta/MetaLink.css | 35 ------------- .../main/js/apps/overview/meta/MetaLink.tsx | 30 ++++++----- .../overview/meta/__tests__/MetaLink-test.tsx | 14 ++++-- .../__snapshots__/MetaLink-test.tsx.snap | 50 +++++++++++++------ 4 files changed, 63 insertions(+), 66 deletions(-) delete mode 100644 server/sonar-web/src/main/js/apps/overview/meta/MetaLink.css diff --git a/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.css b/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.css deleted file mode 100644 index 132735649ba..00000000000 --- a/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.css +++ /dev/null @@ -1,35 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2019 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -.copy-paste-link .overview-key { - width: 80%; -} - -.copy-paste-link .close { - color: #000; - border-bottom: 0; - height: 100%; - display: inline-block; - margin-left: 5px; - box-sizing: border-box; -} - -.copy-paste-link .close svg { - vertical-align: sub; -} diff --git a/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.tsx b/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.tsx index ad4e6965729..0ce5d2b5419 100644 --- a/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.tsx +++ b/server/sonar-web/src/main/js/apps/overview/meta/MetaLink.tsx @@ -18,11 +18,11 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import * as React from 'react'; -import { getLinkName } from '../../projectLinks/utils'; +import ClearIcon from '../../../components/icons-components/ClearIcon'; import ProjectLinkIcon from '../../../components/icons-components/ProjectLinkIcon'; import isValidUri from '../../../app/utils/isValidUri'; -import ClearIcon from '../../../components/icons-components/ClearIcon'; -import './MetaLink.css'; +import { ButtonIcon } from '../../../components/ui/buttons'; +import { getLinkName } from '../../projectLinks/utils'; interface Props { iconOnly?: boolean; @@ -34,13 +34,19 @@ interface State { } export default class MetaLink extends React.PureComponent { - state = { - expanded: false - }; + state = { expanded: false }; handleClick = (event: React.MouseEvent) => { event.preventDefault(); - this.setState(s => ({ expanded: !s.expanded })); + this.setState(({ expanded }) => ({ expanded: !expanded })); + }; + + handleCollapse = () => { + this.setState({ expanded: false }); + }; + + handleSelect = (event: React.MouseEvent) => { + event.currentTarget.select(); }; render() { @@ -59,17 +65,17 @@ export default class MetaLink extends React.PureComponent { {!iconOnly && linkTitle} {this.state.expanded && ( -
+
) => event.currentTarget.select()} + className="overview-key width-80" + onClick={this.handleSelect} readOnly={true} type="text" value={link.url} /> - + - +
)} diff --git a/server/sonar-web/src/main/js/apps/overview/meta/__tests__/MetaLink-test.tsx b/server/sonar-web/src/main/js/apps/overview/meta/__tests__/MetaLink-test.tsx index bff5b122cb8..3f3cea24583 100644 --- a/server/sonar-web/src/main/js/apps/overview/meta/__tests__/MetaLink-test.tsx +++ b/server/sonar-web/src/main/js/apps/overview/meta/__tests__/MetaLink-test.tsx @@ -45,12 +45,12 @@ it('should render dangerous links as plaintext', () => { expect(shallow()).toMatchSnapshot(); }); -it('should expand and collapse link', () => { +it('should expand and collapse dangerous link', () => { const link = { id: '1', - name: 'Foo', - url: 'scm:git:git@github.com', - type: 'foo' + name: 'Dangerous', + url: 'javascript:alert("hi")', + type: 'dangerous' }; const wrapper = shallow(); @@ -63,4 +63,10 @@ it('should expand and collapse link', () => { // collapse click(wrapper.find('a')); expect(wrapper).toMatchSnapshot(); + + // collapse with button + click(wrapper.find('a')); + expect(wrapper.state('expanded')).toBe(true); + click(wrapper.find('ButtonIcon')); + expect(wrapper.state('expanded')).toBe(false); }); diff --git a/server/sonar-web/src/main/js/apps/overview/meta/__tests__/__snapshots__/MetaLink-test.tsx.snap b/server/sonar-web/src/main/js/apps/overview/meta/__tests__/__snapshots__/MetaLink-test.tsx.snap index 256301c711f..eeef601d561 100644 --- a/server/sonar-web/src/main/js/apps/overview/meta/__tests__/__snapshots__/MetaLink-test.tsx.snap +++ b/server/sonar-web/src/main/js/apps/overview/meta/__tests__/__snapshots__/MetaLink-test.tsx.snap @@ -1,55 +1,75 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`should expand and collapse link 1`] = ` +exports[`should expand and collapse dangerous link 1`] = `
  • - Foo + Dangerous
    • `; -exports[`should expand and collapse link 2`] = ` +exports[`should expand and collapse dangerous link 2`] = `
  • - Foo + Dangerous +
    + + + + +
    • `; -exports[`should expand and collapse link 3`] = ` +exports[`should expand and collapse dangerous link 3`] = `
  • - Foo + Dangerous
    • `; -- 2.39.5