app_spec.js 3.49 KB
Newer Older
1 2
import MockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils';
Filipa Lacerda's avatar
Filipa Lacerda committed
3 4
import Vue from 'vue';
import registry from '~/registry/components/app.vue';
5
import mountComponent from 'spec/helpers/vue_mount_component_helper';
6
import { TEST_HOST } from 'spec/test_constants';
7
import { reposServerResponse } from '../mock_data';
Filipa Lacerda's avatar
Filipa Lacerda committed
8 9

describe('Registry List', () => {
10
  const Component = Vue.extend(registry);
11 12 13 14 15 16 17
  const props = {
    endpoint: `${TEST_HOST}/foo`,
    helpPagePath: 'foo',
    noContainersImage: 'foo',
    containersErrorImage: 'foo',
    repositoryUrl: 'foo',
  };
Filipa Lacerda's avatar
Filipa Lacerda committed
18
  let vm;
19
  let mock;
Filipa Lacerda's avatar
Filipa Lacerda committed
20 21

  beforeEach(() => {
22
    mock = new MockAdapter(axios);
Filipa Lacerda's avatar
Filipa Lacerda committed
23 24 25
  });

  afterEach(() => {
26
    mock.restore();
Filipa Lacerda's avatar
Filipa Lacerda committed
27 28 29 30 31
    vm.$destroy();
  });

  describe('with data', () => {
    beforeEach(() => {
32
      mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, reposServerResponse);
Filipa Lacerda's avatar
Filipa Lacerda committed
33

34
      vm = mountComponent(Component, { ...props });
Filipa Lacerda's avatar
Filipa Lacerda committed
35 36
    });

Mike Greiling's avatar
Mike Greiling committed
37
    it('should render a list of repos', done => {
Filipa Lacerda's avatar
Filipa Lacerda committed
38 39 40 41
      setTimeout(() => {
        expect(vm.$store.state.repos.length).toEqual(reposServerResponse.length);

        Vue.nextTick(() => {
Mike Greiling's avatar
Mike Greiling committed
42 43 44
          expect(vm.$el.querySelectorAll('.container-image').length).toEqual(
            reposServerResponse.length,
          );
Filipa Lacerda's avatar
Filipa Lacerda committed
45 46 47 48 49 50
          done();
        });
      }, 0);
    });

    describe('delete repository', () => {
Mike Greiling's avatar
Mike Greiling committed
51
      it('should be possible to delete a repo', done => {
Filipa Lacerda's avatar
Filipa Lacerda committed
52 53 54 55 56 57 58 59 60 61
        setTimeout(() => {
          Vue.nextTick(() => {
            expect(vm.$el.querySelector('.container-image-head .js-remove-repo')).toBeDefined();
            done();
          });
        }, 0);
      });
    });

    describe('toggle repository', () => {
Mike Greiling's avatar
Mike Greiling committed
62
      it('should open the container', done => {
Filipa Lacerda's avatar
Filipa Lacerda committed
63 64
        setTimeout(() => {
          Vue.nextTick(() => {
65
            vm.$el.querySelector('.js-toggle-repo').click();
Filipa Lacerda's avatar
Filipa Lacerda committed
66
            Vue.nextTick(() => {
Filipa Lacerda's avatar
Filipa Lacerda committed
67 68 69
              expect(
                vm.$el.querySelector('.js-toggle-repo use').getAttribute('xlink:href'),
              ).toContain('angle-up');
Filipa Lacerda's avatar
Filipa Lacerda committed
70 71 72 73 74 75 76 77 78 79
              done();
            });
          });
        }, 0);
      });
    });
  });

  describe('without data', () => {
    beforeEach(() => {
80
      mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []);
Filipa Lacerda's avatar
Filipa Lacerda committed
81

82
      vm = mountComponent(Component, { ...props });
Filipa Lacerda's avatar
Filipa Lacerda committed
83 84
    });

Mike Greiling's avatar
Mike Greiling committed
85
    it('should render empty message', done => {
Filipa Lacerda's avatar
Filipa Lacerda committed
86
      setTimeout(() => {
87
        expect(vm.$el.querySelector('.js-no-container-images-text').textContent).toEqual(
88
          'With the Container Registry, every project can have its own space to store its Docker images. More Information',
Mike Greiling's avatar
Mike Greiling committed
89
        );
Filipa Lacerda's avatar
Filipa Lacerda committed
90 91 92 93 94 95 96
        done();
      }, 0);
    });
  });

  describe('while loading data', () => {
    beforeEach(() => {
97
      mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []);
Filipa Lacerda's avatar
Filipa Lacerda committed
98

99
      vm = mountComponent(Component, { ...props });
Filipa Lacerda's avatar
Filipa Lacerda committed
100 101
    });

Mike Greiling's avatar
Mike Greiling committed
102
    it('should render a loading spinner', done => {
Filipa Lacerda's avatar
Filipa Lacerda committed
103
      Vue.nextTick(() => {
104
        expect(vm.$el.querySelector('.gl-spinner')).not.toBe(null);
Filipa Lacerda's avatar
Filipa Lacerda committed
105 106 107 108
        done();
      });
    });
  });
109 110 111 112 113 114 115 116 117 118 119 120 121

  describe('invalid characters in path', () => {
    beforeEach(() => {
      mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []);

      vm = mountComponent(Component, {
        ...props,
        characterError: true,
      });
    });

    it('should render invalid characters error message', done => {
      setTimeout(() => {
122 123 124
        expect(vm.$el.querySelector('p')).not.toContain(
          'We are having trouble connecting to Docker, which could be due to an issue with your project name or path. More information',
        );
125 126 127 128
        done();
      });
    });
  });
Filipa Lacerda's avatar
Filipa Lacerda committed
129
});