98 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
			
		
		
	
	
			98 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
| import { mount } from '@vue/test-utils';
 | |
| import { GlButtonGroup, GlButton } from '@gitlab/ui';
 | |
| import BlobHeaderViewerSwitcher from '~/blob/components/blob_header_viewer_switcher.vue';
 | |
| import {
 | |
|   RICH_BLOB_VIEWER,
 | |
|   RICH_BLOB_VIEWER_TITLE,
 | |
|   SIMPLE_BLOB_VIEWER,
 | |
|   SIMPLE_BLOB_VIEWER_TITLE,
 | |
| } from '~/blob/components/constants';
 | |
| 
 | |
| describe('Blob Header Viewer Switcher', () => {
 | |
|   let wrapper;
 | |
| 
 | |
|   function createComponent(propsData = {}) {
 | |
|     wrapper = mount(BlobHeaderViewerSwitcher, {
 | |
|       propsData,
 | |
|     });
 | |
|   }
 | |
| 
 | |
|   afterEach(() => {
 | |
|     wrapper.destroy();
 | |
|   });
 | |
| 
 | |
|   describe('intiialization', () => {
 | |
|     it('is initialized with simple viewer as active', () => {
 | |
|       createComponent();
 | |
|       expect(wrapper.vm.value).toBe(SIMPLE_BLOB_VIEWER);
 | |
|     });
 | |
|   });
 | |
| 
 | |
|   describe('rendering', () => {
 | |
|     let btnGroup;
 | |
|     let buttons;
 | |
| 
 | |
|     beforeEach(() => {
 | |
|       createComponent();
 | |
|       btnGroup = wrapper.find(GlButtonGroup);
 | |
|       buttons = wrapper.findAll(GlButton);
 | |
|     });
 | |
| 
 | |
|     it('renders gl-button-group component', () => {
 | |
|       expect(btnGroup.exists()).toBe(true);
 | |
|     });
 | |
| 
 | |
|     it('renders exactly 2 buttons with predefined actions', () => {
 | |
|       expect(buttons.length).toBe(2);
 | |
|       [SIMPLE_BLOB_VIEWER_TITLE, RICH_BLOB_VIEWER_TITLE].forEach((title, i) => {
 | |
|         expect(buttons.at(i).attributes('title')).toBe(title);
 | |
|       });
 | |
|     });
 | |
|   });
 | |
| 
 | |
|   describe('viewer changes', () => {
 | |
|     let buttons;
 | |
|     let simpleBtn;
 | |
|     let richBtn;
 | |
| 
 | |
|     function factory(propsData = {}) {
 | |
|       createComponent(propsData);
 | |
|       buttons = wrapper.findAll(GlButton);
 | |
|       simpleBtn = buttons.at(0);
 | |
|       richBtn = buttons.at(1);
 | |
| 
 | |
|       jest.spyOn(wrapper.vm, '$emit');
 | |
|     }
 | |
| 
 | |
|     it('does not switch the viewer if the selected one is already active', () => {
 | |
|       factory();
 | |
|       expect(wrapper.vm.value).toBe(SIMPLE_BLOB_VIEWER);
 | |
|       simpleBtn.vm.$emit('click');
 | |
|       expect(wrapper.vm.value).toBe(SIMPLE_BLOB_VIEWER);
 | |
|       expect(wrapper.vm.$emit).not.toHaveBeenCalled();
 | |
|     });
 | |
| 
 | |
|     it('emits an event when a Rich Viewer button is clicked', () => {
 | |
|       factory();
 | |
|       expect(wrapper.vm.value).toBe(SIMPLE_BLOB_VIEWER);
 | |
| 
 | |
|       richBtn.vm.$emit('click');
 | |
| 
 | |
|       return wrapper.vm.$nextTick().then(() => {
 | |
|         expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', RICH_BLOB_VIEWER);
 | |
|       });
 | |
|     });
 | |
| 
 | |
|     it('emits an event when a Simple Viewer button is clicked', () => {
 | |
|       factory({
 | |
|         value: RICH_BLOB_VIEWER,
 | |
|       });
 | |
|       simpleBtn.vm.$emit('click');
 | |
| 
 | |
|       return wrapper.vm.$nextTick().then(() => {
 | |
|         expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', SIMPLE_BLOB_VIEWER);
 | |
|       });
 | |
|     });
 | |
|   });
 | |
| });
 |