1 files changed, 60 insertions, 0 deletions
diff --git a/spec/frontend_integration/ide/user_opens_mr_spec.js b/spec/frontend_integration/ide/user_opens_mr_spec.js
new file mode 100644
index 00000000000..9cf0ff5da56
--- /dev/null
+++ b/spec/frontend_integration/ide/user_opens_mr_spec.js
@@ -0,0 +1,60 @@
+import { basename } from 'path';
+import { getMergeRequests, getMergeRequestWithChanges } from 'test_helpers/fixtures';
+import { useOverclockTimers } from 'test_helpers/utils/overclock_timers';
+import * as ideHelper from './helpers/ide_helper';
+import startWebIDE from './helpers/start';
+
+const getRelevantChanges = () =>
+  getMergeRequestWithChanges().changes.filter((x) => !x.deleted_file);
+
+describe('IDE: User opens Merge Request', () => {
+  useOverclockTimers();
+
+  let vm;
+  let container;
+  let changes;
+
+  beforeEach(async () => {
+    const [{ iid: mrId }] = getMergeRequests();
+
+    changes = getRelevantChanges();
+
+    setFixtures('<div class="webide-container"></div>');
+    container = document.querySelector('.webide-container');
+
+    vm = startWebIDE(container, { mrId });
+
+    await ideHelper.waitForTabToOpen(basename(changes[0].new_path));
+    await ideHelper.waitForMonacoEditor();
+  });
+
+  afterEach(async () => {
+    vm.$destroy();
+    vm = null;
+  });
+
+  const findAllTabs = () => Array.from(document.querySelectorAll('.multi-file-tab'));
+  const findAllTabsData = () =>
+    findAllTabs().map((el) => ({
+      title: el.getAttribute('title'),
+      text: el.textContent.trim(),
+    }));
+
+  it('shows first change as active in file tree', async () => {
+    const firstPath = changes[0].new_path;
+    const row = await ideHelper.findAndTraverseToPath(firstPath);
+
+    expect(row).toHaveClass('is-open');
+    expect(row).toHaveClass('is-active');
+  });
+
+  it('opens other changes', () => {
+    // We only show first 10 changes
+    const expectedTabs = changes.slice(0, 10).map((x) => ({
+      title: `${ideHelper.getBaseRoute()}/-/${x.new_path}/`,
+      text: basename(x.new_path),
+    }));
+
+    expect(findAllTabsData()).toEqual(expectedTabs);
+  });
+});