Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix Babel 6 #2

Merged
merged 6 commits into from
Nov 12, 2015
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 3 additions & 0 deletions .babelrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"presets": ["es2015"]
}
8 changes: 5 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,16 @@
},
"homepage": "https://github.com/gaearon/babel-plugin-react-transform#readme",
"devDependencies": {
"babel": "^5.8.23",
"babel-cli": "^6.1.1",
"babel-core": "^6.0.0",
"babel-preset-es2015": "^6.0.15",
"mocha": "^2.2.5",
"rimraf": "^2.4.3"
},
"scripts": {
"clean": "rimraf lib",
"build": "babel-plugin build",
"test": "mocha --compilers js:babel/register",
"build": "babel src --out-dir lib --copy-files",
"test": "mocha --compilers js:babel-core/register",
"test:watch": "npm run test -- --watch",
"prepublish": "npm run clean && npm run build"
},
Expand Down
52 changes: 29 additions & 23 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ export default function ({ types: t }) {
* Creates a record about us having visited a valid React component.
* Such records will later be merged into a single object.
*/
function createComponentRecord(node, scope, file, state) {
function createComponentRecord(node, scope, state) {
const displayName = findDisplayName(node) || undefined;
const uniqueId = scope.generateUidIdentifier(
'$' + (displayName || 'Unknown')
Expand All @@ -114,8 +114,8 @@ export default function ({ types: t }) {
* Memorizes the fact that we have visited a valid component in the plugin state.
* We will later retrieve memorized records to compose an object out of them.
*/
function addComponentRecord(node, scope, file, state) {
const [uniqueId, definition] = createComponentRecord(node, scope, file, state);
function addComponentRecord(node, scope, state) {
const [uniqueId, definition] = createComponentRecord(node, scope, state);
state[recordsKey] = state[recordsKey] || [];
state[recordsKey].push(t.objectProperty(
t.identifier(uniqueId),
Expand Down Expand Up @@ -149,21 +149,21 @@ export default function ({ types: t }) {
* Imports and calls a particular transformation target function.
* You may specify several such transformations, so they are handled separately.
*/
function defineInitTransformCall(scope, { file }, recordsId, targetOptions) {
function defineInitTransformCall(scope, file, recordsId, targetOptions) {
const id = scope.generateUidIdentifier('reactComponentWrapper');
const { transform, imports = [], locals = [] } = targetOptions;
const { filename } = file.opts;
return [id, t.variableDeclaration('var', [
t.variableDeclarator(id,
t.callExpression(file.addImport(transform), [
t.callExpression(file.addImport(transform, 'default'), [
t.objectExpression([
t.objectProperty(t.identifier('filename'), t.stringLiteral(filename)),
t.objectProperty(t.identifier('components'), recordsId),
t.objectProperty(t.identifier('locals'), t.arrayExpression(
locals.map(local => t.identifier(local))
)),
t.objectProperty(t.identifier('imports'), t.arrayExpression(
imports.map(imp => file.addImport(imp, null, 'absolute'))
imports.map(imp => file.addImport(imp, 'default', 'absolute'))
))
])
])
Expand Down Expand Up @@ -194,52 +194,57 @@ export default function ({ types: t }) {

return {
visitor: {
Function: {
enter({ node, parent, scope }, file) {
'FunctionDeclaration|FunctionExpression': {
enter({ node, parent, scope }) {
if (!this.state[depthKey]) {
this.state[depthKey] = 0;
}
this.state[depthKey]++;
},
exit({ node, parent, scope }, file) {
exit({ node, parent, scope }) {
this.state[depthKey]--;
}
},

Class({ node, scope }, file) {
ClassExpression(path) {
const {node, scope} = path;
if (!isComponentishClass(node)) {
return;
}

const wrapReactComponentId = this.state[wrapComponentIdKey];
const uniqueId = addComponentRecord(node, scope, file, this.state);
const uniqueId = addComponentRecord(node, scope, this.state);

node.decorators = node.decorators || [];
node.decorators.push(t.decorator(
t.callExpression(wrapReactComponentId, [t.stringLiteral(uniqueId)])
t.callExpression(wrapReactComponentId, [t.identifier(uniqueId)])
));
},

CallExpression: {
exit({ node, scope }, file) {
exit(path) {
const { node, scope } = path;
const { isCreateClassCallExpression } = this.state[cacheKey];
if (!isCreateClass(node, isCreateClassCallExpression)) {
if (!isCreateClass(node, isCreateClassCallExpression) || node._reactTransformWrapped) {
return;
}

const wrapReactComponentId = this.state[wrapComponentIdKey];
const uniqueId = addComponentRecord(node, scope, file, this.state);
const uniqueId = addComponentRecord(node, scope, this.state);
node._reactTransformWrapped = true;

return t.callExpression(
t.callExpression(wrapReactComponentId, [t.stringLiteral(uniqueId)]),
[node]
path.replaceWith(
t.callExpression(
t.callExpression(wrapReactComponentId, [t.stringLiteral(uniqueId)]),
[node]
)
);
}
},

Program: {
enter({ scope }, file) {
const { opts } = file;
enter({ scope }, state) {
const { opts } = state;
if (!isValidOptions(opts)) {
throw new Error(
'babel-plugin-react-transform requires that you specify options in .babelrc ' +
Expand All @@ -258,7 +263,8 @@ export default function ({ types: t }) {
this.state[wrapComponentIdKey] = scope.generateUidIdentifier('wrapComponent');
},

exit({ node, scope }, file) {
exit(path) {
const { node, scope, hub: {file} } = path;
if (!foundComponentRecords(this.state)) {
return;
}
Expand All @@ -278,12 +284,12 @@ export default function ({ types: t }) {
// Create one uber function calling each transformation
const wrapComponentId = this.state[wrapComponentIdKey];
const wrapComponent = defineWrapComponent(wrapComponentId, initTransformIds);
return t.program([
path.replaceWith(t.program([
recordsVar,
...initTransformVars,
wrapComponent,
...node.body
]);
]));
}
}
}
Expand Down
10 changes: 5 additions & 5 deletions test/fixtures/classic/.babelrc
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
{
"plugins": ["../../../src"],
"extra": {
"react-transform": {
"presets": ["es2015"],
"plugins": [
["../../../src", {
"transforms": [{
"transform": "my-custom-module/wrap",
"locals": ["module"],
"imports": ["react"]
}, {
"transform": "my-other-custom-module/wrap"
}]
}
}
}]
]
}
34 changes: 19 additions & 15 deletions test/fixtures/classic/expected.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,23 @@
'use strict';

var _myCustomModuleWrap2 = require('my-custom-module/wrap');
Object.defineProperty(exports, "__esModule", {
value: true
});

var _wrap = require('my-other-custom-module/wrap');

var _myCustomModuleWrap3 = _interopRequireDefault(_myCustomModuleWrap2);
var _wrap2 = _interopRequireDefault(_wrap);

var _react = require('react');

var _myOtherCustomModuleWrap2 = require('my-other-custom-module/wrap');
var _react2 = _interopRequireDefault(_react);

var _myOtherCustomModuleWrap3 = _interopRequireDefault(_myOtherCustomModuleWrap2);
var _wrap3 = require('my-custom-module/wrap');

var _wrap4 = _interopRequireDefault(_wrap3);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

Object.defineProperty(exports, '__esModule', {
value: true
});
var _components = {
_$A: {
displayName: 'A'
Expand Down Expand Up @@ -59,14 +64,14 @@ var _components = {
}
};

var _reactComponentWrapper = (0, _myCustomModuleWrap3['default'])({
var _reactComponentWrapper = (0, _wrap4.default)({
filename: '%FIXTURE_PATH%',
components: _components,
locals: [module],
imports: [_react]
imports: [_react2.default]
});

var _reactComponentWrapper2 = (0, _myOtherCustomModuleWrap3['default'])({
var _reactComponentWrapper2 = (0, _wrap2.default)({
filename: '%FIXTURE_PATH%',
components: _components,
locals: [],
Expand All @@ -79,8 +84,6 @@ function _wrapComponent(uniqueId) {
};
}

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var React = require('react');
var connect = require('some-hoc');
var twice = require('other-hoc');
Expand Down Expand Up @@ -137,7 +140,7 @@ var more = {
}
};

exports['default'] = _wrapComponent('_$E')(React.createClass({
exports.default = _wrapComponent('_$E')(React.createClass({
displayName: 'E',

render: function render() {}
Expand All @@ -153,7 +156,9 @@ var DynamicName = _wrapComponent('_$Unknown2')(React.createClass({
render: function render() {}
}));

var Something = Math.random() > .5 ? _wrapComponent('_$ComponentInsideCondition')(React.createClass({ displayName: 'ComponentInsideCondition', render: function render() {} })) : _wrapComponent('_$AnotherComponentInsideCondition')(React.createClass({ displayName: 'AnotherComponentInsideCondition', render: function render() {} }));
var Something = Math.random() > .5 ? _wrapComponent('_$ComponentInsideCondition')(React.createClass({ displayName: 'ComponentInsideCondition', render: function render() {}
})) : _wrapComponent('_$AnotherComponentInsideCondition')(React.createClass({ displayName: 'AnotherComponentInsideCondition', render: function render() {}
}));

function factory() {
var ComponentInsideFunction = _wrapComponent('_$ComponentInsideFunction')(React.createClass({
Expand All @@ -166,4 +171,3 @@ function factory() {
render: function render() {}
}));
}
module.exports = exports['default'];
10 changes: 5 additions & 5 deletions test/fixtures/customFactoryMethod/.babelrc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"plugins": ["../../../src"],
"extra": {
"react-transform": {
"presets": ["es2015"],
"plugins": [
["../../../src", {
"transforms": [{
"transform": "my-custom-module/wrap",
"locals": ["module"],
Expand All @@ -14,6 +14,6 @@
"createClass",
"myComponentFactory"
]
}
}
}]
]
}
20 changes: 11 additions & 9 deletions test/fixtures/customFactoryMethod/expected.js
Original file line number Diff line number Diff line change
@@ -1,29 +1,33 @@
'use strict';

var _myCustomModuleWrap2 = require('my-custom-module/wrap');
var _wrap = require('my-other-custom-module/wrap');

var _myCustomModuleWrap3 = _interopRequireDefault(_myCustomModuleWrap2);
var _wrap2 = _interopRequireDefault(_wrap);

var _react = require('react');

var _myOtherCustomModuleWrap2 = require('my-other-custom-module/wrap');
var _react2 = _interopRequireDefault(_react);

var _myOtherCustomModuleWrap3 = _interopRequireDefault(_myOtherCustomModuleWrap2);
var _wrap3 = require('my-custom-module/wrap');

var _wrap4 = _interopRequireDefault(_wrap3);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _components = {
_$A: {
displayName: 'A'
}
};

var _reactComponentWrapper = (0, _myCustomModuleWrap3['default'])({
var _reactComponentWrapper = (0, _wrap4.default)({
filename: '%FIXTURE_PATH%',
components: _components,
locals: [module],
imports: [_react]
imports: [_react2.default]
});

var _reactComponentWrapper2 = (0, _myOtherCustomModuleWrap3['default'])({
var _reactComponentWrapper2 = (0, _wrap2.default)({
filename: '%FIXTURE_PATH%',
components: _components,
locals: [],
Expand All @@ -36,8 +40,6 @@ function _wrapComponent(uniqueId) {
};
}

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var myComponentFactory = require('myComponentFactory');

var A = _wrapComponent('_$A')(myComponentFactory({
Expand Down
10 changes: 5 additions & 5 deletions test/fixtures/modern/.babelrc
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
{
"plugins": ["../../../src"],
"extra": {
"react-transform": {
"presets": ["es2015"],
"plugins": [
["../../../src", {
"transforms": [{
"transform": "my-custom-module/wrap",
"locals": ["module"],
"imports": ["react"]
}, {
"transform": "my-other-custom-module/wrap"
}]
}
}
}]
]
}
11 changes: 6 additions & 5 deletions test/fixtures/vanilla/.babelrc
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
{
"plugins": ["../../../src"],
"extra": {
"react-transform": {
"presets": ["es2015"],
"plugins": [
["../../../src", {
"transforms": [{
"transform": "my-custom-module/wrap",
"locals": ["module"],
"imports": ["react"]
}, {
"transform": "my-other-custom-module/wrap"
}]
}
}

}]
]
}
2 changes: 1 addition & 1 deletion test/index.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import path from 'path';
import fs from 'fs';
import assert from 'assert';
import { transformFileSync } from 'babel';
import { transformFileSync } from 'babel-core';
import plugin from '../src';

function trim(str) {
Expand Down