ca977947-d226-4d89-8edc-6f8573fedf8b

Committed 24 Aug 2023 10:18PM UTC coverage: 88.325% (-2.8%) from 91.157%

Build # ca977947-d226-4d89-8edc-6f8573fedf8b

Build Type

push

circleci

Committed by

web-flow

Commit Message

ci: re-enable Coveralls (#1301)

Run Details

967 of 1183 branches covered (0.0%)

Branch coverage included in aggregate %.

3648 of 4042 relevant lines covered (90.25%)

32.05 hits per line

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

87.72

/src/renderer/components/commands-address-bar.tsx

import * as React from 'react';

import { Button, InputGroup, Intent } from '@blueprintjs/core';
import classnames from 'classnames';
import { reaction } from 'mobx';
import { observer } from 'mobx-react';

import { GistActionState } from '../../interfaces';
import { idFromUrl, urlFromId } from '../../utils/gist';
import { AppState } from '../state';

interface AddressBarProps {
  appState: AppState;
}

interface AddressBarState {
  value: string;
  loaders: {
    gist: any;
    example: any;
  };
}

export const AddressBar = observer(
  class AddressBar extends React.Component<AddressBarProps, AddressBarState> {
    constructor(props: AddressBarProps) {
      super(props);
      this.handleSubmit = this.handleSubmit.bind(this);
      this.handleChange = this.handleChange.bind(this);
      this.handleBlur = this.handleBlur.bind(this);
      this.submit = this.submit.bind(this);

      const { gistId } = this.props.appState;
      const value = urlFromId(gistId);

      const { remoteLoader } = window.ElectronFiddle.app;

      this.state = {
        value,
        loaders: {
          gist: remoteLoader.loadFiddleFromGist.bind(remoteLoader),
          example:
            remoteLoader.loadFiddleFromElectronExample.bind(remoteLoader),
        },
      };
    }

    /**
     * Handle the form's submit event, trying to load whatever
     * URL was entered.
     *
     * @param {React.SyntheticEvent<HTMLFormElement>} event
     */
    private handleSubmit(event: React.SyntheticEvent<HTMLFormElement>) {
      event.preventDefault();
      this.submit();
    }

    /**
     * Commit the address bar's value to app state and load the fiddle.
     *
     * @memberof AddressBar
     */
    private submit() {
      const { remoteLoader } = window.ElectronFiddle.app;
      if (this.state.value) {
        remoteLoader.fetchGistAndLoad(
          idFromUrl(this.state.value) || this.state.value,
        );
      }
    }

    /**
     * Once the component mounts, we'll subscribe to gistId changes
     */
    public componentDidMount() {
      const { appState } = this.props;
      const { loaders } = this.state;
      reaction(
        () => appState.gistId,
        (gistId: string) => this.setState({ value: urlFromId(gistId) }),
      );
      window.ElectronFiddle.addEventListener('load-gist', loaders.gist);
      window.ElectronFiddle.addEventListener('load-example', loaders.example);
    }

    public componentWillUnmount() {
      window.ElectronFiddle.removeAllListeners('load-gist');
      window.ElectronFiddle.removeAllListeners('load-example');
    }

    /**
     * Handle the change event, which usually just updates the address bar's value
     *
     * @param {React.ChangeEvent<HTMLInputElement>} event
     */
    private handleChange(event: React.ChangeEvent<HTMLInputElement>) {
      this.setState({ value: event.target.value });
    }

    private handleBlur(event: React.FocusEvent<HTMLInputElement>) {
      const { gistId } = this.props.appState;
      const url = urlFromId(gistId);

      const shouldResetURL =
        url === event.target.value || event.target.value === '';
      if (url && shouldResetURL) {
        this.setState({ value: url });
      }
    }

    private renderLoadButton(isValueCorrect: boolean): JSX.Element {
      return (
        <Button
          disabled={!isValueCorrect}
          icon="cloud-download"
          text="Load Fiddle"
          onClick={this.submit}
        />
      );
    }

    public render() {
      const { activeGistAction } = this.props.appState;
      const { isEdited } = this.props.appState.editorMosaic;
      const { value } = this.state;
      const isCorrect = /https:\/\/gist\.github\.com\/(.+)$/.test(value);
      const className = classnames('address-bar', isEdited, { empty: !value });

      const isPerformingAction = activeGistAction !== GistActionState.none;
      return (
        <form
          className={className}
          aria-label={'Enter Fiddle Gist URL'}
          onSubmit={this.handleSubmit}
        >
          <fieldset disabled={isPerformingAction}>
            <InputGroup
              key="addressbar"
              leftIcon="geosearch"
              intent={isCorrect || !value ? undefined : Intent.DANGER}
              onChange={this.handleChange}
              onBlur={this.handleBlur}
              placeholder="https://gist.github.com/..."
              value={value}
              rightElement={this.renderLoadButton(isCorrect)}
            />
          </fieldset>
        </form>
      );
    }
  },
);

1	import * as React from 'react';	1✔
2
3	import { Button, InputGroup, Intent } from '@blueprintjs/core';	1✔
4	import classnames from 'classnames';	1✔
5	import { reaction } from 'mobx';	1✔
6	import { observer } from 'mobx-react';	1✔
7
8	import { GistActionState } from '../../interfaces';	1✔
9	import { idFromUrl, urlFromId } from '../../utils/gist';	1✔
10	import { AppState } from '../state';
11
12	interface AddressBarProps {
13	appState: AppState;
14	}
15
16	interface AddressBarState {
17	value: string;
18	loaders: {
19	gist: any;
20	example: any;
21	};
22	}
23
24	export const AddressBar = observer(	1✔
25	class AddressBar extends React.Component<AddressBarProps, AddressBarState> {
26	constructor(props: AddressBarProps) {
27	super(props);	6✔
28	this.handleSubmit = this.handleSubmit.bind(this);	6✔
29	this.handleChange = this.handleChange.bind(this);	6✔
30	this.handleBlur = this.handleBlur.bind(this);	6✔
31	this.submit = this.submit.bind(this);	6✔
32
33	const { gistId } = this.props.appState;	6✔
34	const value = urlFromId(gistId);	6✔
35
36	const { remoteLoader } = window.ElectronFiddle.app;	6✔
37
38	this.state = {	6✔
39	value,
40	loaders: {
41	gist: remoteLoader.loadFiddleFromGist.bind(remoteLoader),
42	example:
43	remoteLoader.loadFiddleFromElectronExample.bind(remoteLoader),
44	},
45	};
46	}
47
48	/**
49	* Handle the form's submit event, trying to load whatever
50	* URL was entered.
51	*
52	* @param {React.SyntheticEvent<HTMLFormElement>} event
53	*/
54	private handleSubmit(event: React.SyntheticEvent<HTMLFormElement>) {
55	event.preventDefault();	×
56	this.submit();	×
57	}
58
59	/**
60	* Commit the address bar's value to app state and load the fiddle.
61	*
62	* @memberof AddressBar
63	*/
64	private submit() {
65	const { remoteLoader } = window.ElectronFiddle.app;	1✔
66	if (this.state.value) {	1✔
67	remoteLoader.fetchGistAndLoad(	1✔
68	idFromUrl(this.state.value) \|\| this.state.value,	1!
69	);
70	}
71	}
72
73	/**
74	* Once the component mounts, we'll subscribe to gistId changes
75	*/
76	public componentDidMount() {
77	const { appState } = this.props;	6✔
78	const { loaders } = this.state;	6✔
79	reaction(	6✔
80	() => appState.gistId,	6✔
81	(gistId: string) => this.setState({ value: urlFromId(gistId) }),	×
82	);
83	window.ElectronFiddle.addEventListener('load-gist', loaders.gist);	6✔
84	window.ElectronFiddle.addEventListener('load-example', loaders.example);	6✔
85	}
86
87	public componentWillUnmount() {
88	window.ElectronFiddle.removeAllListeners('load-gist');	6✔
89	window.ElectronFiddle.removeAllListeners('load-example');	6✔
90	}
91
92	/**
93	* Handle the change event, which usually just updates the address bar's value
94	*
95	* @param {React.ChangeEvent<HTMLInputElement>} event
96	*/
97	private handleChange(event: React.ChangeEvent<HTMLInputElement>) {
98	this.setState({ value: event.target.value });	255✔
99	}
100
101	private handleBlur(event: React.FocusEvent<HTMLInputElement>) {
102	const { gistId } = this.props.appState;	1✔
103	const url = urlFromId(gistId);	1✔
104
105	const shouldResetURL =
106	url === event.target.value \|\| event.target.value === '';	1✔
107	if (url && shouldResetURL) {	1!
108	this.setState({ value: url });	×
109	}
110	}
111
112	private renderLoadButton(isValueCorrect: boolean): JSX.Element {
113	return (	264✔
114	<Button
115	disabled={!isValueCorrect}
116	icon="cloud-download"
117	text="Load Fiddle"
118	onClick={this.submit}
119	/>
120	);
121	}
122
123	public render() {
124	const { activeGistAction } = this.props.appState;	264✔
125	const { isEdited } = this.props.appState.editorMosaic;	264✔
126	const { value } = this.state;	264✔
127	const isCorrect = /https:\/\/gist\.github\.com\/(.+)$/.test(value);	264✔
128	const className = classnames('address-bar', isEdited, { empty: !value });	264✔
129
130	const isPerformingAction = activeGistAction !== GistActionState.none;	264✔
131	return (	264✔
132	<form
133	className={className}
134	aria-label={'Enter Fiddle Gist URL'}
135	onSubmit={this.handleSubmit}
136	>
137	<fieldset disabled={isPerformingAction}>
138	<InputGroup
139	key="addressbar"
140	leftIcon="geosearch"
141	intent={isCorrect \|\| !value ? undefined : Intent.DANGER}	637✔
142	onChange={this.handleChange}
143	onBlur={this.handleBlur}
144	placeholder="https://gist.github.com/..."
145	value={value}
146	rightElement={this.renderLoadButton(isCorrect)}
147	/>
148	</fieldset>
149	</form>
150	);
151	}
152	},
153	);

electron / fiddle / ca977947-d226-4d89-8edc-6f8573fedf8b

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