Created
June 7, 2017 18:20
-
-
Save thenormalsquid/b7c9b9a813885bb67739c7b9f01861c8 to your computer and use it in GitHub Desktop.
vscode react snippets
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
// Place your snippets for JavaScript here. Each snippet is defined under a snippet name and has a prefix, body and | |
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are: | |
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the | |
// same ids are connected. | |
// Example: | |
"Print to console": { | |
"prefix": "log", | |
"body": [ | |
"console.log('$1');", | |
"$2" | |
], | |
"description": "Log output to console" | |
}, | |
"Basic react hoc unittest": { | |
"prefix": "react-unit-comp", | |
"body": [ | |
"import { spy } from 'sinon';", | |
"import React form 'react';", | |
"import { shallow, mount } from 'enzyme';", | |
"import { BrowserRouter as router } from 'react-router-dom';", | |
"import ${1:name}, { ${1:name} as Component } from 'components/${1:name}';", | |
"", | |
"describe ('${1:name} component', () => {", | |
"\tlet wrapper, props, instance, enhancedWrapper;", | |
"", | |
"\tbeforeEach(() => {", | |
"\t\t$0", | |
"\t\tenhancedWrapper = mount(<${1:name} />);", | |
"\t\twrapper = shallow(<Component />);", | |
"\t\tinstance = wrapper.instance();", | |
"\t});", | |
"", | |
"\tit('', () => {", | |
"\t\t", | |
"\t});", | |
"});" | |
], | |
"description": "Unittest setup for React component HOCs with jest, mocha, enzyme, and sinon" | |
}, | |
"Basic react hoc component": { | |
"prefix": "react-hoc-comp", | |
"body": [ | |
"// @flow", | |
"import React from 'react';", | |
"import { compose, pure } from 'recompose';", | |
"", | |
"type WrappedProps = {", | |
"", | |
"};", | |
"", | |
"type Props = {", | |
"", | |
"} & WrappedProps;", | |
"", | |
"export const ${1:name} = (props: Props) =>", | |
"\t<div>Hi there $0</div>;", | |
"", | |
"const enhance = compose(", | |
"\tpure", | |
");", | |
"export default enhance(${1:name});" | |
], | |
"description": "Basic react HOC component with recompose and flow types" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment