|
| 1 | +describe('dndDraggable', function() { |
| 2 | + |
| 3 | + var SIMPLE_HTML = '<div dnd-draggable="{hello: \'world\'}"></div>'; |
| 4 | + |
| 5 | + describe('constructor', function() { |
| 6 | + it('sets the draggable attribute', function() { |
| 7 | + var element = compileAndLink(SIMPLE_HTML); |
| 8 | + expect(element.attr('draggable')).toBe('true'); |
| 9 | + }); |
| 10 | + |
| 11 | + it('watches and handles the dnd-disabled-if expression', function() { |
| 12 | + var element = compileAndLink('<div dnd-draggable dnd-disable-if="disabled"></div>'); |
| 13 | + expect(element.attr('draggable')).toBe('true'); |
| 14 | + |
| 15 | + element.scope().disabled = true; |
| 16 | + element.scope().$digest(); |
| 17 | + expect(element.attr('draggable')).toBe('false'); |
| 18 | + |
| 19 | + element.scope().disabled = false; |
| 20 | + element.scope().$digest(); |
| 21 | + expect(element.attr('draggable')).toBe('true'); |
| 22 | + }); |
| 23 | + }); |
| 24 | + |
| 25 | + describe('dragstart handler', function() { |
| 26 | + var element, event; |
| 27 | + |
| 28 | + beforeEach(function() { |
| 29 | + element = compileAndLink(SIMPLE_HTML); |
| 30 | + event = createEvent('dragstart'); |
| 31 | + }); |
| 32 | + |
| 33 | + it('calls setData with serialized data', function() { |
| 34 | + event._triggerOn(element); |
| 35 | + expect(event._data).toEqual({'Text': '{"hello":"world"}'}); |
| 36 | + }); |
| 37 | + |
| 38 | + it('stops propagation', function() { |
| 39 | + event._triggerOn(element); |
| 40 | + expect(event._propagationStopped).toBe(true); |
| 41 | + }); |
| 42 | + |
| 43 | + it('sets effectAllowed to move by default', function() { |
| 44 | + event._triggerOn(element); |
| 45 | + expect(event._dt.effectAllowed).toBe('move'); |
| 46 | + }); |
| 47 | + |
| 48 | + it('sets effectAllowed from dnd-effect-allowed', function() { |
| 49 | + element = compileAndLink('<div dnd-draggable dnd-effect-allowed="copyMove"></div>'); |
| 50 | + event._triggerOn(element); |
| 51 | + expect(event._dt.effectAllowed).toBe('copyMove'); |
| 52 | + }); |
| 53 | + |
| 54 | + it('adds CSS classes to element', inject(function($timeout) { |
| 55 | + event._triggerOn(element); |
| 56 | + expect(element.hasClass('dndDragging')).toBe(true); |
| 57 | + expect(element.hasClass('dndDraggingSource')).toBe(false); |
| 58 | + |
| 59 | + $timeout.flush(0); |
| 60 | + expect(element.hasClass('dndDraggingSource')).toBe(true); |
| 61 | + })); |
| 62 | + |
| 63 | + it('invokes dnd-dragstart callback', function() { |
| 64 | + element = compileAndLink('<div dnd-draggable dnd-dragstart="ev = event"></div>'); |
| 65 | + event._triggerOn(element); |
| 66 | + expect(element.scope().ev).toBe(event.originalEvent); |
| 67 | + }); |
| 68 | + |
| 69 | + it('initializes workarounds', inject(function(dndDropEffectWorkaround, dndDragTypeWorkaround) { |
| 70 | + event._triggerOn(element); |
| 71 | + expect(dndDragTypeWorkaround.isDragging).toBe(true); |
| 72 | + expect(dndDragTypeWorkaround.dragType).toBeUndefined(); |
| 73 | + expect(dndDropEffectWorkaround.dropEffect).toBe('none'); |
| 74 | + })); |
| 75 | + |
| 76 | + it('initializes workarounds respecting dnd-type', inject(function(dndDragTypeWorkaround) { |
| 77 | + element = compileAndLink('<div dnd-draggable dnd-type="2 * 2"></div>'); |
| 78 | + event._triggerOn(element); |
| 79 | + expect(dndDragTypeWorkaround.dragType).toEqual(4); |
| 80 | + })); |
| 81 | + }); |
| 82 | + |
| 83 | + describe('dragend handler', function() { |
| 84 | + var element, event; |
| 85 | + |
| 86 | + beforeEach(function() { |
| 87 | + element = compileAndLink(SIMPLE_HTML); |
| 88 | + event = createEvent('dragend'); |
| 89 | + }); |
| 90 | + |
| 91 | + it('stops propagation', function() { |
| 92 | + event._triggerOn(element); |
| 93 | + expect(event._propagationStopped).toBe(true); |
| 94 | + }); |
| 95 | + |
| 96 | + it('removes CSS classes from element', inject(function($timeout) { |
| 97 | + element.addClass('dndDragging'); |
| 98 | + element.addClass('dndDraggingSource'); |
| 99 | + event._triggerOn(element); |
| 100 | + |
| 101 | + expect(element.hasClass('dndDragging')).toBe(false); |
| 102 | + expect(element.hasClass('dndDraggingSource')).toBe(true); |
| 103 | + |
| 104 | + $timeout.flush(0); |
| 105 | + expect(element.hasClass('dndDraggingSource')).toBe(false); |
| 106 | + })); |
| 107 | + |
| 108 | + it('resets workarounds', inject(function(dndDragTypeWorkaround) { |
| 109 | + event._triggerOn(element); |
| 110 | + expect(dndDragTypeWorkaround.isDragging).toBe(false); |
| 111 | + })); |
| 112 | + |
| 113 | + var dropEffects = {move: 'moved', copy: 'copied', none: 'canceled'}; |
| 114 | + angular.forEach(dropEffects, function(callback, dropEffect) { |
| 115 | + it('calls callbacks for dropEffect ' + dropEffect, inject(function(dndDropEffectWorkaround) { |
| 116 | + var html = '<div dnd-draggable dnd-dragend="de = dropEffect" ' |
| 117 | + + 'dnd-' + callback + '="ev = event"></div>'; |
| 118 | + element = compileAndLink(html); |
| 119 | + dndDropEffectWorkaround.dropEffect = dropEffect; |
| 120 | + |
| 121 | + event._triggerOn(element); |
| 122 | + expect(element.scope().ev).toBe(event.originalEvent); |
| 123 | + expect(element.scope().de).toBe(dropEffect); |
| 124 | + })); |
| 125 | + }); |
| 126 | + }); |
| 127 | + |
| 128 | + describe('click handler', function() { |
| 129 | + it('does nothing if dnd-selected is not set', function() { |
| 130 | + var element = compileAndLink(SIMPLE_HTML); |
| 131 | + var event = createEvent('click'); |
| 132 | + event._triggerOn(element); |
| 133 | + expect(event._propagationStopped).toBeFalsy(); |
| 134 | + }); |
| 135 | + |
| 136 | + it('invokes dnd-selected callback and stops propagation', function() { |
| 137 | + var element = compileAndLink('<div dnd-draggable dnd-selected="selected = true"></div>'); |
| 138 | + var event = createEvent('click'); |
| 139 | + event._triggerOn(element); |
| 140 | + expect(event._propagationStopped).toBe(true); |
| 141 | + expect(element.scope().selected).toBe(true); |
| 142 | + }); |
| 143 | + }); |
| 144 | +}); |
0 commit comments