From 49ee415f4a13e435f5d86a125666532b8fb029a9 Mon Sep 17 00:00:00 2001
From: Philippe Perrin <philippe.perrin@sonarsource.com>
Date: Mon, 24 Aug 2020 14:13:54 +0200
Subject: [PATCH] SONAR-13786 Issue message is not displayed correctly when it
 is too long

---
 server/sonar-web/src/main/js/app/styles/init/misc.css     | 4 ++++
 .../main/js/components/issue/components/IssueMessage.tsx  | 2 +-
 .../__tests__/__snapshots__/IssueMessage-test.tsx.snap    | 8 ++++----
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/server/sonar-web/src/main/js/app/styles/init/misc.css b/server/sonar-web/src/main/js/app/styles/init/misc.css
index b987a065653..a5133b41d99 100644
--- a/server/sonar-web/src/main/js/app/styles/init/misc.css
+++ b/server/sonar-web/src/main/js/app/styles/init/misc.css
@@ -580,3 +580,7 @@ th.huge-spacer-right {
   border: 1px solid var(--leakSecondaryColor);
   padding: 4px 6px;
 }
+
+.break-word {
+  word-break: break-word;
+}
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx
index cd2e2a3c600..970748031e9 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx
@@ -38,7 +38,7 @@ export default function IssueMessage(props: IssueMessageProps) {
   const ruleEngine = engineName ? engineName : engine;
 
   return (
-    <div className="issue-message">
+    <div className="issue-message break-word">
       <span className="spacer-right">{message}</span>
       <ButtonLink
         aria-label={translate('issue.why_this_issue.long')}
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap
index f44d6a3ed56..1142d0b5bb8 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`should render correctly: default 1`] = `
 <div
-  className="issue-message"
+  className="issue-message break-word"
 >
   <span
     className="spacer-right"
@@ -21,7 +21,7 @@ exports[`should render correctly: default 1`] = `
 
 exports[`should render correctly: is manual vulnerability 1`] = `
 <div
-  className="issue-message"
+  className="issue-message break-word"
 >
   <span
     className="spacer-right"
@@ -49,7 +49,7 @@ exports[`should render correctly: is manual vulnerability 1`] = `
 
 exports[`should render correctly: with engine info 1`] = `
 <div
-  className="issue-message"
+  className="issue-message break-word"
 >
   <span
     className="spacer-right"
@@ -77,7 +77,7 @@ exports[`should render correctly: with engine info 1`] = `
 
 exports[`should render correctly: with engine name 1`] = `
 <div
-  className="issue-message"
+  className="issue-message break-word"
 >
   <span
     className="spacer-right"
-- 
2.39.5