diff --git a/src/core/components/operation-summary-path.jsx b/src/core/components/operation-summary-path.jsx
index 908963347582e5c7bdfcbec210c599186412b16f..0bdd521c6c0de88abfe8bf3c4af8e5d88fb97d38 100644
--- a/src/core/components/operation-summary-path.jsx
+++ b/src/core/components/operation-summary-path.jsx
@@ -12,6 +12,12 @@ 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,
@@ -31,13 +37,15 @@ export default class OperationSummaryPath extends PureComponent{
     const DeepLink = getComponent( "DeepLink" )
 
     return(
-      <span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } >
-              <DeepLink
-                  enabled={isDeepLinkingEnabled}
-                  isShown={isShown}
-                  path={createDeepLinkPath(`${tag}/${operationId}`)}
-                  text={path} />
-              </span>
+      <span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } 
+        onCopyCapture={this.onCopyCapture}
+        data-path={path}>
+        <DeepLink
+            enabled={isDeepLinkingEnabled}
+            isShown={isShown}
+            path={createDeepLinkPath(`${tag}/${operationId}`)}
+            text={path.replace(/\//g, "\u200b/")} />
+      </span>
 
     )
   }
diff --git a/src/style/_layout.scss b/src/style/_layout.scss
index 1ca16bf6b9c4d76c12066fd09e3724d0bf69647b..474ef7a278e68dfcacbe832b0a1e9d40ce5ac3dd 100644
--- a/src/style/_layout.scss
+++ b/src/style/_layout.scss
@@ -245,10 +245,9 @@
 
 
         display: flex;
-        flex: 0 3 auto;
         align-items: center;
 
-        word-break: break-all;
+        word-break: break-word;
 
         padding: 0 10px;
 
@@ -270,7 +269,9 @@
     {
         font-size: 13px;
 
-        flex: 1;
+        flex: 1 1 auto;
+
+        word-break: break-word;
 
         @include text_body();
     }
diff --git a/test/e2e-cypress/tests/bugs/4867.js b/test/e2e-cypress/tests/bugs/4867.js
index 6d328236d5aa67037064b7c7758a846561eedd0f..2a4ae3f4e73b411806e86662469538d9d2729a09 100644
--- a/test/e2e-cypress/tests/bugs/4867.js
+++ b/test/e2e-cypress/tests/bugs/4867.js
@@ -7,8 +7,8 @@ describe("#4867: callback parameter rendering", () => {
       .contains("Callbacks")
       .click()
 
-      .get(".callbacks-container")
-      .contains("http://$request.query.url")
+      .get(".callbacks-container .opblock-summary-path")
+      .should("have.attr", "data-path", "http://$request.query.url")
       .click()
 
       .get(".parameters-container")