fix: deep link fragment escaping (via #4832)

* `test/e2e` -> `test/e2e-selenium`

* add Cypress

* ESLint fixes

* MOAR cypress

* `integration` -> `tests`

* wire Cypress up to a hot e2e server

* add failing tests for #4537

* add petstore for future use

* don't tack `operations/` onto href path

* escape generated URL fragments

* Update package.json

src/core/components/operation-summary-path.jsx

@@ -1,6 +1,7 @@
 import React, { PureComponent } from "react"
 import PropTypes from "prop-types"
 import { Iterable } from "immutable"
+import { createDeepLinkPath } from "core/utils"
 import ImPropTypes from "react-immutable-proptypes"
 
 export default class OperationSummaryPath extends PureComponent{
@@ -27,7 +28,6 @@ export default class OperationSummaryPath extends PureComponent{
       isDeepLinkingEnabled,
     } = operationProps.toJS()
 
-    let isShownKey = ["operations", tag, operationId]
     const DeepLink = getComponent( "DeepLink" )
 
     return(
@@ -35,7 +35,7 @@ export default class OperationSummaryPath extends PureComponent{
               <DeepLink
                   enabled={isDeepLinkingEnabled}
                   isShown={isShown}
-                  path={`${isShownKey.join("/")}`}
+                  path={createDeepLinkPath(`${tag}/${operationId}`)}
                   text={path} />
               </span>
 

src/core/plugins/deep-linking/layout.js

@@ -1,5 +1,6 @@
 import { setHash } from "./helpers"
 import zenscroll from "zenscroll"
+import { createDeepLinkPath } from "core/utils"
 import Im, { fromJS } from "immutable"
 
 const SCROLL_TO = "layout_scroll_to"
@@ -31,9 +32,9 @@ export const show = (ori, { getConfigs, layoutSelectors }) => (...args) => {
     }
 
     if (urlHashArray.length === 2) {
-      setHash(`/${type}/${assetName}`)
+      setHash(createDeepLinkPath(`/${type}/${assetName}`))
     } else if (urlHashArray.length === 1) {
-      setHash(`/${type}`)
+      setHash(createDeepLinkPath(`/${type}`))
     }
 
   } catch (e) {
@@ -72,7 +73,9 @@ export const parseDeepLinkHash = (rawHash) => ({ layoutActions, layoutSelectors,
       hash = hash.slice(1)
     }
 
-    const isShownKey = layoutSelectors.isShownKeyFromUrlHashArray(hash.split("/"))
+    const hashArray = hash.split("/").map(val => (val || "").replace(/_/g, " "))
+
+    const isShownKey = layoutSelectors.isShownKeyFromUrlHashArray(hashArray)
 
     layoutActions.show(isShownKey, true) // TODO: 'show' operation tag
     layoutActions.scrollTo(isShownKey)