React to value changes on the component

app/assets/javascripts/vue_shared/components/editor_lite.vue

@@ -57,6 +57,9 @@ export default {
     fileName(newVal) {
       this.editor.updateModelLanguage(newVal);
     },
+    value(newVal) {
+      this.editor.setValue(newVal);
+    },
   },
   mounted() {
     this.editor = initEditorLite({

spec/frontend/vue_shared/components/editor_lite_spec.js

@@ -10,6 +10,7 @@ describe('Editor Lite component', () => {
   const onDidChangeModelContent = jest.fn();
   const updateModelLanguage = jest.fn();
   const getValue = jest.fn();
+  const setValue = jest.fn();
   const value = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
   const fileName = 'lorem.txt';
   const fileGlobalId = 'snippet_777';
@@ -17,6 +18,7 @@ describe('Editor Lite component', () => {
     onDidChangeModelContent,
     updateModelLanguage,
     getValue,
+    setValue,
     dispose: jest.fn(),
   }));
   Editor.mockImplementation(() => {
@@ -94,6 +96,17 @@ describe('Editor Lite component', () => {
       });
     });
 
+    it('reacts to the changes in the pased value', async () => {
+      const newValue = 'New Value';
+
+      wrapper.setProps({
+        value: newValue,
+      });
+
+      await nextTick();
+      expect(setValue).toHaveBeenCalledWith(newValue);
+    });
+
     it('registers callback with editor onChangeContent', () => {
       expect(onDidChangeModelContent).toHaveBeenCalledWith(expect.any(Function));
     });