text: import { shallowMount } from '@vue/test-utils';
  import Project from 'ee/other_storage_counter/components/project.vue';
  import StorageRow from 'ee/other_storage_counter/components/storage_row.vue';
  import { numberToHumanSize } from '~/lib/utils/number_utils';
  import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
  import { projects } from '../mock_data';
  
  let wrapper;
  const createComponent = () => {
    wrapper = shallowMount(Project, {
      propsData: {
        project: projects[1],
      },
    });
  };
  
  const findTableRow = () => wrapper.find('[data-testid="projectTableRow"]');
  const findStorageRow = () => wrapper.find(StorageRow);
  
  describe('Storage Counter project component', () => {
    beforeEach(() => {
      createComponent();
    });
  
    it('renders project avatar', () => {
      expect(wrapper.find(ProjectAvatar).exists()).toBe(true);
    });
  
    it('renders project name', () => {
      expect(wrapper.text()).toContain(projects[1].nameWithNamespace);
    });
  
    it('renders formatted storage size', () => {
      expect(wrapper.text()).toContain(numberToHumanSize(projects[1].statistics.storageSize));
    });
  
    describe('toggle row', () => {
      describe('on click', () => {
        it('toggles isOpen', () => {
          expect(findStorageRow().exists()).toBe(false);
  
          findTableRow().trigger('click');
  
          wrapper.vm.$nextTick(() => {
            expect(findStorageRow().exists()).toBe(true);
            findTableRow().trigger('click');
  
            wrapper.vm.$nextTick(() => {
              expect(findStorageRow().exists()).toBe(false);
            });
          });
        });
      });
    });
  });
  