From 0a84dbb832f9336ecba6d99cfcaf797555ec98c9 Mon Sep 17 00:00:00 2001
From: Mingwei Samuel <mingwei.samuel@gmail.com>
Date: Fri, 17 Sep 2021 15:04:27 -0700
Subject: [PATCH 1/2] fix: break path w/ <wbr>s to avoid copying ZWSPs (#7516)

- Use <wbr> instead of ZERO-WIDTH SPACE (U+200B) to break segments in
  operation-summary-path.jsx
- Remove no-longer-needed onCopyCapture listener which previously
  stripped ZWSPs
- Update's deep-link.jsx's `text` prop type to accept `PropType.node`
  to allow the above.

Closes #7513
---
 src/core/components/deep-link.jsx              |  2 +-
 src/core/components/operation-summary-path.jsx | 17 ++++++++---------
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/src/core/components/deep-link.jsx b/src/core/components/deep-link.jsx
index 44aa08bba7b..33e1ef444c5 100644
--- a/src/core/components/deep-link.jsx
+++ b/src/core/components/deep-link.jsx
@@ -14,7 +14,7 @@ DeepLink.propTypes = {
   enabled: PropTypes.bool,
   isShown: PropTypes.bool,
   path: PropTypes.string,
-  text: PropTypes.string
+  text: PropTypes.node
 }
 
 export default DeepLink
diff --git a/src/core/components/operation-summary-path.jsx b/src/core/components/operation-summary-path.jsx
index 0bdd521c6c0..16e4f552e8d 100644
--- a/src/core/components/operation-summary-path.jsx
+++ b/src/core/components/operation-summary-path.jsx
@@ -12,12 +12,6 @@ export default class OperationSummaryPath extends PureComponent{
     getComponent: PropTypes.func.isRequired,
   }
 
-  onCopyCapture = (e) => {
-    // strips injected zero-width spaces (`\u200b`) from copied content
-    e.clipboardData.setData("text/plain", this.props.operationProps.get("path"))
-    e.preventDefault()
-  }
-
   render(){
     let {
       getComponent,
@@ -34,17 +28,22 @@ export default class OperationSummaryPath extends PureComponent{
       isDeepLinkingEnabled,
     } = operationProps.toJS()
 
+    // add <wbr> word-break elements between each segment, before the slash
+    const pathParts = path.split(/(?=\/)/g)
+    for (let i = 1; i < pathParts.length; i += 2) {
+      pathParts.splice(i, 0, <wbr key={i} />)
+    }
+
     const DeepLink = getComponent( "DeepLink" )
 
     return(
-      <span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } 
-        onCopyCapture={this.onCopyCapture}
+      <span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" }
         data-path={path}>
         <DeepLink
             enabled={isDeepLinkingEnabled}
             isShown={isShown}
             path={createDeepLinkPath(`${tag}/${operationId}`)}
-            text={path.replace(/\//g, "\u200b/")} />
+            text={pathParts} />
       </span>
 
     )

From dd5903830afa9a2c25717f4dd9f2fce8f636ca1d Mon Sep 17 00:00:00 2001
From: Vladimir Gorej <vladimir.gorej@gmail.com>
Date: Thu, 30 Sep 2021 13:15:32 +0300
Subject: [PATCH 2/2] Update src/core/components/operation-summary-path.jsx

---
 src/core/components/operation-summary-path.jsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/core/components/operation-summary-path.jsx b/src/core/components/operation-summary-path.jsx
index 16e4f552e8d..37b4a0ac54a 100644
--- a/src/core/components/operation-summary-path.jsx
+++ b/src/core/components/operation-summary-path.jsx
@@ -28,7 +28,10 @@ export default class OperationSummaryPath extends PureComponent{
       isDeepLinkingEnabled,
     } = operationProps.toJS()
 
-    // add <wbr> word-break elements between each segment, before the slash
+    /**
+     * Add <wbr> word-break elements between each segment, before the slash
+     * to allow browsers an opportunity to break long paths into sensible segments.
+     */
     const pathParts = path.split(/(?=\/)/g)
     for (let i = 1; i < pathParts.length; i += 2) {
       pathParts.splice(i, 0, <wbr key={i} />)