From 614957c2b287785aa081366b74d2f671ba269642 Mon Sep 17 00:00:00 2001
From: Timothy Lim <tim@thewheatfield.org>
Date: Thu, 9 Sep 2021 22:42:04 +0800
Subject: [PATCH] Fix tag editor preview issue due to blackslash (#2708)

Co-authored-by: Timothy Lim <tim.lim@intercom.io>
Co-authored-by: gatzjames <jamesgatzos@gmail.com>
---
 .../ui/components/templating/tag-editor.tsx   | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/packages/insomnia-app/app/ui/components/templating/tag-editor.tsx b/packages/insomnia-app/app/ui/components/templating/tag-editor.tsx
index f2fc4dd67..d35584689 100644
--- a/packages/insomnia-app/app/ui/components/templating/tag-editor.tsx
+++ b/packages/insomnia-app/app/ui/components/templating/tag-editor.tsx
@@ -77,6 +77,13 @@ class TagEditor extends PureComponent<Props, State> {
       activeTagData.rawValue = this.props.defaultValue;
     }
 
+    // Fix strings: arg.value expects an escaped value (based on _updateArg logic)
+    for (const arg of activeTagData.args) {
+      if (typeof arg.value === 'string') {
+        arg.value = this._escapeStringArgs(arg.value);
+      }
+    }
+
     await Promise.all([
       this._refreshModels(this.props.workspace),
       this._update(tagDefinitions, activeTagDefinition, activeTagData, true),
@@ -178,7 +185,7 @@ class TagEditor extends PureComponent<Props, State> {
 
     // Fix strings
     if (typeof argValue === 'string') {
-      argValue = argValue.replace(/\\/g, '\\\\');
+      argValue = this._escapeStringArgs(argValue);
     }
 
     // Ensure all arguments exist
@@ -324,6 +331,14 @@ class TagEditor extends PureComponent<Props, State> {
     }, 100);
   }
 
+  _escapeStringArgs(value: string) {
+    return value.replace(/\\/g, '\\\\');
+  }
+
+  _unescapeStringArgs(value: string) {
+    return value.replace(/\\\\/g, '\\');
+  }
+
   static _getDefaultTagData(tagDefinition: NunjucksParsedTag): NunjucksParsedTag {
     const defaultFill: string = templateUtils.getDefaultFill(
       tagDefinition.name,
@@ -425,7 +440,7 @@ class TagEditor extends PureComponent<Props, State> {
     return (
       <input
         type="text"
-        defaultValue={value || ''}
+        defaultValue={this._unescapeStringArgs(value) || ''}
         placeholder={placeholder}
         onChange={this._handleChange}
         data-encoding={encoding || 'utf8'}
@@ -460,7 +475,7 @@ class TagEditor extends PureComponent<Props, State> {
         showFileName
         className="btn btn--clicky btn--super-compact"
         onChange={path => this._handleChangeFile(path, argIndex)}
-        path={value}
+        path={this._unescapeStringArgs(value)}
         itemtypes={itemTypes}
         extensions={extensions}
       />