wip - visibility

4 files changed, 72 insertions, 22 deletions

diff --git a/app/assets/javascripts/vue_shared/components/projects_list/project_visibility.vue b/app/assets/javascripts/vue_shared/components/projects_list/project_visibility.vue
deleted file mode 100644
index e69de29bb2d..00000000000
--- a/app/assets/javascripts/vue_shared/components/projects_list/project_visibility.vue
+++ /dev/null
diff --git a/app/assets/javascripts/vue_shared/components/projects_list/project_visibility_level.vue b/app/assets/javascripts/vue_shared/components/projects_list/project_visibility_level.vue
new file mode 100644
index 00000000000..37fc51ff346
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/projects_list/project_visibility_level.vue
@@ -0,0 +1,7 @@
+<script>
+export default {
+  props: {},
+  computed: {},
+};
+</script>
+<template></template>
diff --git a/spec/javascripts/vue_shared/components/projects_list/project_list_item_spec.js b/spec/javascripts/vue_shared/components/projects_list/project_list_item_spec.js
index e25943b4fe8..e3a8e36f36b 100644
--- a/spec/javascripts/vue_shared/components/projects_list/project_list_item_spec.js
+++ b/spec/javascripts/vue_shared/components/projects_list/project_list_item_spec.js
@@ -1,6 +1,5 @@
 import Vue from 'vue';
 import ProjectListItem from '~/vue_shared/components/projects_list/project_list_item.vue';
-import ProjectAccess from '~/vue_shared/components/projects_list/project_access.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 // TODO: move to shallow mount / vue test utils ??
@@ -119,13 +118,7 @@ describe('ProjectListItem', () => {
         vm.$destroy();
       });
 
-      it('does not render project visibility', () => {
-        // - if !explore_projects_tab ? && access &.nonzero ?
-        //   -# haml - lint: disable UnnecessaryStringOutput
-        //     = ' ' # prevent haml from eating the space between elements
-        //       .metadata - info.prepend - top - 8
-        //       % span.user - access - role.d - block= Gitlab:: Access.human_access(access)
-      });
+      it('does not render project access', () => {});
     });
 
     describe('Project meta', () => {
@@ -151,19 +144,5 @@ describe('ProjectListItem', () => {
         });
       });
     });
-
-    fdescribe('Project visibility', () => {
-      beforeEach(() => {
-        vm = createComponent({ project: selectedProject });
-      });
-
-      afterEach(() => {
-        vm.$destroy();
-      });
-
-      describe('template', () => {
-        it('renders the correct access level for the user', () => {});
-      });
-    });
   });
 });
diff --git a/spec/javascripts/vue_shared/components/projects_list/project_visibility_level_spec.js b/spec/javascripts/vue_shared/components/projects_list/project_visibility_level_spec.js
new file mode 100644
index 00000000000..9983e200391
--- /dev/null
+++ b/spec/javascripts/vue_shared/components/projects_list/project_visibility_level_spec.js
@@ -0,0 +1,64 @@
+import Vue from 'vue';
+import ProjectVisibilityLevel from '~/vue_shared/components/projects_list/project_visibility_level.vue';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
+
+// TODO: move to shallow mount / vue test utils ??
+
+loadJSONFixtures('projects.json');
+// const projects = getJSONFixture('projects.json');
+let vm;
+
+const createComponent = (props, defaultComponent = ProjectVisibilityLevel) => {
+  const Component = Vue.extend(defaultComponent);
+
+  return mountComponent(Component, props);
+};
+
+describe('ProjectVisibilityLevel', () => {
+  const defaultAccess = 'Maintainer';
+  beforeEach(() => {
+    vm = createComponent(
+      {
+        isExploreProjectsTab: false,
+        accessLevel: 30,
+        humanAccess: defaultAccess,
+      },
+      ProjectVisibilityLevel,
+    );
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  it(`renders if we are not on the explore tab and receive 'accessLevel' and 'humanAccess' props`, () => {
+    expect(vm.showAccessLevel).toBe(true);
+    expect(vm.$el.querySelector('.user-access-role').textContent).toBe(defaultAccess);
+  });
+
+  it(`does not render if 'accessLevel' is 0`, () => {
+    vm = createComponent(
+      {
+        isExploreProjectsTab: false,
+        accessLevel: 0,
+        humanAccess: defaultAccess,
+      },
+      ProjectVisibilityLevel,
+    );
+
+    expect(vm.showAccessLevel).toBe(false);
+  });
+
+  it(`does not render if we are on the explore project tab`, () => {
+    vm = createComponent(
+      {
+        isExploreProjectsTab: true,
+        accessLevel: 0,
+        humanAccess: defaultAccess,
+      },
+      ProjectVisibilityLevel,
+    );
+
+    expect(vm.showAccessLevel).toBe(false);
+  });
+});