Skip to content

Instantly share code, notes, and snippets.

@kentcdodds
Created August 3, 2015 13:32
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kentcdodds/f29f6b74055561aa9b76 to your computer and use it in GitHub Desktop.
Save kentcdodds/f29f6b74055561aa9b76 to your computer and use it in GitHub Desktop.
Some of my WebStorm live templates
<templateSet group="azAngular">
<template name="prov" value="export default ngModule =&gt; {&#10; ngModule.provider('$NAME$', $NAME$);&#10; &#10; $NAME$.filename = __filename;&#10; &#10; /* istanbul ignore next */&#10; if (process.env.NODE_ENV === 'test') {&#10; $NAME$.test = require('./$NAME$.test')(ngModule);&#10; }&#10;&#10; function $NAME$() {&#10; angular.extend(this, {&#10; $get: function $NAME$Get() {&#10; return this;&#10; }&#10; });&#10; &#10; $END$&#10; }&#10;};&#10;" description=".provider(" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="model" value="export default ngModule =&gt;&#10; ngModule.factory('$NAME$', $NAME$).run(initialize);&#10;&#10; function $NAME$(modelHelper) {&#10;&#10; var urlTemplatePrefix = '$PARENT$/:$PARENT$Id/$LOWER$/';&#10;&#10; return modelHelper.defineResource({&#10; name: '$NAME$',&#10; endpoint: '$LOWER$',&#10; relations: {&#10; belongsTo: {&#10; $PARENT$: {&#10; parent: true,&#10; localKey: '$PARENT$Id',&#10; localField: '$PARENT$'&#10; }&#10; }&#10; },&#10; meta: {&#10; instanceUrlTemplate: urlTemplatePrefix + ':$LOWER$Id/',&#10; instanceEndpoints: {&#10; GET: []&#10; },&#10; classUrlTemplate: urlTemplatePrefix,&#10; classEndpoints: {&#10; GET: [],&#10; POST: []&#10; }&#10; }&#10; });&#10; }&#10;&#10; &#10; function initialize($NAME$) {}&#10; &#10;};&#10;" description="DS Model" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="PARENT" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="LOWER" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="mod" value="angular.module('$NAME$')$END$" description="angular.module" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="filt" value="export default ngModule =&gt;&#10; ngModule.filter('$NAME$', $NAME$Function);&#10; &#10; $NAME$Function.filename = __filename;&#10; &#10; /* istanbul ignore next */&#10; if (process.env.NODE_ENV === 'test') {&#10; $NAME$Function.test = require('./$NAME$.test')(ngModule);&#10; }&#10;&#10; function $NAME$Function() {&#10; return function $NAME$(input$ARGUMENTS$) {&#10; $END$&#10; };&#10; }&#10;};&#10;" description="Angular Filter" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="ARGUMENTS" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="fact" value="export default ngModule =&gt; {&#10; ngModule.factory('$NAME$', $NAME$);&#10;&#10; $NAME$.filename = __filename;&#10;&#10; /* istanbul ignore next */&#10; if (process.env.NODE_ENV === 'test') {&#10; $NAME$.test = require('./$NAME$.test')(ngModule);&#10; }&#10;&#10; function $NAME$() {&#10; return {&#10; };&#10; &#10; $END$&#10; }&#10;};&#10;" description="Angular Factory" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="dir" value="export default ngModule =&gt; {&#10; ngModule.directive('$DIR$', $DIR$);&#10;&#10; $DIR$.filename = __filename;&#10;&#10; /* istanbul ignore next */&#10; if (process.env.NODE_ENV === 'test') {&#10; $DIR$.test = require('./$KEBAB_NAME$.test')(ngModule);&#10; }&#10; &#10; function $DIR$(azDirective) {&#10; return azDirective({&#10; restrict: 'E',&#10; template: require('./$KEBAB_NAME$.html'),&#10; scope: {},&#10; scopeTypes,&#10; controllerAs: 'vm',&#10; bindToController: true,&#10; controller: $CTRL$&#10; });&#10; &#10; // @ngInject&#10; function $CTRL$() {&#10; const vm = this;&#10; &#10; $END$&#10; }&#10; &#10; /* istanbul ignore next */&#10; function scopeTypes(check) {&#10; return {};&#10; }&#10; }&#10;};&#10;" description="Angular directive" toReformat="true" toShortenFQNames="true">
<variable name="DIR" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="KEBAB_NAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="CTRL" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ctrl" value="export default $CTRL$;&#10;&#10;// @ngInject&#10;function $CTRL$() {&#10; var vm = this;&#10; $END$&#10;};&#10;" description="Angular controller" toReformat="true" toShortenFQNames="true">
<variable name="CTRL" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name=".prov" value=".provider('$PROV$', function $PROV$() {&#10; 'use strict';&#10; angular.extend(this, {&#10; $get: function $PROV$Get() {&#10; return this;&#10; }&#10; });&#10;&#10; $END$&#10;});&#10;" description=".provider(" toReformat="true" toShortenFQNames="true">
<variable name="PROV" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name=".filt" value=".filter('$FILTER$', function $FILTER$Function() {&#10; 'use strict';&#10; return function $FILTER$(input$ARGUMENTS$) {&#10; $END$&#10; };&#10;});" description=".filter(" toReformat="false" toShortenFQNames="true">
<variable name="FILTER" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="ARGUMENTS" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name=".fact" value=".factory('$NAME$', function $NAME$() {&#10; 'use strict';&#10; return {&#10; };&#10; &#10; $END$&#10;});" description=".factory" toReformat="false" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name=".dir" value=".directive('$DIR$', function $DIR$Directive($DEPS$) {&#10; 'use strict';&#10; &#10; return {&#10; restrict: 'E',&#10; controllerAs: 'vm',&#10; bindToController: true,&#10; controller: function() {&#10; var vm = this;&#10; &#10; $END$;&#10; }&#10; };&#10;});" description=".directive(" toReformat="false" toShortenFQNames="true">
<variable name="DIR" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="DEPS" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name=".ctrl" value=".controller('$CTRL$', function $CTRL$() {&#10; 'use strict';&#10; var vm = this;&#10; $END$&#10;});" description=".controller(" toReformat="false" toShortenFQNames="true">
<variable name="CTRL" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ngState" value="export default require('registerState')(__filename, require('ngCommon'), {&#10; template: require('./index.html'),&#10; controller: require('./controller'),&#10; data: {&#10; // styles: require('./index.styl'),&#10; // activationEvents: [],&#10; /* istanbul ignore next */&#10; test: process.env.NODE_ENV === 'test' ? require('./index.test')(ngModule) : null&#10; }&#10;});" description="Create new state" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="tdir" value="import _ from 'lodash';&#10;export default ngModule =&gt; {&#10; describe('$NAME$', () =&gt; {&#10; beforeEach(window.module(ngModule.name));&#10;&#10; let $compile, scope, el, node, isolateScope, vm;&#10; let basicTemplate = `&lt;$NAME$&gt;&lt;/$NAME$&gt;`;&#10;&#10; beforeEach(inject((_$compile_, $rootScope) =&gt; {&#10; $compile = _$compile_;&#10; scope = $rootScope.$new();&#10; }));&#10;&#10; it(`should compile`, () =&gt; {&#10; compileAndDigest();&#10; expect(node.className).to.contain('ng-scope');&#10; expect(node.querySelector('.$NAME$')).to.exist;&#10; expect(vm).to.exist;&#10; });&#10;&#10; function compileAndDigest(template = basicTemplate, extraProps = {}) {&#10; _.assign(scope, extraProps);&#10; el = $compile(template)(scope);&#10; node = el[0];&#10; scope.$digest();&#10; isolateScope = el.isolateScope();&#10; vm = isolateScope.vm;&#10; }&#10; });&#10;};&#10;" description="Test Directive" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="tfact" value="export default ngModule =&gt; {&#10; describe.only('$NAME$', () =&gt; {&#10; beforeEach(window.module(ngModule.name));&#10;&#10; let $NAME$;&#10; &#10; beforeEach(inject((_$NAME$_) =&gt; {&#10; $NAME$ = _$NAME$_;&#10; }));&#10; &#10; it(`should fail`, () =&gt; {&#10; expect('ᕕ( ᐛ )ᕗ').to.eq('ಠ_ಠ');$END$&#10; });&#10; });&#10;};&#10;" description="Test Factory" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="tngState" value="import _ from 'lodash';&#10;export default (state, ngModule) =&gt; {&#10; describe.only(`state__${__filename}`, () =&gt; {&#10; beforeEach(window.module(ngModule.name));&#10;&#10; let vm;&#10;&#10; beforeEach(inject(($controller, $translate) =&gt; {&#10; const vm = $controller(state.controller, {&#10; // mock injectables&#10; });&#10; }));&#10;&#10; describe(`$FN_NAME$`, () =&gt; {&#10; it(`should fail`, () =&gt; {&#10; expect('ᕕ( ᐛ )ᕗ').to.eq('ಠ_ಠ');$END$&#10; });&#10; });&#10;&#10; });&#10;};&#10;" description="Test state" toReformat="true" toShortenFQNames="true">
<variable name="FN_NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="tfilt" value="export default ngModule =&gt; {&#10; describe.only('$NAME$', () =&gt; {&#10; beforeEach(window.module(ngModule.name));&#10;&#10; let $NAME$;&#10;&#10; beforeEach(inject(($filter) =&gt; {&#10; $NAME$ = $filter('$NAME$');&#10; }));&#10;&#10; it(`should fail`, () =&gt; {&#10; expect('|-o-| (-o-) |-o-|').to.eq('(-o-) |-o-| (-o-)');$END$&#10; });&#10; });&#10;};&#10;" description="Test Filter" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="bef" value="beforeEach(() =&gt; {&#10; $END$&#10;});" description="beforeEach" toReformat="false" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="aft" value="afterEach(() =&gt; {&#10; $END$&#10;});" description="afterEach" toReformat="false" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="desc" value="describe(`$DESC$`, () =&gt; {&#10; $END$&#10;});" description="describe" toReformat="false" toShortenFQNames="true">
<variable name="DESC" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="ibef" value="beforeEach(inject(() =&gt; {&#10; $END$&#10;}));" description="beforeEach with inject" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="iit" value="it(`should $SHOULD$`, inject(() =&gt; {&#10; $END$&#10;}));" description="it with inject" toReformat="true" toShortenFQNames="true">
<variable name="SHOULD" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="it" value="it(`should $SHOULD$`, () =&gt; {&#10; $END$&#10;});" description="it('should something')" toReformat="true" toShortenFQNames="true">
<variable name="SHOULD" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="mock" value="export default ngModule =&gt; {&#10; ngModule.factory('mock$NAME$', mock$NAME$);&#10;&#10; function mock$NAME$(_, faker, azRandom) {&#10; return mock;&#10;&#10; function mock(overrides) {&#10; return _.merge({$END$}, overrides);&#10; }&#10; }&#10;};&#10;" description="Mock stuff" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="$httpBack" value="let $httpBackend;&#10;&#10;beforeEach(inject((_$httpBackend_) =&gt; {&#10; $httpBackend = _$httpBackend_;&#10;}));&#10;&#10;$END$&#10;&#10;afterEach('verify $httpBackend is clean', function() {&#10; $httpBackend.verifyNoOutstandingExpectation();&#10; $httpBackend.verifyNoOutstandingRequest();&#10;});" description="$httpBackend test things" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="ngi" value="// @ngInject" description="ngInject comment" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="creq" value="require('ngCommon/$END$')" description="requireCommon" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JSX_HTML" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
</templateSet>
<templateSet group="JavaScript">
<template name="us" value="'use strict';&#10;$END$" description="Inserts 'use strict' statement" toReformat="true" toShortenFQNames="true">
<context />
</template>
<template name="f" value="function $NAME$($PARAM$) {&#10; $END$&#10;}" description="Inserts function expression" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="PARAM" expression="" defaultValue="&quot;&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="if" value="if ($EXPRESSION$) {&#10; $END$&#10;}" description="If Statement" toReformat="true" toShortenFQNames="true">
<variable name="EXPRESSION" expression="" defaultValue="true" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ife" value="if ($EXPRESSION$) {&#10; $IF$&#10;} else {&#10; $END$&#10;}" description="if else" toReformat="false" toShortenFQNames="true">
<variable name="EXPRESSION" expression="" defaultValue="true" alwaysStopAt="true" />
<variable name="IF" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="sw" value="switch($EXPRESSION$) {&#10; case $CASE$:&#10; $ACTION$&#10; break;&#10; default:&#10; $END$&#10;}" description="switch statement" toReformat="false" toShortenFQNames="true">
<variable name="EXPRESSION" expression="" defaultValue="1" alwaysStopAt="true" />
<variable name="CASE" expression="" defaultValue="1" alwaysStopAt="true" />
<variable name="ACTION" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="cl" value="console.log($END$);" description="console.log" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="req" value="var $X$ = require('$NAME$');" description="var x = require('x');" toReformat="false" toShortenFQNames="true">
<variable name="X" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="iif" value="(function() {&#10; 'use strict';&#10; $END$&#10;})();" description="(function() {})();" toReformat="false" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="kv" value="$KEY$: $KEY$" description="key: value" toReformat="false" toShortenFQNames="true">
<variable name="KEY" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name=".then" value=".then(function success(response) {&#10; $END$ = response.data;&#10;}$ERROR$);" description=".then on a promise" toReformat="false" toShortenFQNames="true">
<variable name="ERROR" expression="" defaultValue=", function error(response) {})" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="vl" value="console.log('$VAR$', $VAR$);" description="variable log" toReformat="false" toShortenFQNames="true">
<variable name="VAR" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
<option name="TypeScript" value="false" />
</context>
</template>
<template name="jsh" value="/* jshint $END$ */" description="jshint comment" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
<template name="esl" value="/* eslint $END$ */" description="eslint comment" toReformat="false" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
<option name="JS_EXPRESSION" value="true" />
<option name="JS_STATEMENT" value="true" />
</context>
</template>
</templateSet>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment