mirror of
https://github.com/zenorocha/clipboard.js.git
synced 2023-08-10 21:12:48 +03:00
update code style
This commit is contained in:
parent
d8a51544bd
commit
971834388c
@ -16,14 +16,14 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard by passing a HTML element -->
|
||||
<script>
|
||||
var btn = document.getElementById("btn");
|
||||
var btn = document.getElementById('btn');
|
||||
var clipboard = new ClipboardJS(btn);
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -16,14 +16,14 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard by passing a list of HTML elements -->
|
||||
<script>
|
||||
var btns = document.querySelectorAll("button");
|
||||
var btns = document.querySelectorAll('button');
|
||||
var clipboard = new ClipboardJS(btns);
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -16,13 +16,13 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard by passing a string selector -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -15,17 +15,17 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn", {
|
||||
var clipboard = new ClipboardJS('.btn', {
|
||||
target: function () {
|
||||
return document.querySelector("div");
|
||||
return document.querySelector('div');
|
||||
},
|
||||
});
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -14,17 +14,17 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn", {
|
||||
var clipboard = new ClipboardJS('.btn', {
|
||||
text: function () {
|
||||
return "to be or not to be";
|
||||
return 'to be or not to be';
|
||||
},
|
||||
});
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -21,13 +21,13 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -21,13 +21,13 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -21,13 +21,13 @@
|
||||
|
||||
<!-- 3. Instantiate clipboard -->
|
||||
<script>
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
clipboard.on('success', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
clipboard.on('error', function (e) {
|
||||
console.log(e);
|
||||
});
|
||||
</script>
|
||||
|
@ -1,25 +1,25 @@
|
||||
var webpackConfig = require("./webpack.config.js");
|
||||
var webpackConfig = require('./webpack.config.js');
|
||||
|
||||
module.exports = function (karma) {
|
||||
karma.set({
|
||||
plugins: [
|
||||
"karma-webpack",
|
||||
"karma-chai",
|
||||
"karma-sinon",
|
||||
"karma-mocha",
|
||||
"karma-chrome-launcher",
|
||||
'karma-webpack',
|
||||
'karma-chai',
|
||||
'karma-sinon',
|
||||
'karma-mocha',
|
||||
'karma-chrome-launcher',
|
||||
],
|
||||
|
||||
frameworks: ["chai", "sinon", "mocha", "webpack"],
|
||||
frameworks: ['chai', 'sinon', 'mocha', 'webpack'],
|
||||
|
||||
files: [
|
||||
{ pattern: "src/**/*.js", watched: false },
|
||||
{ pattern: "test/**/*.js", watched: false },
|
||||
{ pattern: 'src/**/*.js', watched: false },
|
||||
{ pattern: 'test/**/*.js', watched: false },
|
||||
],
|
||||
|
||||
preprocessors: {
|
||||
"src/**/*.js": ["webpack"],
|
||||
"test/**/*.js": ["webpack"],
|
||||
'src/**/*.js': ['webpack'],
|
||||
'test/**/*.js': ['webpack'],
|
||||
},
|
||||
|
||||
webpack: {
|
||||
@ -28,9 +28,9 @@ module.exports = function (karma) {
|
||||
},
|
||||
|
||||
webpackMiddleware: {
|
||||
stats: "errors-only",
|
||||
stats: 'errors-only',
|
||||
},
|
||||
|
||||
browsers: ["ChromeHeadless"],
|
||||
browsers: ['ChromeHeadless'],
|
||||
});
|
||||
};
|
||||
|
10
package.js
10
package.js
@ -1,12 +1,12 @@
|
||||
// Package metadata for Meteor.js.
|
||||
|
||||
Package.describe({
|
||||
name: "zenorocha:clipboard",
|
||||
summary: "Modern copy to clipboard. No Flash. Just 3kb.",
|
||||
version: "2.0.6",
|
||||
git: "https://github.com/zenorocha/clipboard.js",
|
||||
name: 'zenorocha:clipboard',
|
||||
summary: 'Modern copy to clipboard. No Flash. Just 3kb.',
|
||||
version: '2.0.6',
|
||||
git: 'https://github.com/zenorocha/clipboard.js',
|
||||
});
|
||||
|
||||
Package.onUse(function (api) {
|
||||
api.addFiles("dist/clipboard.js", "client");
|
||||
api.addFiles('dist/clipboard.js', 'client');
|
||||
});
|
||||
|
30
readme.md
30
readme.md
@ -34,7 +34,7 @@ First, include the script located on the `dist` folder or load it from [a third-
|
||||
Now, you need to instantiate it by [passing a DOM selector](https://github.com/zenorocha/clipboard.js/blob/master/demo/constructor-selector.html#L18), [HTML element](https://github.com/zenorocha/clipboard.js/blob/master/demo/constructor-node.html#L16-L17), or [list of HTML elements](https://github.com/zenorocha/clipboard.js/blob/master/demo/constructor-nodelist.html#L18-L19).
|
||||
|
||||
```js
|
||||
new ClipboardJS(".btn");
|
||||
new ClipboardJS('.btn');
|
||||
```
|
||||
|
||||
Internally, we need to fetch all elements that matches with your selector and attach event listeners for each one. But guess what? If you have hundreds of matches, this operation can consume a lot of memory.
|
||||
@ -106,19 +106,19 @@ There are cases where you'd like to show some user feedback or capture what has
|
||||
That's why we fire custom events such as `success` and `error` for you to listen and implement your custom logic.
|
||||
|
||||
```js
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
|
||||
clipboard.on("success", function (e) {
|
||||
console.info("Action:", e.action);
|
||||
console.info("Text:", e.text);
|
||||
console.info("Trigger:", e.trigger);
|
||||
clipboard.on('success', function (e) {
|
||||
console.info('Action:', e.action);
|
||||
console.info('Text:', e.text);
|
||||
console.info('Trigger:', e.trigger);
|
||||
|
||||
e.clearSelection();
|
||||
});
|
||||
|
||||
clipboard.on("error", function (e) {
|
||||
console.error("Action:", e.action);
|
||||
console.error("Trigger:", e.trigger);
|
||||
clipboard.on('error', function (e) {
|
||||
console.error('Action:', e.action);
|
||||
console.error('Trigger:', e.trigger);
|
||||
});
|
||||
```
|
||||
|
||||
@ -137,7 +137,7 @@ If you don't want to modify your HTML, there's a pretty handy imperative API for
|
||||
For instance, if you want to dynamically set a `target`, you'll need to return a Node.
|
||||
|
||||
```js
|
||||
new ClipboardJS(".btn", {
|
||||
new ClipboardJS('.btn', {
|
||||
target: function (trigger) {
|
||||
return trigger.nextElementSibling;
|
||||
},
|
||||
@ -147,9 +147,9 @@ new ClipboardJS(".btn", {
|
||||
If you want to dynamically set a `text`, you'll return a String.
|
||||
|
||||
```js
|
||||
new ClipboardJS(".btn", {
|
||||
new ClipboardJS('.btn', {
|
||||
text: function (trigger) {
|
||||
return trigger.getAttribute("aria-label");
|
||||
return trigger.getAttribute('aria-label');
|
||||
},
|
||||
});
|
||||
```
|
||||
@ -157,15 +157,15 @@ new ClipboardJS(".btn", {
|
||||
For use in Bootstrap Modals or with any other library that changes the focus you'll want to set the focused element as the `container` value.
|
||||
|
||||
```js
|
||||
new ClipboardJS(".btn", {
|
||||
container: document.getElementById("modal"),
|
||||
new ClipboardJS('.btn', {
|
||||
container: document.getElementById('modal'),
|
||||
});
|
||||
```
|
||||
|
||||
Also, if you are working with single page apps, you may want to manage the lifecycle of the DOM more precisely. Here's how you clean up the events and objects that we create.
|
||||
|
||||
```js
|
||||
var clipboard = new ClipboardJS(".btn");
|
||||
var clipboard = new ClipboardJS('.btn');
|
||||
clipboard.destroy();
|
||||
```
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import select from "select";
|
||||
import select from 'select';
|
||||
|
||||
/**
|
||||
* Inner class which performs selection from either `text` or `target`
|
||||
@ -25,7 +25,7 @@ class ClipboardAction {
|
||||
this.text = options.text;
|
||||
this.trigger = options.trigger;
|
||||
|
||||
this.selectedText = "";
|
||||
this.selectedText = '';
|
||||
}
|
||||
|
||||
/**
|
||||
@ -45,30 +45,30 @@ class ClipboardAction {
|
||||
* and makes a selection on it.
|
||||
*/
|
||||
selectFake() {
|
||||
const isRTL = document.documentElement.getAttribute("dir") == "rtl";
|
||||
const isRTL = document.documentElement.getAttribute('dir') == 'rtl';
|
||||
|
||||
this.removeFake();
|
||||
|
||||
this.fakeHandlerCallback = () => this.removeFake();
|
||||
this.fakeHandler =
|
||||
this.container.addEventListener("click", this.fakeHandlerCallback) ||
|
||||
this.container.addEventListener('click', this.fakeHandlerCallback) ||
|
||||
true;
|
||||
|
||||
this.fakeElem = document.createElement("textarea");
|
||||
this.fakeElem = document.createElement('textarea');
|
||||
// Prevent zooming on iOS
|
||||
this.fakeElem.style.fontSize = "12pt";
|
||||
this.fakeElem.style.fontSize = '12pt';
|
||||
// Reset box model
|
||||
this.fakeElem.style.border = "0";
|
||||
this.fakeElem.style.padding = "0";
|
||||
this.fakeElem.style.margin = "0";
|
||||
this.fakeElem.style.border = '0';
|
||||
this.fakeElem.style.padding = '0';
|
||||
this.fakeElem.style.margin = '0';
|
||||
// Move element out of screen horizontally
|
||||
this.fakeElem.style.position = "absolute";
|
||||
this.fakeElem.style[isRTL ? "right" : "left"] = "-9999px";
|
||||
this.fakeElem.style.position = 'absolute';
|
||||
this.fakeElem.style[isRTL ? 'right' : 'left'] = '-9999px';
|
||||
// Move element to the same position vertically
|
||||
let yPosition = window.pageYOffset || document.documentElement.scrollTop;
|
||||
this.fakeElem.style.top = `${yPosition}px`;
|
||||
|
||||
this.fakeElem.setAttribute("readonly", "");
|
||||
this.fakeElem.setAttribute('readonly', '');
|
||||
this.fakeElem.value = this.text;
|
||||
|
||||
this.container.appendChild(this.fakeElem);
|
||||
@ -83,7 +83,7 @@ class ClipboardAction {
|
||||
*/
|
||||
removeFake() {
|
||||
if (this.fakeHandler) {
|
||||
this.container.removeEventListener("click", this.fakeHandlerCallback);
|
||||
this.container.removeEventListener('click', this.fakeHandlerCallback);
|
||||
this.fakeHandler = null;
|
||||
this.fakeHandlerCallback = null;
|
||||
}
|
||||
@ -122,7 +122,7 @@ class ClipboardAction {
|
||||
* @param {Boolean} succeeded
|
||||
*/
|
||||
handleResult(succeeded) {
|
||||
this.emitter.emit(succeeded ? "success" : "error", {
|
||||
this.emitter.emit(succeeded ? 'success' : 'error', {
|
||||
action: this.action,
|
||||
text: this.selectedText,
|
||||
trigger: this.trigger,
|
||||
@ -145,10 +145,10 @@ class ClipboardAction {
|
||||
* Sets the `action` to be performed which can be either 'copy' or 'cut'.
|
||||
* @param {String} action
|
||||
*/
|
||||
set action(action = "copy") {
|
||||
set action(action = 'copy') {
|
||||
this._action = action;
|
||||
|
||||
if (this._action !== "copy" && this._action !== "cut") {
|
||||
if (this._action !== 'copy' && this._action !== 'cut') {
|
||||
throw new Error('Invalid "action" value, use either "copy" or "cut"');
|
||||
}
|
||||
}
|
||||
@ -168,16 +168,16 @@ class ClipboardAction {
|
||||
*/
|
||||
set target(target) {
|
||||
if (target !== undefined) {
|
||||
if (target && typeof target === "object" && target.nodeType === 1) {
|
||||
if (this.action === "copy" && target.hasAttribute("disabled")) {
|
||||
if (target && typeof target === 'object' && target.nodeType === 1) {
|
||||
if (this.action === 'copy' && target.hasAttribute('disabled')) {
|
||||
throw new Error(
|
||||
'Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute'
|
||||
);
|
||||
}
|
||||
|
||||
if (
|
||||
this.action === "cut" &&
|
||||
(target.hasAttribute("readonly") || target.hasAttribute("disabled"))
|
||||
this.action === 'cut' &&
|
||||
(target.hasAttribute('readonly') || target.hasAttribute('disabled'))
|
||||
) {
|
||||
throw new Error(
|
||||
'Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes'
|
||||
|
@ -1,6 +1,6 @@
|
||||
import ClipboardAction from "./clipboard-action";
|
||||
import Emitter from "tiny-emitter";
|
||||
import listen from "good-listener";
|
||||
import ClipboardAction from './clipboard-action';
|
||||
import Emitter from 'tiny-emitter';
|
||||
import listen from 'good-listener';
|
||||
|
||||
/**
|
||||
* Base class which takes one or more elements, adds event listeners to them,
|
||||
@ -25,17 +25,17 @@ class Clipboard extends Emitter {
|
||||
*/
|
||||
resolveOptions(options = {}) {
|
||||
this.action =
|
||||
typeof options.action === "function"
|
||||
typeof options.action === 'function'
|
||||
? options.action
|
||||
: this.defaultAction;
|
||||
this.target =
|
||||
typeof options.target === "function"
|
||||
typeof options.target === 'function'
|
||||
? options.target
|
||||
: this.defaultTarget;
|
||||
this.text =
|
||||
typeof options.text === "function" ? options.text : this.defaultText;
|
||||
typeof options.text === 'function' ? options.text : this.defaultText;
|
||||
this.container =
|
||||
typeof options.container === "object" ? options.container : document.body;
|
||||
typeof options.container === 'object' ? options.container : document.body;
|
||||
}
|
||||
|
||||
/**
|
||||
@ -43,7 +43,7 @@ class Clipboard extends Emitter {
|
||||
* @param {String|HTMLElement|HTMLCollection|NodeList} trigger
|
||||
*/
|
||||
listenClick(trigger) {
|
||||
this.listener = listen(trigger, "click", (e) => this.onClick(e));
|
||||
this.listener = listen(trigger, 'click', (e) => this.onClick(e));
|
||||
}
|
||||
|
||||
/**
|
||||
@ -72,7 +72,7 @@ class Clipboard extends Emitter {
|
||||
* @param {Element} trigger
|
||||
*/
|
||||
defaultAction(trigger) {
|
||||
return getAttributeValue("action", trigger);
|
||||
return getAttributeValue('action', trigger);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -80,7 +80,7 @@ class Clipboard extends Emitter {
|
||||
* @param {Element} trigger
|
||||
*/
|
||||
defaultTarget(trigger) {
|
||||
const selector = getAttributeValue("target", trigger);
|
||||
const selector = getAttributeValue('target', trigger);
|
||||
|
||||
if (selector) {
|
||||
return document.querySelector(selector);
|
||||
@ -92,8 +92,8 @@ class Clipboard extends Emitter {
|
||||
* given.
|
||||
* @param {String} [action]
|
||||
*/
|
||||
static isSupported(action = ["copy", "cut"]) {
|
||||
const actions = typeof action === "string" ? [action] : action;
|
||||
static isSupported(action = ['copy', 'cut']) {
|
||||
const actions = typeof action === 'string' ? [action] : action;
|
||||
let support = !!document.queryCommandSupported;
|
||||
|
||||
actions.forEach((action) => {
|
||||
@ -108,7 +108,7 @@ class Clipboard extends Emitter {
|
||||
* @param {Element} trigger
|
||||
*/
|
||||
defaultText(trigger) {
|
||||
return getAttributeValue("text", trigger);
|
||||
return getAttributeValue('text', trigger);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -1,63 +1,63 @@
|
||||
import ClipboardAction from "../src/clipboard-action";
|
||||
import Emitter from "tiny-emitter";
|
||||
import ClipboardAction from '../src/clipboard-action';
|
||||
import Emitter from 'tiny-emitter';
|
||||
|
||||
describe("ClipboardAction", () => {
|
||||
describe('ClipboardAction', () => {
|
||||
before(() => {
|
||||
global.input = document.createElement("input");
|
||||
global.input.setAttribute("id", "input");
|
||||
global.input.setAttribute("value", "abc");
|
||||
global.input = document.createElement('input');
|
||||
global.input.setAttribute('id', 'input');
|
||||
global.input.setAttribute('value', 'abc');
|
||||
document.body.appendChild(global.input);
|
||||
|
||||
global.paragraph = document.createElement("p");
|
||||
global.paragraph.setAttribute("id", "paragraph");
|
||||
global.paragraph.textContent = "abc";
|
||||
global.paragraph = document.createElement('p');
|
||||
global.paragraph.setAttribute('id', 'paragraph');
|
||||
global.paragraph.textContent = 'abc';
|
||||
document.body.appendChild(global.paragraph);
|
||||
});
|
||||
|
||||
after(() => {
|
||||
document.body.innerHTML = "";
|
||||
document.body.innerHTML = '';
|
||||
});
|
||||
|
||||
describe("#resolveOptions", () => {
|
||||
it("should set base properties", () => {
|
||||
describe('#resolveOptions', () => {
|
||||
it('should set base properties', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
text: "foo",
|
||||
text: 'foo',
|
||||
});
|
||||
|
||||
assert.property(clip, "action");
|
||||
assert.property(clip, "container");
|
||||
assert.property(clip, "emitter");
|
||||
assert.property(clip, "target");
|
||||
assert.property(clip, "text");
|
||||
assert.property(clip, "trigger");
|
||||
assert.property(clip, "selectedText");
|
||||
assert.property(clip, 'action');
|
||||
assert.property(clip, 'container');
|
||||
assert.property(clip, 'emitter');
|
||||
assert.property(clip, 'target');
|
||||
assert.property(clip, 'text');
|
||||
assert.property(clip, 'trigger');
|
||||
assert.property(clip, 'selectedText');
|
||||
});
|
||||
});
|
||||
|
||||
describe("#initSelection", () => {
|
||||
it("should set the position right style property", (done) => {
|
||||
describe('#initSelection', () => {
|
||||
it('should set the position right style property', (done) => {
|
||||
// Set document direction
|
||||
document.documentElement.setAttribute("dir", "rtl");
|
||||
document.documentElement.setAttribute('dir', 'rtl');
|
||||
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
text: "foo",
|
||||
text: 'foo',
|
||||
});
|
||||
|
||||
assert.equal(clip.fakeElem.style.right, "-9999px");
|
||||
assert.equal(clip.fakeElem.style.right, '-9999px');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
describe("#set action", () => {
|
||||
describe('#set action', () => {
|
||||
it('should throw an error since "action" is invalid', (done) => {
|
||||
try {
|
||||
new ClipboardAction({
|
||||
text: "foo",
|
||||
action: "paste",
|
||||
text: 'foo',
|
||||
action: 'paste',
|
||||
});
|
||||
} catch (e) {
|
||||
assert.equal(
|
||||
@ -69,11 +69,11 @@ describe("ClipboardAction", () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe("#set target", () => {
|
||||
describe('#set target', () => {
|
||||
it('should throw an error since "target" do not match any element', (done) => {
|
||||
try {
|
||||
new ClipboardAction({
|
||||
target: document.querySelector("#foo"),
|
||||
target: document.querySelector('#foo'),
|
||||
});
|
||||
} catch (e) {
|
||||
assert.equal(e.message, 'Invalid "target" value, use a valid Element');
|
||||
@ -82,24 +82,24 @@ describe("ClipboardAction", () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe("#selectText", () => {
|
||||
it("should create a fake element and select its value", () => {
|
||||
describe('#selectText', () => {
|
||||
it('should create a fake element and select its value', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
text: "blah",
|
||||
text: 'blah',
|
||||
});
|
||||
|
||||
assert.equal(clip.selectedText, clip.fakeElem.value);
|
||||
});
|
||||
});
|
||||
|
||||
describe("#removeFake", () => {
|
||||
it("should remove a temporary fake element", () => {
|
||||
describe('#removeFake', () => {
|
||||
it('should remove a temporary fake element', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
text: "blah",
|
||||
text: 'blah',
|
||||
});
|
||||
|
||||
clip.removeFake();
|
||||
@ -108,81 +108,81 @@ describe("ClipboardAction", () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe("#selectTarget", () => {
|
||||
it("should select text from editable element", () => {
|
||||
describe('#selectTarget', () => {
|
||||
it('should select text from editable element', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
|
||||
assert.equal(clip.selectedText, clip.target.value);
|
||||
});
|
||||
|
||||
it("should select text from non-editable element", () => {
|
||||
it('should select text from non-editable element', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
target: document.querySelector("#paragraph"),
|
||||
target: document.querySelector('#paragraph'),
|
||||
});
|
||||
|
||||
assert.equal(clip.selectedText, clip.target.textContent);
|
||||
});
|
||||
});
|
||||
|
||||
describe("#copyText", () => {
|
||||
describe('#copyText', () => {
|
||||
before(() => {
|
||||
global.stub = sinon.stub(document, "execCommand");
|
||||
global.stub = sinon.stub(document, 'execCommand');
|
||||
});
|
||||
|
||||
after(() => {
|
||||
global.stub.restore();
|
||||
});
|
||||
|
||||
it("should fire a success event on browsers that support copy command", (done) => {
|
||||
it('should fire a success event on browsers that support copy command', (done) => {
|
||||
global.stub.returns(true);
|
||||
|
||||
let emitter = new Emitter();
|
||||
|
||||
emitter.on("success", () => {
|
||||
emitter.on('success', () => {
|
||||
done();
|
||||
});
|
||||
|
||||
let clip = new ClipboardAction({
|
||||
emitter,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
});
|
||||
|
||||
it("should fire an error event on browsers that support copy command", (done) => {
|
||||
it('should fire an error event on browsers that support copy command', (done) => {
|
||||
global.stub.returns(false);
|
||||
|
||||
let emitter = new Emitter();
|
||||
|
||||
emitter.on("error", () => {
|
||||
emitter.on('error', () => {
|
||||
done();
|
||||
});
|
||||
|
||||
let clip = new ClipboardAction({
|
||||
emitter,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("#handleResult", () => {
|
||||
it("should fire a success event with certain properties", (done) => {
|
||||
describe('#handleResult', () => {
|
||||
it('should fire a success event with certain properties', (done) => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
|
||||
clip.emitter.on("success", (e) => {
|
||||
assert.property(e, "action");
|
||||
assert.property(e, "text");
|
||||
assert.property(e, "trigger");
|
||||
assert.property(e, "clearSelection");
|
||||
clip.emitter.on('success', (e) => {
|
||||
assert.property(e, 'action');
|
||||
assert.property(e, 'text');
|
||||
assert.property(e, 'trigger');
|
||||
assert.property(e, 'clearSelection');
|
||||
|
||||
done();
|
||||
});
|
||||
@ -190,17 +190,17 @@ describe("ClipboardAction", () => {
|
||||
clip.handleResult(true);
|
||||
});
|
||||
|
||||
it("should fire a error event with certain properties", (done) => {
|
||||
it('should fire a error event with certain properties', (done) => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
|
||||
clip.emitter.on("error", (e) => {
|
||||
assert.property(e, "action");
|
||||
assert.property(e, "trigger");
|
||||
assert.property(e, "clearSelection");
|
||||
clip.emitter.on('error', (e) => {
|
||||
assert.property(e, 'action');
|
||||
assert.property(e, 'trigger');
|
||||
assert.property(e, 'clearSelection');
|
||||
|
||||
done();
|
||||
});
|
||||
@ -209,12 +209,12 @@ describe("ClipboardAction", () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe("#clearSelection", () => {
|
||||
it("should remove focus from target and text selection", () => {
|
||||
describe('#clearSelection', () => {
|
||||
it('should remove focus from target and text selection', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
target: document.querySelector("#input"),
|
||||
target: document.querySelector('#input'),
|
||||
});
|
||||
|
||||
clip.clearSelection();
|
||||
@ -223,16 +223,16 @@ describe("ClipboardAction", () => {
|
||||
let selectedText = window.getSelection().toString();
|
||||
|
||||
assert.equal(selectedElem, document.body);
|
||||
assert.equal(selectedText, "");
|
||||
assert.equal(selectedText, '');
|
||||
});
|
||||
});
|
||||
|
||||
describe("#destroy", () => {
|
||||
it("should destroy an existing fake element", () => {
|
||||
describe('#destroy', () => {
|
||||
it('should destroy an existing fake element', () => {
|
||||
let clip = new ClipboardAction({
|
||||
emitter: new Emitter(),
|
||||
container: document.body,
|
||||
text: "blah",
|
||||
text: 'blah',
|
||||
});
|
||||
|
||||
clip.selectFake();
|
||||
|
@ -1,16 +1,16 @@
|
||||
import Clipboard from "../src/clipboard";
|
||||
import ClipboardAction from "../src/clipboard-action";
|
||||
import listen from "good-listener";
|
||||
import Clipboard from '../src/clipboard';
|
||||
import ClipboardAction from '../src/clipboard-action';
|
||||
import listen from 'good-listener';
|
||||
|
||||
describe("Clipboard", () => {
|
||||
describe('Clipboard', () => {
|
||||
before(() => {
|
||||
global.button = document.createElement("button");
|
||||
global.button.setAttribute("class", "btn");
|
||||
global.button.setAttribute("data-clipboard-text", "foo");
|
||||
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.span = document.createElement('span');
|
||||
global.span.innerHTML = 'bar';
|
||||
|
||||
global.button.appendChild(span);
|
||||
|
||||
@ -21,70 +21,70 @@ describe("Clipboard", () => {
|
||||
});
|
||||
|
||||
after(() => {
|
||||
document.body.innerHTML = "";
|
||||
document.body.innerHTML = '';
|
||||
});
|
||||
|
||||
describe("#resolveOptions", () => {
|
||||
describe('#resolveOptions', () => {
|
||||
before(() => {
|
||||
global.fn = () => {};
|
||||
});
|
||||
|
||||
it("should set action as a function", () => {
|
||||
let clipboard = new Clipboard(".btn", {
|
||||
it('should set action as a function', () => {
|
||||
let clipboard = new Clipboard('.btn', {
|
||||
action: global.fn,
|
||||
});
|
||||
|
||||
assert.equal(global.fn, clipboard.action);
|
||||
});
|
||||
|
||||
it("should set target as a function", () => {
|
||||
let clipboard = new Clipboard(".btn", {
|
||||
it('should set target as a function', () => {
|
||||
let clipboard = new Clipboard('.btn', {
|
||||
target: global.fn,
|
||||
});
|
||||
|
||||
assert.equal(global.fn, clipboard.target);
|
||||
});
|
||||
|
||||
it("should set text as a function", () => {
|
||||
let clipboard = new Clipboard(".btn", {
|
||||
it('should set text as a function', () => {
|
||||
let clipboard = new Clipboard('.btn', {
|
||||
text: global.fn,
|
||||
});
|
||||
|
||||
assert.equal(global.fn, clipboard.text);
|
||||
});
|
||||
|
||||
it("should set container as an object", () => {
|
||||
let clipboard = new Clipboard(".btn", {
|
||||
it('should set container as an object', () => {
|
||||
let clipboard = new Clipboard('.btn', {
|
||||
container: document.body,
|
||||
});
|
||||
|
||||
assert.equal(document.body, clipboard.container);
|
||||
});
|
||||
|
||||
it("should set container as body by default", () => {
|
||||
let clipboard = new Clipboard(".btn");
|
||||
it('should set container as body by default', () => {
|
||||
let clipboard = new Clipboard('.btn');
|
||||
|
||||
assert.equal(document.body, clipboard.container);
|
||||
});
|
||||
});
|
||||
|
||||
describe("#listenClick", () => {
|
||||
it("should add a click event listener to the passed selector", () => {
|
||||
let clipboard = new Clipboard(".btn");
|
||||
describe('#listenClick', () => {
|
||||
it('should add a click event listener to the passed selector', () => {
|
||||
let clipboard = new Clipboard('.btn');
|
||||
assert.isObject(clipboard.listener);
|
||||
});
|
||||
});
|
||||
|
||||
describe("#onClick", () => {
|
||||
it("should create a new instance of ClipboardAction", () => {
|
||||
let clipboard = new Clipboard(".btn");
|
||||
describe('#onClick', () => {
|
||||
it('should create a new instance of ClipboardAction', () => {
|
||||
let clipboard = new Clipboard('.btn');
|
||||
|
||||
clipboard.onClick(global.event);
|
||||
assert.instanceOf(clipboard.clipboardAction, ClipboardAction);
|
||||
});
|
||||
|
||||
it("should use an event's currentTarget when not equal to target", () => {
|
||||
let clipboard = new Clipboard(".btn");
|
||||
let clipboard = new Clipboard('.btn');
|
||||
let bubbledEvent = {
|
||||
target: global.span,
|
||||
currentTarget: global.button,
|
||||
@ -94,9 +94,9 @@ describe("Clipboard", () => {
|
||||
assert.instanceOf(clipboard.clipboardAction, ClipboardAction);
|
||||
});
|
||||
|
||||
it("should throw an exception when target is invalid", (done) => {
|
||||
it('should throw an exception when target is invalid', (done) => {
|
||||
try {
|
||||
const clipboard = new Clipboard(".btn", {
|
||||
const clipboard = new Clipboard('.btn', {
|
||||
target() {
|
||||
return null;
|
||||
},
|
||||
@ -110,20 +110,20 @@ describe("Clipboard", () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe("#static isSupported", () => {
|
||||
it("should return the support of the given action", () => {
|
||||
assert.equal(Clipboard.isSupported("copy"), true);
|
||||
assert.equal(Clipboard.isSupported("cut"), true);
|
||||
describe('#static isSupported', () => {
|
||||
it('should return the support of the given action', () => {
|
||||
assert.equal(Clipboard.isSupported('copy'), true);
|
||||
assert.equal(Clipboard.isSupported('cut'), true);
|
||||
});
|
||||
|
||||
it("should return the support of the cut and copy actions", () => {
|
||||
it('should return the support of the cut and copy actions', () => {
|
||||
assert.equal(Clipboard.isSupported(), true);
|
||||
});
|
||||
});
|
||||
|
||||
describe("#destroy", () => {
|
||||
it("should destroy an existing instance of ClipboardAction", () => {
|
||||
let clipboard = new Clipboard(".btn");
|
||||
describe('#destroy', () => {
|
||||
it('should destroy an existing instance of ClipboardAction', () => {
|
||||
let clipboard = new Clipboard('.btn');
|
||||
|
||||
clipboard.onClick(global.event);
|
||||
clipboard.destroy();
|
||||
|
@ -1,9 +1,9 @@
|
||||
const pkg = require("./package.json");
|
||||
const path = require("path");
|
||||
const webpack = require("webpack");
|
||||
const UglifyJSPlugin = require("uglifyjs-webpack-plugin");
|
||||
const pkg = require('./package.json');
|
||||
const path = require('path');
|
||||
const webpack = require('webpack');
|
||||
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
|
||||
|
||||
const production = process.env.NODE_ENV === "production" || false;
|
||||
const production = process.env.NODE_ENV === 'production' || false;
|
||||
|
||||
const banner = `clipboard.js v${pkg.version}
|
||||
https://clipboardjs.com/
|
||||
@ -11,31 +11,31 @@ https://clipboardjs.com/
|
||||
Licensed MIT © Zeno Rocha`;
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/clipboard.js",
|
||||
mode: "production",
|
||||
entry: './src/clipboard.js',
|
||||
mode: 'production',
|
||||
output: {
|
||||
filename: production ? "clipboard.min.js" : "clipboard.js",
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
library: "ClipboardJS",
|
||||
globalObject: "this",
|
||||
libraryExport: "default",
|
||||
libraryTarget: "umd",
|
||||
filename: production ? 'clipboard.min.js' : 'clipboard.js',
|
||||
path: path.resolve(__dirname, 'dist'),
|
||||
library: 'ClipboardJS',
|
||||
globalObject: 'this',
|
||||
libraryExport: 'default',
|
||||
libraryTarget: 'umd',
|
||||
},
|
||||
module: {
|
||||
rules: [{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }],
|
||||
rules: [{ test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }],
|
||||
},
|
||||
optimization: {
|
||||
minimize: production,
|
||||
minimizer: [
|
||||
new UglifyJSPlugin({
|
||||
parallel: require("os").cpus().length,
|
||||
parallel: require('os').cpus().length,
|
||||
uglifyOptions: {
|
||||
ie8: false,
|
||||
keep_fnames: false,
|
||||
output: {
|
||||
beautify: false,
|
||||
comments: (node, { value, type }) =>
|
||||
type == "comment2" && value.startsWith("!"),
|
||||
type == 'comment2' && value.startsWith('!'),
|
||||
},
|
||||
},
|
||||
}),
|
||||
|
Loading…
Reference in New Issue
Block a user