diff --git a/lib/rules/sort-prop-types.js b/lib/rules/sort-prop-types.js index da94a641db..823345da1f 100644 --- a/lib/rules/sort-prop-types.js +++ b/lib/rules/sort-prop-types.js @@ -261,7 +261,15 @@ module.exports = { if (!sortShapeProp || !isShapeProp(node) || !(node.arguments && node.arguments[0])) { return; } - checkSorted(node.arguments[0].properties); + + if (node.arguments[0].properties) { + checkSorted(node.arguments[0].properties); + } else if (node.arguments[0].type === 'Identifier') { + const variable = variableUtil.findVariableByName(context, node.arguments[0].name); + if (variable && variable.properties) { + checkSorted(variable.properties); + } + } }, ClassProperty: function(node) { diff --git a/tests/lib/rules/sort-prop-types.js b/tests/lib/rules/sort-prop-types.js index e83ccacd34..8714ec4023 100644 --- a/tests/lib/rules/sort-prop-types.js +++ b/tests/lib/rules/sort-prop-types.js @@ -412,6 +412,45 @@ ruleTester.run('sort-prop-types', rule, { options: [{ noSortAlphabetically: true }] + }, { + code: ` + const shape = { + a: PropTypes.any, + b: PropTypes.bool, + c: PropTypes.any, + }; + class Component extends React.Component { + static propTypes = { + x: PropTypes.shape(shape), + }; + render() { + return
; + } + } + `, + options: [{ + sortShapeProp: true + }], + parser: 'babel-eslint' + }, { + code: ` + const shape = { + a: PropTypes.any, + b: PropTypes.bool, + c: PropTypes.any, + }; + class Component extends React.Component { + render() { + return
; + } + } + Component.propTypes = { + x: PropTypes.shape(shape) + }; + `, + options: [{ + sortShapeProp: true + }] }], invalid: [{ @@ -1533,5 +1572,98 @@ ruleTester.run('sort-prop-types', rule, { ' }', '});' ].join('\n') + }, { + code: ` + const shape = { + c: PropTypes.any, + a: PropTypes.any, + b: PropTypes.bool, + }; + class Component extends React.Component { + static propTypes = { + x: PropTypes.shape(shape), + }; + + render() { + return
; + } + } + `, + options: [{ + sortShapeProp: true + }], + parser: 'babel-eslint', + errors: [{ + message: ERROR_MESSAGE, + line: 4, + column: 9, + type: 'Property' + }, { + message: ERROR_MESSAGE, + line: 5, + column: 9, + type: 'Property' + }], + output: ` + const shape = { + a: PropTypes.any, + b: PropTypes.bool, + c: PropTypes.any, + }; + class Component extends React.Component { + static propTypes = { + x: PropTypes.shape(shape), + }; + + render() { + return
; + } + } + ` + }, { + code: ` + const shape = { + c: PropTypes.any, + a: PropTypes.any, + b: PropTypes.bool, + }; + class Component extends React.Component { + render() { + return
; + } + } + Component.propTypes = { + x: PropTypes.shape(shape) + }; + `, + options: [{ + sortShapeProp: true + }], + errors: [{ + message: ERROR_MESSAGE, + line: 4, + column: 9, + type: 'Property' + }, { + message: ERROR_MESSAGE, + line: 5, + column: 9, + type: 'Property' + }], + output: ` + const shape = { + a: PropTypes.any, + b: PropTypes.bool, + c: PropTypes.any, + }; + class Component extends React.Component { + render() { + return
; + } + } + Component.propTypes = { + x: PropTypes.shape(shape) + }; + ` }] });