react-display-name-visitors.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. /**
  2. * Copyright 2013-present, Facebook, Inc.
  3. * All rights reserved.
  4. *
  5. * This source code is licensed under the BSD-style license found in the
  6. * LICENSE file in the root directory of this source tree. An additional grant
  7. * of patent rights can be found in the PATENTS file in the same directory.
  8. */
  9. /*global exports:true*/
  10. 'use strict';
  11. var Syntax = require('esprima-fb').Syntax;
  12. var utils = require('../src/utils');
  13. function shouldAddDisplayName(object) {
  14. if (object &&
  15. object.type === Syntax.CallExpression &&
  16. object.callee.type === Syntax.MemberExpression &&
  17. object.callee.object.type === Syntax.Identifier &&
  18. object.callee.object.name === 'React' &&
  19. object.callee.property.type === Syntax.Identifier &&
  20. object.callee.property.name === 'createClass' &&
  21. object.arguments.length === 1 &&
  22. object.arguments[0].type === Syntax.ObjectExpression) {
  23. // Verify that the displayName property isn't already set
  24. var properties = object.arguments[0].properties;
  25. var safe = properties.every(function(property) {
  26. var value = property.key.type === Syntax.Identifier ?
  27. property.key.name :
  28. property.key.value;
  29. return value !== 'displayName';
  30. });
  31. return safe;
  32. }
  33. return false;
  34. }
  35. /**
  36. * If `expr` is an Identifier or MemberExpression node made of identifiers and
  37. * dot accesses, return a list of the identifier parts. Other nodes return null.
  38. *
  39. * Examples:
  40. *
  41. * MyComponent -> ['MyComponent']
  42. * namespace.MyComponent -> ['namespace', 'MyComponent']
  43. * namespace['foo'] -> null
  44. * namespace['foo'].bar -> ['bar']
  45. */
  46. function flattenIdentifierOrMemberExpression(expr) {
  47. if (expr.type === Syntax.Identifier) {
  48. return [expr.name];
  49. } else if (expr.type === Syntax.MemberExpression) {
  50. if (!expr.computed && expr.property.type === Syntax.Identifier) {
  51. var flattenedObject = flattenIdentifierOrMemberExpression(expr.object);
  52. if (flattenedObject) {
  53. flattenedObject.push(expr.property.name);
  54. return flattenedObject;
  55. } else {
  56. return [expr.property.name];
  57. }
  58. }
  59. }
  60. return null;
  61. }
  62. /**
  63. * Transforms the following:
  64. *
  65. * var MyComponent = React.createClass({
  66. * render: ...
  67. * });
  68. *
  69. * into:
  70. *
  71. * var MyComponent = React.createClass({
  72. * displayName: 'MyComponent',
  73. * render: ...
  74. * });
  75. *
  76. * Also catches:
  77. *
  78. * MyComponent = React.createClass(...);
  79. * namespace.MyComponent = React.createClass(...);
  80. * exports.MyComponent = React.createClass(...);
  81. * module.exports = {MyComponent: React.createClass(...)};
  82. */
  83. function visitReactDisplayName(traverse, object, path, state) {
  84. var left, right;
  85. if (object.type === Syntax.AssignmentExpression) {
  86. left = object.left;
  87. right = object.right;
  88. } else if (object.type === Syntax.Property) {
  89. left = object.key;
  90. right = object.value;
  91. } else if (object.type === Syntax.VariableDeclarator) {
  92. left = object.id;
  93. right = object.init;
  94. }
  95. if (right && shouldAddDisplayName(right)) {
  96. var displayNamePath = flattenIdentifierOrMemberExpression(left);
  97. if (displayNamePath) {
  98. if (displayNamePath.length > 1 && displayNamePath[0] === 'exports') {
  99. displayNamePath.shift();
  100. }
  101. var displayName = displayNamePath.join('.');
  102. utils.catchup(right.arguments[0].range[0] + 1, state);
  103. utils.append('displayName: "' + displayName + '",', state);
  104. }
  105. }
  106. }
  107. visitReactDisplayName.test = function(object, path, state) {
  108. return (
  109. object.type === Syntax.AssignmentExpression ||
  110. object.type === Syntax.Property ||
  111. object.type === Syntax.VariableDeclarator
  112. );
  113. };
  114. exports.visitorList = [
  115. visitReactDisplayName
  116. ];