2 files changed, 134 insertions, 0 deletions
diff --git a/spec/frontend/create_cluster/gke_cluster_namespace/gke_cluster_namespace_spec.js b/spec/frontend/create_cluster/gke_cluster_namespace/gke_cluster_namespace_spec.js
new file mode 100644
index 00000000000..b1c25d8fff7
--- /dev/null
+++ b/spec/frontend/create_cluster/gke_cluster_namespace/gke_cluster_namespace_spec.js
@@ -0,0 +1,61 @@
+import initGkeNamespace from '~/create_cluster/gke_cluster_namespace';
+
+describe('GKE cluster namespace', () => {
+  const changeEvent = new Event('change');
+  const isHidden = el => el.classList.contains('hidden');
+  const hasDisabledInput = el => el.querySelector('input').disabled;
+
+  let glManagedCheckbox;
+  let selfManaged;
+  let glManaged;
+
+  beforeEach(() => {
+    setFixtures(`
+      <input class="js-gl-managed" type="checkbox" value="1" checked />
+      <div class="js-namespace">
+        <input type="text" />
+      </div>
+      <div class="js-namespace-prefixed">
+        <input type="text" />
+      </div>
+    `);
+
+    glManagedCheckbox = document.querySelector('.js-gl-managed');
+    selfManaged = document.querySelector('.js-namespace');
+    glManaged = document.querySelector('.js-namespace-prefixed');
+
+    initGkeNamespace();
+  });
+
+  describe('GKE cluster namespace toggles', () => {
+    it('initially displays the GitLab-managed label and input', () => {
+      expect(isHidden(glManaged)).toEqual(false);
+      expect(hasDisabledInput(glManaged)).toEqual(false);
+
+      expect(isHidden(selfManaged)).toEqual(true);
+      expect(hasDisabledInput(selfManaged)).toEqual(true);
+    });
+
+    it('displays the self-managed label and input when the Gitlab-managed checkbox is unchecked', () => {
+      glManagedCheckbox.checked = false;
+      glManagedCheckbox.dispatchEvent(changeEvent);
+
+      expect(isHidden(glManaged)).toEqual(true);
+      expect(hasDisabledInput(glManaged)).toEqual(true);
+
+      expect(isHidden(selfManaged)).toEqual(false);
+      expect(hasDisabledInput(selfManaged)).toEqual(false);
+    });
+
+    it('displays the GitLab-managed label and input when the Gitlab-managed checkbox is checked', () => {
+      glManagedCheckbox.checked = true;
+      glManagedCheckbox.dispatchEvent(changeEvent);
+
+      expect(isHidden(glManaged)).toEqual(false);
+      expect(hasDisabledInput(glManaged)).toEqual(false);
+
+      expect(isHidden(selfManaged)).toEqual(true);
+      expect(hasDisabledInput(selfManaged)).toEqual(true);
+    });
+  });
+});
diff --git a/spec/frontend/create_cluster/init_create_cluster_spec.js b/spec/frontend/create_cluster/init_create_cluster_spec.js
new file mode 100644
index 00000000000..e7b9a7adde4
--- /dev/null
+++ b/spec/frontend/create_cluster/init_create_cluster_spec.js
@@ -0,0 +1,73 @@
+import initCreateCluster from '~/create_cluster/init_create_cluster';
+import initGkeDropdowns from '~/create_cluster/gke_cluster';
+import initGkeNamespace from '~/create_cluster/gke_cluster_namespace';
+import PersistentUserCallout from '~/persistent_user_callout';
+
+jest.mock('~/create_cluster/gke_cluster', () => jest.fn());
+jest.mock('~/create_cluster/gke_cluster_namespace', () => jest.fn());
+jest.mock('~/persistent_user_callout', () => ({
+  factory: jest.fn(),
+}));
+
+describe('initCreateCluster', () => {
+  let document;
+  let gon;
+
+  beforeEach(() => {
+    document = {
+      body: { dataset: {} },
+      querySelector: jest.fn(),
+    };
+    gon = { features: {} };
+  });
+  afterEach(() => {
+    initGkeDropdowns.mockReset();
+    initGkeNamespace.mockReset();
+    PersistentUserCallout.factory.mockReset();
+  });
+
+  describe.each`
+    pageSuffix                 | page
+    ${':clusters:new'}         | ${'project:clusters:new'}
+    ${':clusters:create_gcp'}  | ${'groups:clusters:create_gcp'}
+    ${':clusters:create_user'} | ${'admin:clusters:create_user'}
+  `('when cluster page ends in $pageSuffix', ({ page }) => {
+    beforeEach(() => {
+      document.body.dataset = { page };
+
+      initCreateCluster(document, gon);
+    });
+
+    it('initializes create GKE cluster app', () => {
+      expect(initGkeDropdowns).toHaveBeenCalled();
+    });
+
+    it('initializes gcp signup offer banner', () => {
+      expect(PersistentUserCallout.factory).toHaveBeenCalled();
+    });
+  });
+
+  describe('when creating a project level cluster', () => {
+    it('initializes gke namespace app', () => {
+      document.body.dataset.page = 'project:clusters:new';
+
+      initCreateCluster(document, gon);
+
+      expect(initGkeNamespace).toHaveBeenCalled();
+    });
+  });
+
+  describe.each`
+    clusterLevel        | page
+    ${'group level'}    | ${'groups:clusters:new'}
+    ${'instance level'} | ${'admin:clusters:create_gcp'}
+  `('when creating a $clusterLevel cluster', ({ page }) => {
+    it('does not initialize gke namespace app', () => {
+      document.body.dataset = { page };
+
+      initCreateCluster(document, gon);
+
+      expect(initGkeNamespace).not.toHaveBeenCalled();
+    });
+  });
+});