2 files changed, 18 insertions, 11 deletions

diff --git a/spec/frontend/ide/components/terminal/session_spec.js b/spec/frontend/ide/components/terminal/session_spec.js
index ce61a31691a..3ca37166ac4 100644
--- a/spec/frontend/ide/components/terminal/session_spec.js
+++ b/spec/frontend/ide/components/terminal/session_spec.js
@@ -1,4 +1,5 @@
 import { createLocalVue, shallowMount } from '@vue/test-utils';
+import { GlButton } from '@gitlab/ui';
 import Vuex from 'vuex';
 import TerminalSession from '~/ide/components/terminal/session.vue';
 import Terminal from '~/ide/components/terminal/terminal.vue';
@@ -38,6 +39,8 @@ describe('IDE TerminalSession', () => {
     });
   };
 
+  const findButton = () => wrapper.find(GlButton);
+
   beforeEach(() => {
     state = {
       session: { status: RUNNING, terminalPath: TEST_TERMINAL_PATH },
@@ -69,8 +72,8 @@ describe('IDE TerminalSession', () => {
       state.session = { status };
       factory();
 
-      const button = wrapper.find('button');
-      button.trigger('click');
+      const button = findButton();
+      button.vm.$emit('click');
 
       return wrapper.vm.$nextTick().then(() => {
         expect(button.text()).toEqual('Stop Terminal');
@@ -84,8 +87,8 @@ describe('IDE TerminalSession', () => {
       state.session = { status };
       factory();
 
-      const button = wrapper.find('button');
-      button.trigger('click');
+      const button = findButton();
+      button.vm.$emit('click');
 
       return wrapper.vm.$nextTick().then(() => {
         expect(button.text()).toEqual('Restart Terminal');
diff --git a/spec/frontend/ide/components/terminal/view_spec.js b/spec/frontend/ide/components/terminal/view_spec.js
index eff200550da..37f7957c526 100644
--- a/spec/frontend/ide/components/terminal/view_spec.js
+++ b/spec/frontend/ide/components/terminal/view_spec.js
@@ -1,6 +1,7 @@
 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import { TEST_HOST } from 'spec/test_constants';
+import waitForPromises from 'helpers/wait_for_promises';
 import TerminalEmptyState from '~/ide/components/terminal/empty_state.vue';
 import TerminalView from '~/ide/components/terminal/view.vue';
 import TerminalSession from '~/ide/components/terminal/session.vue';
@@ -17,7 +18,7 @@ describe('IDE TerminalView', () => {
   let getters;
   let wrapper;
 
-  const factory = () => {
+  const factory = async () => {
     const store = new Vuex.Store({
       modules: {
         terminal: {
@@ -30,6 +31,9 @@ describe('IDE TerminalView', () => {
     });
 
     wrapper = shallowMount(TerminalView, { localVue, store });
+
+    // Uses deferred components, so wait for those to load...
+    await waitForPromises();
   };
 
   beforeEach(() => {
@@ -59,8 +63,8 @@ describe('IDE TerminalView', () => {
     wrapper.destroy();
   });
 
-  it('renders empty state', () => {
-    factory();
+  it('renders empty state', async () => {
+    await factory();
 
     expect(wrapper.find(TerminalEmptyState).props()).toEqual({
       helpPath: TEST_HELP_PATH,
@@ -69,8 +73,8 @@ describe('IDE TerminalView', () => {
     });
   });
 
-  it('hides splash and starts, when started', () => {
-    factory();
+  it('hides splash and starts, when started', async () => {
+    await factory();
 
     expect(actions.startSession).not.toHaveBeenCalled();
     expect(actions.hideSplash).not.toHaveBeenCalled();
@@ -81,9 +85,9 @@ describe('IDE TerminalView', () => {
     expect(actions.hideSplash).toHaveBeenCalled();
   });
 
-  it('shows Web Terminal when started', () => {
+  it('shows Web Terminal when started', async () => {
     state.isShowSplash = false;
-    factory();
+    await factory();
 
     expect(wrapper.find(TerminalEmptyState).exists()).toBe(false);
     expect(wrapper.find(TerminalSession).exists()).toBe(true);