Merge branch '267115-add-unit-test-for-group-in-composer-install-command' into 'master'

Add unit test for group in composer install command

See merge request gitlab-org/gitlab!45139

app/assets/javascripts/packages/details/components/composer_installation.vue

@@ -31,8 +31,7 @@ export default {
 </script>
 
 <template>
-  <div>
-    <div v-if="groupExists">
+  <div v-if="groupExists" data-testid="root-node">
     <h3 class="gl-font-lg">{{ __('Installation') }}</h3>
 
     <code-instruction
@@ -60,5 +59,4 @@ export default {
       </gl-sprintf>
     </span>
   </div>
-  </div>
 </template>

spec/frontend/packages/details/components/composer_installation_spec.js

@@ -12,24 +12,23 @@ localVue.use(Vuex);
 
 describe('ComposerInstallation', () => {
   let wrapper;
+  let store;
 
   const composerRegistryIncludeStr = 'foo/registry';
   const composerPackageIncludeStr = 'foo/package';
-  const groupExists = true;
 
-  const store = new Vuex.Store({
-    state: {
-      packageEntity,
-      composerHelpPath,
-      groupExists,
-    },
+  const createStore = (groupExists = true) => {
+    store = new Vuex.Store({
+      state: { packageEntity, composerHelpPath },
       getters: {
         composerRegistryInclude: () => composerRegistryIncludeStr,
         composerPackageInclude: () => composerPackageIncludeStr,
         groupExists: () => groupExists,
       },
     });
+  };
 
+  const findRootNode = () => wrapper.find('[data-testid="root-node"]');
   const findRegistryInclude = () => wrapper.find('[data-testid="registry-include"]');
   const findPackageInclude = () => wrapper.find('[data-testid="package-include"]');
   const findHelpText = () => wrapper.find('[data-testid="help-text"]');
@@ -45,15 +44,16 @@ describe('ComposerInstallation', () => {
     });
   }
 
-  beforeEach(() => {
-    createComponent();
-  });
-
   afterEach(() => {
     wrapper.destroy();
   });
 
   describe('registry include command', () => {
+    beforeEach(() => {
+      createStore();
+      createComponent();
+    });
+
     it('uses code_instructions', () => {
       const registryIncludeCommand = findRegistryInclude();
       expect(registryIncludeCommand.exists()).toBe(true);
@@ -70,6 +70,11 @@ describe('ComposerInstallation', () => {
   });
 
   describe('package include command', () => {
+    beforeEach(() => {
+      createStore();
+      createComponent();
+    });
+
     it('uses code_instructions', () => {
       const registryIncludeCommand = findPackageInclude();
       expect(registryIncludeCommand.exists()).toBe(true);
@@ -94,4 +99,20 @@ describe('ComposerInstallation', () => {
       });
     });
   });
+
+  describe('root node', () => {
+    it('is normally rendered', () => {
+      createStore();
+      createComponent();
+
+      expect(findRootNode().exists()).toBe(true);
+    });
+
+    it('is not rendered when the group does not exist', () => {
+      createStore(false);
+      createComponent();
+
+      expect(findRootNode().exists()).toBe(false);
+    });
+  });
 });