Bug fix: Update KV data when you change the version of a nested secret (#25152)

* wip need to address testing but want to test something quick on 1.13

* add test coverage

* changelog

* update test comment

* rename getter

* Update kv-data-fields.hbs

revert accidental next step

* linting things

changelog/25152.txt

@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Update the KV secret data when you change the version you're viewing of a nested secret.
+```

ui/lib/kv/addon/components/kv-data-fields.hbs

@@ -15,7 +15,7 @@
 {{#if @showJson}}
   <JsonEditor
     @title="{{if (eq @type 'create') 'Secret' 'Version'}} data"
-    @value={{this.codeMirrorString}}
+    @value={{this.stringifiedSecretData}}
     @obscure={{@obscureJson}}
     @valueUpdated={{this.handleJson}}
     @readOnly={{eq @type "details"}}

ui/lib/kv/addon/components/kv-data-fields.js

@@ -29,13 +29,9 @@ import { stringify } from 'core/helpers/stringify';
 
 export default class KvDataFields extends Component {
   @tracked lintingErrors;
-  @tracked codeMirrorString;
 
-  constructor() {
-    super(...arguments);
-    this.codeMirrorString = this.args.secret?.secretData
-      ? stringify([this.args.secret.secretData], {})
-      : '{ "": "" }';
+  get stringifiedSecretData() {
+    return this.args.secret?.secretData ? stringify([this.args.secret.secretData], {}) : '{ "": "" }';
   }
 
   @action
@@ -45,6 +41,5 @@ export default class KvDataFields extends Component {
     if (!this.lintingErrors) {
       this.args.secret.secretData = JSON.parse(value);
     }
-    this.codeMirrorString = value;
   }
 }

ui/tests/acceptance/secrets/backend/kv/kv-v2-workflow-edge-cases-test.js

@@ -302,6 +302,43 @@ module('Acceptance | kv-v2 workflow | edge cases', function (hooks) {
     assert.dom(FORM.toggleJson).isChecked();
     assert.false(codemirror().getValue().includes('*'), 'Values are not obscured on edit view');
   });
+
+  test('viewing advanced secret data versions displays the correct version data', async function (assert) {
+    assert.expect(2);
+    const obscuredDataV1 = `{
+  "foo1": {
+    "name": "********"
+  }
+}`;
+    const obscuredDataV2 = `{
+  "foo2": {
+    "name": "********"
+  }
+}`;
+
+    await visit(`/vault/secrets/${this.backend}/kv/create`);
+    await fillIn(FORM.inputByAttr('path'), 'complex_version_test');
+
+    await click(FORM.toggleJson);
+    codemirror().setValue('{ "foo1": { "name": "bar1" } }');
+    await click(FORM.saveBtn);
+
+    // Create another version
+    await click(PAGE.detail.createNewVersion);
+    codemirror().setValue('{ "foo2": { "name": "bar2" } }');
+    await click(FORM.saveBtn);
+
+    // View the first version and make sure the secret data is correct
+    await click(PAGE.detail.versionDropdown);
+    await click(`${PAGE.detail.version(1)} a`);
+    assert.strictEqual(codemirror().getValue(), obscuredDataV1, 'Version one data is displayed');
+
+    // Navigate back the second version and make sure the secret data is correct
+    await click(PAGE.detail.versionDropdown);
+    await click(`${PAGE.detail.version(2)} a`);
+    assert.strictEqual(codemirror().getValue(), obscuredDataV2, 'Version two data is displayed');
+  });
+
   test('does not register as advanced when value includes {', async function (assert) {
     await visit(`/vault/secrets/${this.backend}/kv/create`);
     await fillIn(FORM.inputByAttr('path'), 'not-advanced');