2023-12-18 13:12:25 +08:00
|
|
|
import Clipboard from '../src/clipboard';
|
|
|
|
|
|
|
|
describe('Clipboard', () => {
|
2024-01-16 21:26:16 +08:00
|
|
|
before(() => {
|
|
|
|
global.button = document.createElement('button');
|
|
|
|
global.button.setAttribute('class', 'btn');
|
|
|
|
global.button.setAttribute('data-clipboard-text', 'foo');
|
|
|
|
document.body.appendChild(global.button);
|
|
|
|
|
|
|
|
global.span = document.createElement('span');
|
|
|
|
global.span.innerHTML = 'bar';
|
|
|
|
|
|
|
|
global.button.appendChild(span);
|
|
|
|
|
|
|
|
global.event = {
|
|
|
|
target: global.button,
|
|
|
|
currentTarget: global.button,
|
|
|
|
};
|
|
|
|
});
|
|
|
|
|
|
|
|
after(() => {
|
|
|
|
document.body.innerHTML = '';
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('#resolveOptions', () => {
|
2023-12-18 13:12:25 +08:00
|
|
|
before(() => {
|
2024-01-16 21:26:16 +08:00
|
|
|
global.fn = () => {};
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should set action as a function', () => {
|
|
|
|
let clipboard = new Clipboard('.btn', {
|
|
|
|
action: global.fn,
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
assert.equal(global.fn, clipboard.action);
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should set target as a function', () => {
|
|
|
|
let clipboard = new Clipboard('.btn', {
|
|
|
|
target: global.fn,
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
assert.equal(global.fn, clipboard.target);
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should set text as a function', () => {
|
|
|
|
let clipboard = new Clipboard('.btn', {
|
|
|
|
text: global.fn,
|
|
|
|
});
|
|
|
|
|
|
|
|
assert.equal(global.fn, clipboard.text);
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should set container as an object', () => {
|
|
|
|
let clipboard = new Clipboard('.btn', {
|
|
|
|
container: document.body,
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
assert.equal(document.body, clipboard.container);
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should set container as body by default', () => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
assert.equal(document.body, clipboard.container);
|
|
|
|
});
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#listenClick', () => {
|
|
|
|
it('should add a click event listener to the passed selector', () => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
|
|
|
assert.isObject(clipboard.listener);
|
|
|
|
});
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#onClick', () => {
|
|
|
|
it('should init when called', (done) => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.on('success', () => {
|
|
|
|
done();
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.onClick(global.event);
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it("should use an event's currentTarget when not equal to target", (done) => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
|
|
|
let bubbledEvent = {
|
|
|
|
target: global.span,
|
|
|
|
currentTarget: global.button,
|
|
|
|
};
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.on('success', () => {
|
|
|
|
done();
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.onClick(bubbledEvent);
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should throw an exception when target is invalid', (done) => {
|
|
|
|
try {
|
|
|
|
const clipboard = new Clipboard('.btn', {
|
|
|
|
target() {
|
|
|
|
return null;
|
|
|
|
},
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
2024-01-16 21:26:16 +08:00
|
|
|
|
|
|
|
clipboard.onClick(global.event);
|
|
|
|
} catch (e) {
|
|
|
|
assert.equal(e.message, 'Invalid "target" value, use a valid Element');
|
|
|
|
done();
|
|
|
|
}
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
2024-01-16 21:26:16 +08:00
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#static isSupported', () => {
|
|
|
|
it('should return the support of the given action', () => {
|
|
|
|
assert.equal(Clipboard.isSupported('copy'), true);
|
|
|
|
assert.equal(Clipboard.isSupported('cut'), true);
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should return the support of the cut and copy actions', () => {
|
|
|
|
assert.equal(Clipboard.isSupported(), true);
|
|
|
|
});
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#static copy', () => {
|
|
|
|
it('should copy in an programatic way based on text', () => {
|
|
|
|
assert.equal(Clipboard.copy('lorem'), 'lorem');
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
it('should copy in an programatic way based on target', () => {
|
|
|
|
assert.equal(Clipboard.copy(document.querySelector('span')), 'bar');
|
|
|
|
});
|
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#static cut', () => {
|
|
|
|
it('should cut in an programatic way based on text', () => {
|
|
|
|
assert.equal(Clipboard.cut(document.querySelector('span')), 'bar');
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
2024-01-16 21:26:16 +08:00
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#destroy', () => {
|
|
|
|
it('should destroy an existing instance of ClipboardActionDefault', () => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.onClick(global.event);
|
|
|
|
clipboard.destroy();
|
|
|
|
|
|
|
|
assert.equal(clipboard.clipboardAction, null);
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
2024-01-16 21:26:16 +08:00
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
describe('#events', () => {
|
|
|
|
it('should fire a success event with certain properties', (done) => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
clipboard.on('success', (e) => {
|
|
|
|
assert.property(e, 'action');
|
|
|
|
assert.equal(e.action, 'copy');
|
|
|
|
assert.property(e, 'text');
|
|
|
|
assert.property(e, 'trigger');
|
|
|
|
assert.property(e, 'clearSelection');
|
2023-12-18 13:12:25 +08:00
|
|
|
|
2024-01-16 21:26:16 +08:00
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
clipboard.onClick(global.event);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('#clearSelection', () => {
|
|
|
|
it('should clear text selection without moving focus', (done) => {
|
|
|
|
let clipboard = new Clipboard('.btn');
|
|
|
|
|
|
|
|
clipboard.on('success', (e) => {
|
|
|
|
e.clearSelection();
|
|
|
|
|
|
|
|
let selectedElem = document.activeElement;
|
|
|
|
let selectedText = window.getSelection().toString();
|
|
|
|
|
|
|
|
assert.equal(selectedElem, e.trigger);
|
|
|
|
assert.equal(selectedText, '');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
|
|
|
|
clipboard.onClick(global.event);
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|
2024-01-16 21:26:16 +08:00
|
|
|
});
|
2023-12-18 13:12:25 +08:00
|
|
|
});
|