From 86d61bb6973f3ea299b44f4c6119203732abe62a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rog=C3=A9rio=20Chaves?= Date: Thu, 24 Dec 2015 18:28:34 -0200 Subject: [PATCH 1/3] Add function to remove default props --- dist/decompiler.js | 9 ++++++++- src/decompiler.js | 7 +++++-- src/remove-default-props.js | 20 +++++++++++++++++++ test/decompiler_spec.js | 38 ++++++++++++++++++++++++++++++++++++- 4 files changed, 70 insertions(+), 4 deletions(-) create mode 100644 src/remove-default-props.js diff --git a/dist/decompiler.js b/dist/decompiler.js index 50b490b..f686214 100644 --- a/dist/decompiler.js +++ b/dist/decompiler.js @@ -20,6 +20,10 @@ var _objectAssign = require('object-assign'); var _objectAssign2 = _interopRequireDefault(_objectAssign); +var _removeDefaultProps = require('./remove-default-props'); + +var _removeDefaultProps2 = _interopRequireDefault(_removeDefaultProps); + var getProps = function getProps(component) { return (0, _objectAssign2['default'])((0, _objectAssign2['default'])(getAttribute('key', component), getAttribute('ref', component)), component.props); }; @@ -109,6 +113,9 @@ var decompile = stringifyItems; exports.decompile = decompile; var formatted = function formatted(items) { - return (0, _jsBeautify.html)(stringifyItems(items), { indent_size: 2 }); + return (0, _jsBeautify.html)(decompile(items), { indent_size: 2 }); }; + exports.formatted = formatted; +var withoutDefaultProps = _removeDefaultProps2['default']; +exports.withoutDefaultProps = withoutDefaultProps; diff --git a/src/decompiler.js b/src/decompiler.js index 471a670..377b300 100644 --- a/src/decompiler.js +++ b/src/decompiler.js @@ -2,6 +2,7 @@ import {isElement as isReact} from 'react-addons-test-utils'; import {html as htmlBeautify} from 'js-beautify'; import stringifyObject from './stringify-object'; import merge from 'object-assign'; +import removeDefaultProps from './remove-default-props'; const getProps = component => merge( @@ -51,7 +52,7 @@ const stringifyComponent = component => getChildren(component) ? stringifyComposedComponent(component) : stringifySimpleComponent(component); const stringifyFunction = value => - value.toString().replace(/ {[\s\S]*/, '{ ... }') + value.toString().replace(/ {[\s\S]*/, '{ ... }'); const stringifyValue = value => { switch (typeof value) { @@ -70,4 +71,6 @@ const stringifyItems = components => export const decompile = stringifyItems; -export const formatted = (items) => htmlBeautify(stringifyItems(items), { indent_size: 2 }); +export const formatted = (items) => htmlBeautify(decompile(items), { indent_size: 2 }); + +export const withoutDefaultProps = removeDefaultProps; diff --git a/src/remove-default-props.js b/src/remove-default-props.js new file mode 100644 index 0000000..0fc29f5 --- /dev/null +++ b/src/remove-default-props.js @@ -0,0 +1,20 @@ +import {isElement as isReact} from 'react-addons-test-utils'; + +export default (components) => + [].concat(components).map(removeDefaultPropsIfReact) + +const removeDefaultPropsIfReact = (item) => + isReact(item) ? removeComponentDefaultProps(item) : item; + +const removeComponentDefaultProps = (component) => + ({...component, props: filterDefaultProps(component)}); + +const filterDefaultProps = (component) => + Object.keys(component.props).reduce(addPropIfNotDefault(component), {}); + +const addPropIfNotDefault = (component) => (accumulated, prop) => + isDefaultProp(component, prop) ? accumulated : + {...accumulated, [prop]: removeDefaultPropsIfReact(component.props[prop])}; + +const isDefaultProp = (component, prop) => + component.type.defaultProps && component.props[prop] === component.type.defaultProps[prop]; diff --git a/test/decompiler_spec.js b/test/decompiler_spec.js index 0bac6ba..a50346e 100644 --- a/test/decompiler_spec.js +++ b/test/decompiler_spec.js @@ -1,6 +1,6 @@ import React from 'react'; import ReactTestUtils from 'react-addons-test-utils'; -import {decompile, formatted} from 'decompiler'; +import {decompile, formatted, withoutDefaultProps} from 'decompiler'; describe('decompiler', () => { @@ -241,4 +241,40 @@ describe('decompiler', () => { expect(decompile(component)).toBe(`
,
]} />`); }); + + it('stringify should strip out props that have default values', () => { + let Bar = React.createClass({ + propTypes: { + baz: React.PropTypes.number + }, + + getDefaultProps () { + return { baz: 456 }; + }, + + render () { + return Bar; + } + }); + + let Baz = React.createClass({ + propTypes: { + name: React.PropTypes.string, + greeting: React.PropTypes.string + }, + + getDefaultProps () { + return { baz: 456, greeting: "hello" }; + }, + + render () { + return {this.props.name}; + } + }); + + expect(decompile(withoutDefaultProps())).toBe(''); + expect(decompile(withoutDefaultProps())).toBe(''); + expect(decompile(withoutDefaultProps())).toBe(''); + expect(decompile(withoutDefaultProps(} />))).toBe('} />'); + }); }); From 3dd64779725bfb1390e4405cc82328d903dd9280 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rog=C3=A9rio=20Chaves?= Date: Thu, 24 Dec 2015 18:33:14 -0200 Subject: [PATCH 2/3] Add feature to readme --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 500a404..a02482a 100644 --- a/README.md +++ b/README.md @@ -35,4 +35,6 @@ formatted(component); //
" ``` +To minimize output, you can ignore the default props like this `decompile(withoutDefaultProps());` + See more examples on the [test file](https://github.com/rogeriochaves/react-decompiler/blob/master/test/decompiler_spec.js) From 363ec05451589e98add857e09a9a8e068117569a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rog=C3=A9rio=20Chaves?= Date: Thu, 24 Dec 2015 18:58:56 -0200 Subject: [PATCH 3/3] Compile all files from src folder --- dist/decompiler.js | 2 +- dist/remove-default-props.js | 38 ++++++++++++++++++++++++++++++++++++ dist/stringify-object.js | 2 +- package.json | 2 +- 4 files changed, 41 insertions(+), 3 deletions(-) create mode 100644 dist/remove-default-props.js diff --git a/dist/decompiler.js b/dist/decompiler.js index f686214..220eef7 100644 --- a/dist/decompiler.js +++ b/dist/decompiler.js @@ -118,4 +118,4 @@ var formatted = function formatted(items) { exports.formatted = formatted; var withoutDefaultProps = _removeDefaultProps2['default']; -exports.withoutDefaultProps = withoutDefaultProps; +exports.withoutDefaultProps = withoutDefaultProps; \ No newline at end of file diff --git a/dist/remove-default-props.js b/dist/remove-default-props.js new file mode 100644 index 0000000..65f8d3f --- /dev/null +++ b/dist/remove-default-props.js @@ -0,0 +1,38 @@ +'use strict'; + +Object.defineProperty(exports, '__esModule', { + value: true +}); + +var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; + +function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } + +var _reactAddonsTestUtils = require('react-addons-test-utils'); + +exports['default'] = function (components) { + return [].concat(components).map(removeDefaultPropsIfReact); +}; + +var removeDefaultPropsIfReact = function removeDefaultPropsIfReact(item) { + return (0, _reactAddonsTestUtils.isElement)(item) ? removeComponentDefaultProps(item) : item; +}; + +var removeComponentDefaultProps = function removeComponentDefaultProps(component) { + return _extends({}, component, { props: filterDefaultProps(component) }); +}; + +var filterDefaultProps = function filterDefaultProps(component) { + return Object.keys(component.props).reduce(addPropIfNotDefault(component), {}); +}; + +var addPropIfNotDefault = function addPropIfNotDefault(component) { + return function (accumulated, prop) { + return isDefaultProp(component, prop) ? accumulated : _extends({}, accumulated, _defineProperty({}, prop, removeDefaultPropsIfReact(component.props[prop]))); + }; +}; + +var isDefaultProp = function isDefaultProp(component, prop) { + return component.type.defaultProps && component.props[prop] === component.type.defaultProps[prop]; +}; +module.exports = exports['default']; \ No newline at end of file diff --git a/dist/stringify-object.js b/dist/stringify-object.js index 67f26e3..9dd8a50 100644 --- a/dist/stringify-object.js +++ b/dist/stringify-object.js @@ -79,4 +79,4 @@ module.exports = function (val, opts, pad) { return '\'' + val.replace(/'/g, '\\\'') + '\''; })(val, opts, pad); -}; +}; \ No newline at end of file diff --git a/package.json b/package.json index 17bf851..94bc69a 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "main": "index.js", "scripts": { "test": "node_modules/karma/bin/karma start karma.conf.js", - "prepublish": "mkdir dist; node_modules/babel/bin/babel.js src/decompiler.js --out-file dist/decompiler.js; node_modules/babel/bin/babel.js src/stringify-object.js --out-file dist/stringify-object.js" + "prepublish": "mkdir dist; node_modules/babel/bin/babel.js src --out-dir dist" }, "author": { "name": "Rogério Chaves",