Deep Linking

[djonser]

Currently, operation and model are part of the path and are thus linkable, allowing me to send a link such as: https://elements-host/operations/my-get-operation and having the user enter that operations context.

User story.

As a user, I wish that the "state" of a viewed operation was reflected in the url at full, so that I could send a single link, rather than a link and a set of steps.

Potential query parameters implementation

• https://elements-host/operations/my-get-operation?code=404&responseMediaType=application%2Fjson

  • When entering the url above, the my-get-operation is pre-selected (just as now), but instead of showing the 200 response, the 404 response is displayed.

• https://elements-host/operations/my-get-operation?requestSampleLanguage=Python&requestSampleLibrary=Python%203

  • When entering the url above, the request sample in python3 should be displayed, overriding the settings that may be stored in localStorage.

• https://elements-host/operations/my-get-operation?code=200&responseMediaType=application%2Fjson&responseExample=example-8

  • When entering the url above, the response example for application/json with key example-8 should be pre-selected.

• https://elements-host/operations/my-get-operation?input.path.id=55&input.query.limit=20&input.query.offset=200

  • When entering the url above, the TryIt component pre-populates input with these values.

• https://elements-host/operations/my-post-operation?input.bodyExample=example-1&input.body.name=cormack&input.body.settings.darkMode=true

  • When entering the url above, the TryIt component first uses the bodyExample selected and then the modifications to the Body.

Full list of potential parameters

• Response Code
• Response Media Type
• Response Example Key
• Request Sample Langugage
• Request Sample Library
• Input Query Parameter Value
• Input Path Parameter Value
• Input Header Parameter Value
• Input Body Example Key
• Input Body Property Vaue
• Server To Use (when/if that becomes a feature)
• Server Variable Value (when/if that becomes a feature)

Potential UX

• When navigating to a different operation, all query parameters are cleared.
• When changing the default response code to response code 400 when viewing this newly navigated too operation, code is appended as a queryParameter.
• When switching back to response code 200 again, queryParamter is updated.
• Same general UX where queryParameters are only appended after user interaction.
• When using a link that may have query parameters pointing to something that is no longer existing in the specification, it should use whatever is the default.
• A warning alert should be shown to the user that the example specified in the query parameter is longer available in the specification, if such is the case.
• A "Copy Full Link" button should be available somewhere that creates a fully query parametered link with all the current defaults viewed.
• This "Copy Full Link" should maybe be a context menu-ish thing, allowing the user to quickly select what is of interest in the link, given that it probably is very common that not every detail is of interest. This helps saving screen real estate in emails and chat messages.

Additional context

Furthermore, tracking the full "state" in the url would improve interaction with Elements from the implementation, whether that is Angular or jQuery.

Reflection

Not having much of any React experience myself, but rather Angular experience, I know that at best this is not a small feature request, and something that may be very complicated depending on current architecture. My own use case what that I only really wanted the response code as part of the url, but I started typing and here we are.

[philsturgeon]

@noor-ahmad we'll probably need a UX perspective on this one when you can.