1 files changed, 44 insertions, 0 deletions
diff --git a/spec/frontend/static_site_editor/components/unsaved_changes_confirm_dialog_spec.js b/spec/frontend/static_site_editor/components/unsaved_changes_confirm_dialog_spec.js
new file mode 100644
index 00000000000..9b8b22da693
--- /dev/null
+++ b/spec/frontend/static_site_editor/components/unsaved_changes_confirm_dialog_spec.js
@@ -0,0 +1,44 @@
+import { shallowMount } from '@vue/test-utils';
+
+import UnsavedChangesConfirmDialog from '~/static_site_editor/components/unsaved_changes_confirm_dialog.vue';
+
+describe('static_site_editor/components/unsaved_changes_confirm_dialog', () => {
+  let wrapper;
+  let event;
+  let returnValueSetter;
+
+  const buildWrapper = (propsData = {}) => {
+    wrapper = shallowMount(UnsavedChangesConfirmDialog, {
+      propsData,
+    });
+  };
+
+  beforeEach(() => {
+    event = new Event('beforeunload');
+
+    jest.spyOn(event, 'preventDefault');
+    returnValueSetter = jest.spyOn(event, 'returnValue', 'set');
+  });
+
+  afterEach(() => {
+    event.preventDefault.mockRestore();
+    returnValueSetter.mockRestore();
+    wrapper.destroy();
+  });
+
+  it('displays confirmation dialog when modified = true', () => {
+    buildWrapper({ modified: true });
+    window.dispatchEvent(event);
+
+    expect(event.preventDefault).toHaveBeenCalled();
+    expect(returnValueSetter).toHaveBeenCalledWith('');
+  });
+
+  it('does not display confirmation dialog when modified = false', () => {
+    buildWrapper();
+    window.dispatchEvent(event);
+
+    expect(event.preventDefault).not.toHaveBeenCalled();
+    expect(returnValueSetter).not.toHaveBeenCalled();
+  });
+});