clipboard.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
  1. import Clipboard from '../src/clipboard';
  2. describe('Clipboard', () => {
  3. before(() => {
  4. global.button = document.createElement('button');
  5. global.button.setAttribute('class', 'btn');
  6. global.button.setAttribute('data-clipboard-text', 'foo');
  7. document.body.appendChild(global.button);
  8. global.span = document.createElement('span');
  9. global.span.innerHTML = 'bar';
  10. global.button.appendChild(span);
  11. global.event = {
  12. target: global.button,
  13. currentTarget: global.button,
  14. };
  15. });
  16. after(() => {
  17. document.body.innerHTML = '';
  18. });
  19. describe('#resolveOptions', () => {
  20. before(() => {
  21. global.fn = () => {};
  22. });
  23. it('should set action as a function', () => {
  24. let clipboard = new Clipboard('.btn', {
  25. action: global.fn,
  26. });
  27. assert.equal(global.fn, clipboard.action);
  28. });
  29. it('should set target as a function', () => {
  30. let clipboard = new Clipboard('.btn', {
  31. target: global.fn,
  32. });
  33. assert.equal(global.fn, clipboard.target);
  34. });
  35. it('should set text as a function', () => {
  36. let clipboard = new Clipboard('.btn', {
  37. text: global.fn,
  38. });
  39. assert.equal(global.fn, clipboard.text);
  40. });
  41. it('should set container as an object', () => {
  42. let clipboard = new Clipboard('.btn', {
  43. container: document.body,
  44. });
  45. assert.equal(document.body, clipboard.container);
  46. });
  47. it('should set container as body by default', () => {
  48. let clipboard = new Clipboard('.btn');
  49. assert.equal(document.body, clipboard.container);
  50. });
  51. });
  52. describe('#listenClick', () => {
  53. it('should add a click event listener to the passed selector', () => {
  54. let clipboard = new Clipboard('.btn');
  55. assert.isObject(clipboard.listener);
  56. });
  57. });
  58. describe('#onClick', () => {
  59. it('should init when called', (done) => {
  60. let clipboard = new Clipboard('.btn');
  61. clipboard.on('success', () => {
  62. done();
  63. });
  64. clipboard.onClick(global.event);
  65. });
  66. it("should use an event's currentTarget when not equal to target", (done) => {
  67. let clipboard = new Clipboard('.btn');
  68. let bubbledEvent = {
  69. target: global.span,
  70. currentTarget: global.button,
  71. };
  72. clipboard.on('success', () => {
  73. done();
  74. });
  75. clipboard.onClick(bubbledEvent);
  76. });
  77. it('should throw an exception when target is invalid', (done) => {
  78. try {
  79. const clipboard = new Clipboard('.btn', {
  80. target() {
  81. return null;
  82. },
  83. });
  84. clipboard.onClick(global.event);
  85. } catch (e) {
  86. assert.equal(e.message, 'Invalid "target" value, use a valid Element');
  87. done();
  88. }
  89. });
  90. });
  91. describe('#static isSupported', () => {
  92. it('should return the support of the given action', () => {
  93. assert.equal(Clipboard.isSupported('copy'), true);
  94. assert.equal(Clipboard.isSupported('cut'), true);
  95. });
  96. it('should return the support of the cut and copy actions', () => {
  97. assert.equal(Clipboard.isSupported(), true);
  98. });
  99. });
  100. describe('#static copy', () => {
  101. it('should copy in an programatic way based on text', () => {
  102. assert.equal(Clipboard.copy('lorem'), 'lorem');
  103. });
  104. it('should copy in an programatic way based on target', () => {
  105. assert.equal(Clipboard.copy(document.querySelector('span')), 'bar');
  106. });
  107. });
  108. describe('#static cut', () => {
  109. it('should cut in an programatic way based on text', () => {
  110. assert.equal(Clipboard.cut(document.querySelector('span')), 'bar');
  111. });
  112. });
  113. describe('#destroy', () => {
  114. it('should destroy an existing instance of ClipboardActionDefault', () => {
  115. let clipboard = new Clipboard('.btn');
  116. clipboard.onClick(global.event);
  117. clipboard.destroy();
  118. assert.equal(clipboard.clipboardAction, null);
  119. });
  120. });
  121. describe('#events', () => {
  122. it('should fire a success event with certain properties', (done) => {
  123. let clipboard = new Clipboard('.btn');
  124. clipboard.on('success', (e) => {
  125. assert.property(e, 'action');
  126. assert.equal(e.action, 'copy');
  127. assert.property(e, 'text');
  128. assert.property(e, 'trigger');
  129. assert.property(e, 'clearSelection');
  130. done();
  131. });
  132. clipboard.onClick(global.event);
  133. });
  134. });
  135. describe('#clearSelection', () => {
  136. it('should clear text selection without moving focus', (done) => {
  137. let clipboard = new Clipboard('.btn');
  138. clipboard.on('success', (e) => {
  139. e.clearSelection();
  140. let selectedElem = document.activeElement;
  141. let selectedText = window.getSelection().toString();
  142. assert.equal(selectedElem, e.trigger);
  143. assert.equal(selectedText, '');
  144. done();
  145. });
  146. clipboard.onClick(global.event);
  147. });
  148. });
  149. });