#1215

Build # #1215

Build Type

push

Committed by

Commit Message

Merge pull request #342 from mac-s-g/bump-patch

bump patch version

Run Details

284 of 349 branches covered (81.38%)

Branch coverage included in aggregate %.

504 of 597 relevant lines covered (84.42%)

90.19 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

81.63

/src/js/components/CopyToClipboard.js

import React from 'react';

import { toType } from './../helpers/util';

//clibboard icon
import { Clippy } from './icons';

//theme
import Theme from './../themes/getStyle';

export default class extends React.PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            copied: false
        };
    }

    copiedTimer = null;

    componentWillUnmount() {
        if (this.copiedTimer) {
            clearTimeout(this.copiedTimer);
            this.copiedTimer = null;
        }
    }

    handleCopy = () => {
        const container = document.createElement('textarea');
        const { clickCallback, src, namespace } = this.props;

        container.innerHTML = JSON.stringify(
            this.clipboardValue(src),
            null,
            '  '
        );

        document.body.appendChild(container);
        container.select();
        document.execCommand('copy');

        document.body.removeChild(container);

        this.copiedTimer = setTimeout(() => {
            this.setState({
                copied: false
            });
        }, 5500);

        this.setState({ copied: true }, () => {
            if (typeof clickCallback !== 'function') {
                return;
            }

            clickCallback({
                src: src,
                namespace: namespace,
                name: namespace[namespace.length - 1]
            });
        });
    };

    getClippyIcon = () => {
        const { theme } = this.props;

        if (this.state.copied) {
            return (
                <span>
                    <Clippy class="copy-icon" {...Theme(theme, 'copy-icon')} />
                    <span {...Theme(theme, 'copy-icon-copied')}>✔</span>
                </span>
            );
        }

        return <Clippy class="copy-icon" {...Theme(theme, 'copy-icon')} />;
    };

    clipboardValue = value => {
        const type = toType(value);
        switch (type) {
            case 'function':
            case 'regexp':
                return value.toString();
            default:
                return value;
        }
    };

    render() {
        const { src, theme, hidden, rowHovered } = this.props;
        let style = Theme(theme, 'copy-to-clipboard').style;
        let display = 'inline';

        if (hidden) {
            display = 'none';
        }

        return (
            <span
                className="copy-to-clipboard-container"
                title="Copy to clipboard"
                style={{
                    verticalAlign: 'top',
                    display: rowHovered ? 'inline-block' : 'none'
                }}
            >
                <span
                    style={{
                        ...style,
                        display: display
                    }}
                    onClick={this.handleCopy}
                >
                    {this.getClippyIcon()}
                </span>
            </span>
        );
    }
}

1	import React from 'react';
2
3	import { toType } from './../helpers/util';
4
5	//clibboard icon
6	import { Clippy } from './icons';
7
8	//theme
9	import Theme from './../themes/getStyle';
10
11	export default class extends React.PureComponent {
12	constructor(props) {
13	super(props);	92✔
14	this.state = {	92✔
15	copied: false
16	};
17	}
18
19	copiedTimer = null;	92✔
20
21	componentWillUnmount() {
22	if (this.copiedTimer) {	2!
23	clearTimeout(this.copiedTimer);	×
24	this.copiedTimer = null;	×
25	}
26	}
27
28	handleCopy = () => {	92✔
29	const container = document.createElement('textarea');	2✔
30	const { clickCallback, src, namespace } = this.props;	2✔
31
32	container.innerHTML = JSON.stringify(	2✔
33	this.clipboardValue(src),
34	null,
35	' '
36	);
37
38	document.body.appendChild(container);	2✔
39	container.select();	2✔
40	document.execCommand('copy');	2✔
41
42	document.body.removeChild(container);	2✔
43
44	this.copiedTimer = setTimeout(() => {	2✔
45	this.setState({	2✔
46	copied: false
47	});
48	}, 5500);
49
50	this.setState({ copied: true }, () => {	2✔
51	if (typeof clickCallback !== 'function') {	2!
52	return;	×
53	}
54
55	clickCallback({	2✔
56	src: src,
57	namespace: namespace,
58	name: namespace[namespace.length - 1]
59	});
60	});
61	};
62
63	getClippyIcon = () => {	92✔
64	const { theme } = this.props;	98✔
65
66	if (this.state.copied) {	98✔
67	return (	2✔
68	<span>
69	<Clippy class="copy-icon" {...Theme(theme, 'copy-icon')} />
70	<span {...Theme(theme, 'copy-icon-copied')}>✔</span>
71	</span>
72	);
73	}
74
75	return <Clippy class="copy-icon" {...Theme(theme, 'copy-icon')} />;	96✔
76	};
77
78	clipboardValue = value => {	92✔
79	const type = toType(value);	2✔
80	switch (type) {	2!
81	case 'function':
82	case 'regexp':
83	return value.toString();	×
84	default:
85	return value;	2✔
86	}
87	};
88
89	render() {
90	const { src, theme, hidden, rowHovered } = this.props;	98✔
91	let style = Theme(theme, 'copy-to-clipboard').style;	98✔
92	let display = 'inline';	98✔
93
94	if (hidden) {	98✔
95	display = 'none';	2✔
96	}
97
98	return (	98✔
99	<span
100	className="copy-to-clipboard-container"
101	title="Copy to clipboard"
102	style={{
103	verticalAlign: 'top',
104	display: rowHovered ? 'inline-block' : 'none'	98!
105	}}
106	>
107	<span
108	style={{
109	...style,
110	display: display
111	}}
112	onClick={this.handleCopy}
113	>
114	{this.getClippyIcon()}
115	</span>
116	</span>
117	);
118	}
119	}

mac-s-g / react-json-view / #1215

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous