44 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
			
		
		
	
	
			44 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
 | 
						|
import autofocusonshow from '~/vue_shared/directives/autofocusonshow';
 | 
						|
 | 
						|
/**
 | 
						|
 * We're testing this directive's hooks as pure functions
 | 
						|
 * since behaviour of this directive is highly-dependent
 | 
						|
 * on underlying DOM methods.
 | 
						|
 */
 | 
						|
describe('AutofocusOnShow directive', () => {
 | 
						|
  describe('with input invisible on component render', () => {
 | 
						|
    let el;
 | 
						|
 | 
						|
    beforeEach(() => {
 | 
						|
      setHTMLFixture('<div id="container" style="display: none;"><input id="inputel"/></div>');
 | 
						|
      el = document.querySelector('#inputel');
 | 
						|
    });
 | 
						|
 | 
						|
    afterEach(() => {
 | 
						|
      resetHTMLFixture();
 | 
						|
    });
 | 
						|
 | 
						|
    it('should bind IntersectionObserver on input element', () => {
 | 
						|
      jest.spyOn(el, 'focus').mockImplementation(() => {});
 | 
						|
 | 
						|
      autofocusonshow.inserted(el);
 | 
						|
 | 
						|
      expect(el.visibilityObserver).toBeDefined();
 | 
						|
      expect(el.focus).not.toHaveBeenCalled();
 | 
						|
    });
 | 
						|
 | 
						|
    it('should stop IntersectionObserver on input element on unbind hook', () => {
 | 
						|
      el.visibilityObserver = {
 | 
						|
        disconnect: () => {},
 | 
						|
      };
 | 
						|
      jest.spyOn(el.visibilityObserver, 'disconnect').mockImplementation(() => {});
 | 
						|
 | 
						|
      autofocusonshow.unbind(el);
 | 
						|
 | 
						|
      expect(el.visibilityObserver).toBeDefined();
 | 
						|
      expect(el.visibilityObserver.disconnect).toHaveBeenCalled();
 | 
						|
    });
 | 
						|
  });
 | 
						|
});
 |