New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support hyphen -
and other special characters in variable names
#2601
Conversation
-
in variable names
packages/insomnia-app/app/ui/components/templating/tag-editor.js
Outdated
Show resolved
Hide resolved
|
packages/insomnia-app/app/ui/components/codemirror/extensions/nunjucks-tags.js
Outdated
Show resolved
Hide resolved
Another option I've thought of in the past is to expose the root environment under As @rhukster mentioned, though, the UI hides it all so it doesn't really matter what it looks like as long as the implementation is solid and it's not a breaking change |
Yah in Twig the option is there to use |
I will explore this option as well Either way, the template and the UI will need to be different, so if the feature set is identical between the two approaches I would favour the custom filter still, as it feels a bit clearer/easier to explain. Although context provided by a |
…rt-dash-in-variable-name
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
Deploy preview for insomnia-storybook ready! Built with commit a9c827e |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Some comments for reviewers.
@@ -276,28 +277,30 @@ export async function getRenderContext( | |||
function getKeySource(subObject, inKey, inSource) { | |||
// Add key to map if it's not root | |||
if (inKey) { | |||
keySource[inKey] = inSource; | |||
keySource[templatingUtils.normalizeToDotAndBracketNotation(inKey)] = inSource; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The changes in this file relate to building the key source lookup, so we can know if data is coming from the base environment, a sub environment, or a folder. The notation needs to be the same as what the template tag itself contains, hence uses the forceBracket and normalize functions used by the key indexing logic.
const contextForKey = con.keyContext[cleanedStr]; | ||
|
||
// Only prefix the title with context, if context is found | ||
title = contextForKey ? `{${contextForKey}}: ${title}` : title; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
contextForKey
is root, or the sub environment, or the folder name, etc
it.each(['a', 'ab', 'a$', 'a$b', 'a-b', `a${name}b`, `${name}ab`])('%s should be valid', key => { | ||
expect(ensureKeyIsValid(key)).toBe(null); | ||
}); | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tests to ensure a key cannot be _
, or contain .
, or start with $
.
@@ -430,7 +431,7 @@ class App extends PureComponent { | |||
|
|||
async _handleGetRenderContext() { | |||
const context = await this._fetchRenderContext(); | |||
const keys = getKeys(context); | |||
const keys = getKeys(context, NUNJUCKS_TEMPLATE_GLOBAL_PROPERTY_NAME); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
getKeys
is recursive, and is defined in templating/utils.js
. The second argument reflects the key prefix, as the algorithm traverses all nodes. We now start the traversal with _
, so all keys are prefixed by _
.
// Check for invalid key names | ||
// TODO: these only check root properties, not nested properties | ||
if (value && value.object) { | ||
for (const key of Object.keys(value.object)) { | ||
if (!key.match(/^[a-zA-Z_$][0-9a-zA-Z_$]*$/)) { | ||
warning = `"${key}" must only contain letters, numbers, and underscores`; | ||
error = ensureKeyIsValid(key); | ||
if (error) { | ||
break; | ||
} | ||
} | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There is a bug here in that both previously and now, only the root keys are checked. A recursive algorithm needs to be created to validate nested keys appropriately.
-
in variable names-
and other special characters in variable names
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ultra comprehensive, great work!
IMO there is nothing wrong to simply remove |
Updating variable access logic to work with
{{ regular }}
(which is current behavior) as well as{{ _['base-url'] }}
, which caters for dashes and special characters in the key.Nunjucks templates support JS square bracket notation out of the box, but not as the first node. For example,
{{ ['base-url'] }}
is invalid (as it is in JS) while{{ variable['base-url'] }}
is valid. For this reason, we have exposed the template context object (which is provided to Nunjucks), on the variable_
, allowing you to access root keys that contain dashes or special characters, like{{ _['base-url'] }}
.The context object is exposed under
_
in addition to the current implementation, so the old syntax (without_
) will still work, when importing workspaces, or upgrading versions of Insomnia, for example.I selected
_
somewhat arbitrarily. If we would like to change that to something like_ctx
,_env
,$
, or a different character, now is the best time to chime in._
feels least invasive.The autocomplete drop-down has been updated to always prefix an environment variable with
_
, to keep things consistent. It will also only use square bracket notation where necessary. If there are no special characters, regular dot notation will be used, now prefixed with_
.Old left, new right, both work

Old returns

NaN
, new returns the correct variableAdditionally, NeDB has rules to prevent a key from starting with
$
or contain a.
, so I have updated the regex key check for the environment editor. In the current implementation, errors are presented in console, and the changes do not persist (semi-silent failure), if you try to save something without following these rules which the existing regex did not check for.Screenshots
Environment

Autocomplete dropdown
Tags
Raw syntax

Not found errors

Variable editor modal
Regex Checks
Most importantly, this doesn't impact any existing tags
TODO:
To test:
Fixes #1666, Fixes #456, Fixes #1960, Related to #2051, Fixes INS-118