mirror of https://github.com/status-im/metro.git
Revert D7319514: Create a local package of babel-plugin-transform-react
Differential Revision: D7319514 Original commit changeset: bcad3dded2b2 fbshipit-source-id: 3aae57ba660846508ea06fe5a540f4adf5b0088e
This commit is contained in:
Naor Matania
Facebook Github Bot
parent
13a7535d31
commit
ce2ee5a19c
|
|
@ -1,11 +0,0 @@
|
|||
factory({
|
||||
render() {}
|
||||
});
|
||||
|
||||
factory({
|
||||
render: function() {}
|
||||
});
|
||||
|
||||
factory({
|
||||
'render': function() {}
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
factory({
|
||||
render() {}
|
||||
});
|
||||
|
||||
factory({
|
||||
render: function () {}
|
||||
});
|
||||
|
||||
factory({
|
||||
'render': function () {}
|
||||
});
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
foo(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
foo(class extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
},
|
||||
_component: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
foo(_wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
}));
|
||||
foo(_wrapComponent("_component")(class extends React.Component {
|
||||
render() {}
|
||||
}));
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
foo(class Foo extends React.Component {});
|
||||
foo(class extends React.Component {});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
foo(class Foo extends React.Component {});
|
||||
foo(class extends React.Component {});
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
import React, { Component } from 'react';
|
||||
class Foo extends Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: '%FIXTURE_PATH%',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
import React, { Component } from 'react';
|
||||
|
||||
const Foo = _wrapComponent('Foo')(class Foo extends Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
import React, { PureComponent } from 'react';
|
||||
class Foo extends PureComponent {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: '%FIXTURE_PATH%',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
import React, { PureComponent } from 'react';
|
||||
|
||||
const Foo = _wrapComponent('Foo')(class Foo extends PureComponent {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
function factory() {
|
||||
return class Foo extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo",
|
||||
isInFunction: true
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
function factory() {
|
||||
return _wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
function factory() {
|
||||
return class Foo extends React.Component {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
function factory() {
|
||||
return class Foo extends React.Component {};
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
const Foo = class extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
_component: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("_component")(class extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
const Foo = class extends React.Component {}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
const Foo = class extends React.Component {};
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
export class Foo extends React.Component {}
|
||||
export default React.createClass({});
|
||||
export class Bar extends React.Component {}
|
||||
export const bar = React.createClass({});
|
||||
export class Baz { render() {} }
|
||||
export class Boo { render() {} }
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
export class Foo extends React.Component {}
|
||||
export default React.createClass({});
|
||||
export class Bar extends React.Component {}
|
||||
export const bar = React.createClass({});
|
||||
export class Baz {
|
||||
render() {}
|
||||
}
|
||||
export class Boo {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import React from 'react';
|
||||
|
||||
const First = React.createNotClass({
|
||||
displayName: 'First'
|
||||
});
|
||||
|
||||
class Second extends React.NotComponent {}
|
||||
|
||||
const myCreateClass = spec => {
|
||||
return React.createClass(spec);
|
||||
};
|
||||
|
||||
const spec = {
|
||||
render: function () {}
|
||||
};
|
||||
|
||||
React.createClass(spec);
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import React from 'react';
|
||||
|
||||
const First = React.createNotClass({
|
||||
displayName: 'First'
|
||||
});
|
||||
|
||||
class Second extends React.NotComponent {}
|
||||
|
||||
const myCreateClass = spec => {
|
||||
return React.createClass(spec);
|
||||
};
|
||||
|
||||
const spec = {
|
||||
render: function () {}
|
||||
};
|
||||
|
||||
React.createClass(spec);
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
const Foo = React.createClass({
|
||||
displayName: Math.random()
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
const Foo = React.createClass({
|
||||
displayName: Math.random()
|
||||
});
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
const Foo = React.createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
});
|
||||
|
||||
React.createClass({
|
||||
render: function () {}
|
||||
});
|
||||
|
||||
const Bar = React.createClass({
|
||||
render: function () {}
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
},
|
||||
_component: {},
|
||||
_component2: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: '%FIXTURE_PATH%',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent('Foo')(React.createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
_wrapComponent('_component')(React.createClass({
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
const Bar = _wrapComponent('_component2')(React.createClass({
|
||||
render: function () {}
|
||||
}));
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
const MyComponent = React.createClass({
|
||||
displayName: 'my-component',
|
||||
render: function () {}
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
'my-component': {
|
||||
displayName: 'my-component'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: '%FIXTURE_PATH%',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const MyComponent = _wrapComponent('my-component')(React.createClass({
|
||||
displayName: 'my-component',
|
||||
render: function () {}
|
||||
}));
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
const MyComponent = React.createClass({
|
||||
displayName: 'my-component'
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
const MyComponent = React.createClass({
|
||||
displayName: 'my-component'
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
const Foo = React.createClass({});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
const Foo = React.createClass({});
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
const Foo = React.createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
React.createClass({
|
||||
});
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
const Foo = React.createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
React.createClass({});
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
const Foo = createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
});
|
||||
|
||||
const Bar = factory({
|
||||
displayName: 'Bar',
|
||||
render: function () {}
|
||||
});
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"factoryMethods": ["createClass", "factory"],
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
},
|
||||
Bar: {
|
||||
displayName: 'Bar'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: '%FIXTURE_PATH%',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent('Foo')(createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
const Bar = _wrapComponent('Bar')(factory({
|
||||
displayName: 'Bar',
|
||||
render: function () {}
|
||||
}));
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
const Foo = createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
const Bar = factory({
|
||||
displayName: 'Bar'
|
||||
});
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"factoryMethods": ["createClass", "factory"],
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
const Foo = createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
const Bar = factory({
|
||||
displayName: 'Bar'
|
||||
});
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
class Foo extends BooComponent {
|
||||
render() {}
|
||||
}
|
||||
class Bar extends CustomComponent {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"superClasses": ["BooComponent", "CustomComponent"],
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
},
|
||||
Bar: {
|
||||
displayName: "Bar"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("Foo")(class Foo extends BooComponent {
|
||||
render() {}
|
||||
});
|
||||
|
||||
const Bar = _wrapComponent("Bar")(class Bar extends CustomComponent {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
class Foo extends BooComponent {}
|
||||
class Bar extends CustomComponent {}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"superClasses": ["BooComponent", "CustomComponent"],
|
||||
"transforms": [{
|
||||
"transform": "transform-lib"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
class Foo extends BooComponent {}
|
||||
class Bar extends CustomComponent {}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-one"
|
||||
}, {
|
||||
"transform": "transform-two"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
import _transformTwo from "transform-two";
|
||||
import _transformOne from "transform-one";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformOne2 = _transformOne({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
const _transformTwo2 = _transformTwo({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformOne2(_transformTwo2(Component, id), id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-one"
|
||||
}, {
|
||||
"transform": "transform-two"
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib",
|
||||
"locals": [],
|
||||
"imports": ["react", "react-dom"]
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import _reactDom from "react-dom";
|
||||
import _react from "react";
|
||||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: [_react, _reactDom]
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib",
|
||||
"locals": [],
|
||||
"imports": ["react", "react-dom"]
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
class Foo extends React.Component {
|
||||
render() {}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib",
|
||||
"locals": ["module", "exports"],
|
||||
"imports": []
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
import _transformLib from "transform-lib";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: "Foo"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: "%FIXTURE_PATH%",
|
||||
components: _components,
|
||||
locals: [module, exports],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent("Foo")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"transforms": [{
|
||||
"transform": "transform-lib",
|
||||
"locals": ["module", "exports"],
|
||||
"imports": []
|
||||
}]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
class Foo extends React.Component {}
|
||||
|
|
@ -1,497 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`finds React components should code call expression with render method 1`] = `
|
||||
"factory({
|
||||
render() {}
|
||||
});
|
||||
|
||||
factory({
|
||||
render: function () {}
|
||||
});
|
||||
|
||||
factory({
|
||||
'render': function () {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class expression 1`] = `
|
||||
"foo(class Foo extends React.Component {});
|
||||
foo(class extends React.Component {});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class expression extends react component with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
},
|
||||
_component: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
foo(_wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
}));
|
||||
foo(_wrapComponent(\\"_component\\")(class extends React.Component {
|
||||
render() {}
|
||||
}));"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class extends component with render method 1`] = `
|
||||
"import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: 'unknown',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
import React, { Component } from 'react';
|
||||
|
||||
const Foo = _wrapComponent('Foo')(class Foo extends Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class extends purecomponent with render method 1`] = `
|
||||
"import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: 'unknown',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
import React, { PureComponent } from 'react';
|
||||
|
||||
const Foo = _wrapComponent('Foo')(class Foo extends PureComponent {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class extends react component 1`] = `"class Foo extends React.Component {}"`;
|
||||
|
||||
exports[`finds React components should code class extends react component with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class with render method 1`] = `
|
||||
"class Foo {
|
||||
render() {}
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class within function 1`] = `
|
||||
"function factory() {
|
||||
return class Foo extends React.Component {};
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class within function extends react component with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\",
|
||||
isInFunction: true
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
function factory() {
|
||||
return _wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code class without name 1`] = `"const Foo = class extends React.Component {};"`;
|
||||
|
||||
exports[`finds React components should code class without name extends react component with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
_component: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"_component\\")(class extends React.Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code exports 1`] = `
|
||||
"export class Foo extends React.Component {}
|
||||
export default React.createClass({});
|
||||
export class Bar extends React.Component {}
|
||||
export const bar = React.createClass({});
|
||||
export class Baz {
|
||||
render() {}
|
||||
}
|
||||
export class Boo {
|
||||
render() {}
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code ignore 1`] = `
|
||||
"import React from 'react';
|
||||
|
||||
const First = React.createNotClass({
|
||||
displayName: 'First'
|
||||
});
|
||||
|
||||
class Second extends React.NotComponent {}
|
||||
|
||||
const myCreateClass = spec => {
|
||||
return React.createClass(spec);
|
||||
};
|
||||
|
||||
const spec = {
|
||||
render: function () {}
|
||||
};
|
||||
|
||||
React.createClass(spec);"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class 1`] = `
|
||||
"const Foo = React.createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
React.createClass({});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class with dynamic display name 1`] = `
|
||||
"const Foo = React.createClass({
|
||||
displayName: Math.random()
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class with render method 1`] = `
|
||||
"import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
},
|
||||
_component: {},
|
||||
_component2: {}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: 'unknown',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent('Foo')(React.createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
_wrapComponent('_component')(React.createClass({
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
const Bar = _wrapComponent('_component2')(React.createClass({
|
||||
render: function () {}
|
||||
}));"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class with string literal display name 1`] = `
|
||||
"const MyComponent = React.createClass({
|
||||
displayName: 'my-component'
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class with string literal display name with render method 1`] = `
|
||||
"import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
'my-component': {
|
||||
displayName: 'my-component'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: 'unknown',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const MyComponent = _wrapComponent('my-component')(React.createClass({
|
||||
displayName: 'my-component',
|
||||
render: function () {}
|
||||
}));"
|
||||
`;
|
||||
|
||||
exports[`finds React components should code react create class without display name 1`] = `"const Foo = React.createClass({});"`;
|
||||
|
||||
exports[`finds React components should options custom factories 1`] = `
|
||||
"const Foo = createClass({
|
||||
displayName: 'Foo'
|
||||
});
|
||||
|
||||
const Bar = factory({
|
||||
displayName: 'Bar'
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options custom factories with render method 1`] = `
|
||||
"import _transformLib from 'transform-lib';
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: 'Foo'
|
||||
},
|
||||
Bar: {
|
||||
displayName: 'Bar'
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: 'unknown',
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent('Foo')(createClass({
|
||||
displayName: 'Foo',
|
||||
render: function () {}
|
||||
}));
|
||||
|
||||
const Bar = _wrapComponent('Bar')(factory({
|
||||
displayName: 'Bar',
|
||||
render: function () {}
|
||||
}));"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options custom super classes 1`] = `
|
||||
"class Foo extends BooComponent {}
|
||||
class Bar extends CustomComponent {}"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options custom super classes with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
},
|
||||
Bar: {
|
||||
displayName: \\"Bar\\"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"Foo\\")(class Foo extends BooComponent {
|
||||
render() {}
|
||||
});
|
||||
|
||||
const Bar = _wrapComponent(\\"Bar\\")(class Bar extends CustomComponent {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options multiple transforms 1`] = `"class Foo extends React.Component {}"`;
|
||||
|
||||
exports[`finds React components should options multiple transforms with render method 1`] = `
|
||||
"import _transformTwo from \\"transform-two\\";
|
||||
import _transformOne from \\"transform-one\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformOne2 = _transformOne({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
const _transformTwo2 = _transformTwo({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformOne2(_transformTwo2(Component, id), id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options with imports 1`] = `"class Foo extends React.Component {}"`;
|
||||
|
||||
exports[`finds React components should options with imports with render method 1`] = `
|
||||
"import _reactDom from \\"react-dom\\";
|
||||
import _react from \\"react\\";
|
||||
import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [],
|
||||
imports: [_react, _reactDom]
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
||||
exports[`finds React components should options with locals 1`] = `"class Foo extends React.Component {}"`;
|
||||
|
||||
exports[`finds React components should options with locals with render method 1`] = `
|
||||
"import _transformLib from \\"transform-lib\\";
|
||||
const _components = {
|
||||
Foo: {
|
||||
displayName: \\"Foo\\"
|
||||
}
|
||||
};
|
||||
|
||||
const _transformLib2 = _transformLib({
|
||||
filename: \\"unknown\\",
|
||||
components: _components,
|
||||
locals: [module, exports],
|
||||
imports: []
|
||||
});
|
||||
|
||||
function _wrapComponent(id) {
|
||||
return function (Component) {
|
||||
return _transformLib2(Component, id);
|
||||
};
|
||||
}
|
||||
|
||||
const Foo = _wrapComponent(\\"Foo\\")(class Foo extends React.Component {
|
||||
render() {}
|
||||
});"
|
||||
`;
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
/**
|
||||
* Copyright (c) 2004-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @emails oncall+javascript_foundation
|
||||
* @flow
|
||||
* @format
|
||||
*/
|
||||
|
||||
// Note: these tests were updated to snapshots
|
||||
|
||||
'use strict';
|
||||
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
|
||||
/*eslint-disable import/no-extraneous-dependencies*/
|
||||
const {transform: transformSync} = require('babel-core');
|
||||
const reactPlugin = require('../lib/index.js').default;
|
||||
|
||||
describe('finds React components', () => {
|
||||
const fixturesDir = path.join(__dirname, '__fixtures__');
|
||||
fs.readdirSync(fixturesDir).map(caseName => {
|
||||
it(`should ${caseName.split('-').join(' ')}`, () => {
|
||||
const fixtureDir = path.join(fixturesDir, caseName);
|
||||
const input = fs.readFileSync(
|
||||
path.join(fixtureDir, 'actual.js.es6'),
|
||||
'utf8',
|
||||
);
|
||||
const config = fs.readFileSync(
|
||||
path.join(fixtureDir, 'babel.json'),
|
||||
'utf8',
|
||||
);
|
||||
const output = transformSync(input, {
|
||||
babelrc: false,
|
||||
plugins: [
|
||||
[
|
||||
reactPlugin,
|
||||
// note: these originate from the .babelrc files from the real tests
|
||||
JSON.parse(config),
|
||||
],
|
||||
],
|
||||
}).code;
|
||||
|
||||
expect(output).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -1,415 +0,0 @@
|
|||
/**
|
||||
* Copyright (c) 2004-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* In order to speed things up, we use transform caching. However, the project
|
||||
* codebase moves very fast and cache becomes invalid when some files change.
|
||||
*
|
||||
* CacheKey is used to generate a unique string that can be used as cache key.
|
||||
* The cache key consists of various dependency cache keys that change if the
|
||||
* output of the transform would change.
|
||||
*
|
||||
* Imported from https://github.com/gaearon/babel-plugin-react-transform
|
||||
* https://github.com/gaearon/babel-plugin-react-transform/commit/d7069df5c6f36a07857fd108067dc515b3a795ee
|
||||
*
|
||||
* @format
|
||||
* @noflow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
// temporary workaround, don't mind this package
|
||||
/*eslint-disable eslint-comments/no-unlimited-disable*/
|
||||
/*eslint-disable*/
|
||||
|
||||
const find = require('lodash/find');
|
||||
|
||||
module.exports = {
|
||||
default: function({types: t, template}) {
|
||||
function matchesPatterns(path, patterns) {
|
||||
return !!find(patterns, pattern => {
|
||||
return (
|
||||
t.isIdentifier(path.node, {name: pattern}) ||
|
||||
path.matchesPattern(pattern)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function isReactLikeClass(node) {
|
||||
return !!find(node.body.body, classMember => {
|
||||
return (
|
||||
t.isClassMethod(classMember) &&
|
||||
t.isIdentifier(classMember.key, {name: 'render'})
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function isReactLikeComponentObject(node) {
|
||||
return (
|
||||
t.isObjectExpression(node) &&
|
||||
!!find(node.properties, objectMember => {
|
||||
return (
|
||||
(t.isObjectProperty(objectMember) ||
|
||||
t.isObjectMethod(objectMember)) &&
|
||||
(t.isIdentifier(objectMember.key, {name: 'render'}) ||
|
||||
t.isStringLiteral(objectMember.key, {value: 'render'}))
|
||||
);
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
// `foo({ displayName: 'NAME' });` => 'NAME'
|
||||
function getDisplayName(node) {
|
||||
const property = find(
|
||||
node.arguments[0].properties,
|
||||
_node => _node.key.name === 'displayName',
|
||||
);
|
||||
return property && property.value.value;
|
||||
}
|
||||
|
||||
function hasParentFunction(path) {
|
||||
return !!path.findParent(parentPath => parentPath.isFunction());
|
||||
}
|
||||
|
||||
// wrapperFunction("componentId")(node)
|
||||
function wrapComponent(node, componentId, wrapperFunctionId) {
|
||||
return t.callExpression(
|
||||
t.callExpression(wrapperFunctionId, [t.stringLiteral(componentId)]),
|
||||
[node],
|
||||
);
|
||||
}
|
||||
|
||||
// `{ name: foo }` => Node { type: "ObjectExpression", properties: [...] }
|
||||
function toObjectExpression(object) {
|
||||
const properties = Object.keys(object).map(key => {
|
||||
return t.objectProperty(t.identifier(key), object[key]);
|
||||
});
|
||||
|
||||
return t.objectExpression(properties);
|
||||
}
|
||||
|
||||
const wrapperFunctionTemplate = template(`
|
||||
function WRAPPER_FUNCTION_ID(ID_PARAM) {
|
||||
return function(COMPONENT_PARAM) {
|
||||
return EXPRESSION;
|
||||
};
|
||||
}
|
||||
`);
|
||||
|
||||
const VISITED_KEY = 'react-transform-' + Date.now();
|
||||
|
||||
const componentVisitor = {
|
||||
Class(path) {
|
||||
if (
|
||||
path.node[VISITED_KEY] ||
|
||||
!matchesPatterns(path.get('superClass'), this.superClasses) ||
|
||||
!isReactLikeClass(path.node)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
path.node[VISITED_KEY] = true;
|
||||
|
||||
const componentName = (path.node.id && path.node.id.name) || null;
|
||||
const componentId =
|
||||
componentName || path.scope.generateUid('component');
|
||||
const isInFunction = hasParentFunction(path);
|
||||
|
||||
this.components.push({
|
||||
id: componentId,
|
||||
name: componentName,
|
||||
isInFunction: isInFunction,
|
||||
});
|
||||
|
||||
// Can't wrap ClassDeclarations
|
||||
const isStatement = t.isStatement(path.node);
|
||||
const expression = t.toExpression(path.node);
|
||||
|
||||
// wrapperFunction("componentId")(node)
|
||||
let wrapped = wrapComponent(
|
||||
expression,
|
||||
componentId,
|
||||
this.wrapperFunctionId,
|
||||
);
|
||||
let constId;
|
||||
|
||||
if (isStatement) {
|
||||
// wrapperFunction("componentId")(class Foo ...) => const Foo = wrapperFunction("componentId")(class Foo ...)
|
||||
constId = t.identifier(componentName || componentId);
|
||||
wrapped = t.variableDeclaration('const', [
|
||||
t.variableDeclarator(constId, wrapped),
|
||||
]);
|
||||
}
|
||||
|
||||
if (t.isExportDefaultDeclaration(path.parent)) {
|
||||
path.parentPath.insertBefore(wrapped);
|
||||
path.parent.declaration = constId;
|
||||
} else {
|
||||
path.replaceWith(wrapped);
|
||||
}
|
||||
},
|
||||
|
||||
CallExpression(path) {
|
||||
if (
|
||||
path.node[VISITED_KEY] ||
|
||||
!matchesPatterns(path.get('callee'), this.factoryMethods) ||
|
||||
!isReactLikeComponentObject(path.node.arguments[0])
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
path.node[VISITED_KEY] = true;
|
||||
|
||||
// `foo({ displayName: 'NAME' });` => 'NAME'
|
||||
const componentName = getDisplayName(path.node);
|
||||
const componentId =
|
||||
componentName || path.scope.generateUid('component');
|
||||
const isInFunction = hasParentFunction(path);
|
||||
|
||||
this.components.push({
|
||||
id: componentId,
|
||||
name: componentName,
|
||||
isInFunction: isInFunction,
|
||||
});
|
||||
|
||||
path.replaceWith(
|
||||
wrapComponent(path.node, componentId, this.wrapperFunctionId),
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
class ReactTransformBuilder {
|
||||
constructor(file, options) {
|
||||
this.file = file;
|
||||
this.program = file.path;
|
||||
this.options = this.normalizeOptions(options);
|
||||
|
||||
// @todo: clean this shit up
|
||||
this.configuredTransformsIds = [];
|
||||
}
|
||||
|
||||
static validateOptions(options) {
|
||||
return typeof options === 'object' && Array.isArray(options.transforms);
|
||||
}
|
||||
|
||||
static assertValidOptions(options) {
|
||||
if (!ReactTransformBuilder.validateOptions(options)) {
|
||||
throw new Error(
|
||||
'babel-plugin-react-transform requires that you specify options ' +
|
||||
'in .babelrc or from the Babel Node API, and that it is an object ' +
|
||||
'with a transforms property which is an array.',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
normalizeOptions(options) {
|
||||
return {
|
||||
factoryMethods: options.factoryMethods || ['React.createClass'],
|
||||
superClasses: options.superClasses || [
|
||||
'React.Component',
|
||||
'React.PureComponent',
|
||||
'Component',
|
||||
'PureComponent',
|
||||
],
|
||||
transforms: options.transforms.map(opts => {
|
||||
return {
|
||||
transform: opts.transform,
|
||||
locals: opts.locals || [],
|
||||
imports: opts.imports || [],
|
||||
};
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
||||
build() {
|
||||
const componentsDeclarationId = this.file.scope.generateUidIdentifier(
|
||||
'components',
|
||||
);
|
||||
const wrapperFunctionId = this.file.scope.generateUidIdentifier(
|
||||
'wrapComponent',
|
||||
);
|
||||
|
||||
const components = this.collectAndWrapComponents(wrapperFunctionId);
|
||||
|
||||
if (!components.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
const componentsDeclaration = this.initComponentsDeclaration(
|
||||
componentsDeclarationId,
|
||||
components,
|
||||
);
|
||||
const configuredTransforms = this.initTransformers(
|
||||
componentsDeclarationId,
|
||||
);
|
||||
const wrapperFunction = this.initWrapperFunction(wrapperFunctionId);
|
||||
|
||||
const body = this.program.node.body;
|
||||
|
||||
body.unshift(wrapperFunction);
|
||||
configuredTransforms.reverse().forEach(node => body.unshift(node));
|
||||
body.unshift(componentsDeclaration);
|
||||
}
|
||||
|
||||
/**
|
||||
* const Foo = _wrapComponent('Foo')(class Foo extends React.Component {});
|
||||
* ...
|
||||
* const Bar = _wrapComponent('Bar')(React.createClass({
|
||||
* displayName: 'Bar'
|
||||
* }));
|
||||
*/
|
||||
collectAndWrapComponents(wrapperFunctionId) {
|
||||
const components = [];
|
||||
|
||||
this.file.path.traverse(componentVisitor, {
|
||||
wrapperFunctionId: wrapperFunctionId,
|
||||
components: components,
|
||||
factoryMethods: this.options.factoryMethods,
|
||||
superClasses: this.options.superClasses,
|
||||
currentlyInFunction: false,
|
||||
});
|
||||
|
||||
return components;
|
||||
}
|
||||
|
||||
/**
|
||||
* const _components = {
|
||||
* Foo: {
|
||||
* displayName: "Foo"
|
||||
* }
|
||||
* };
|
||||
*/
|
||||
initComponentsDeclaration(componentsDeclarationId, components) {
|
||||
const props = components.map(component => {
|
||||
const componentId = component.id;
|
||||
const componentProps = [];
|
||||
|
||||
if (component.name) {
|
||||
componentProps.push(
|
||||
t.objectProperty(
|
||||
t.identifier('displayName'),
|
||||
t.stringLiteral(component.name),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
if (component.isInFunction) {
|
||||
componentProps.push(
|
||||
t.objectProperty(
|
||||
t.identifier('isInFunction'),
|
||||
t.booleanLiteral(true),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
let objectKey;
|
||||
|
||||
if (t.isValidIdentifier(componentId)) {
|
||||
objectKey = t.identifier(componentId);
|
||||
} else {
|
||||
objectKey = t.stringLiteral(componentId);
|
||||
}
|
||||
|
||||
return t.objectProperty(
|
||||
objectKey,
|
||||
t.objectExpression(componentProps),
|
||||
);
|
||||
});
|
||||
|
||||
return t.variableDeclaration('const', [
|
||||
t.variableDeclarator(
|
||||
componentsDeclarationId,
|
||||
t.objectExpression(props),
|
||||
),
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* import _transformLib from "transform-lib";
|
||||
* ...
|
||||
* const _transformLib2 = _transformLib({
|
||||
* filename: "filename",
|
||||
* components: _components,
|
||||
* locals: [],
|
||||
* imports: []
|
||||
* });
|
||||
*/
|
||||
initTransformers(componentsDeclarationId) {
|
||||
return this.options.transforms.map(transform => {
|
||||
const transformName = transform.transform;
|
||||
const transformImportId = this.file.addImport(
|
||||
transformName,
|
||||
'default',
|
||||
transformName,
|
||||
);
|
||||
|
||||
const transformLocals = transform.locals.map(local => {
|
||||
return t.identifier(local);
|
||||
});
|
||||
|
||||
const transformImports = transform.imports.map(importName => {
|
||||
return this.file.addImport(importName, 'default', importName);
|
||||
});
|
||||
|
||||
const configuredTransformId = this.file.scope.generateUidIdentifier(
|
||||
transformName,
|
||||
);
|
||||
const configuredTransform = t.variableDeclaration('const', [
|
||||
t.variableDeclarator(
|
||||
configuredTransformId,
|
||||
t.callExpression(transformImportId, [
|
||||
toObjectExpression({
|
||||
filename: t.stringLiteral(this.file.opts.filename),
|
||||
components: componentsDeclarationId,
|
||||
locals: t.arrayExpression(transformLocals),
|
||||
imports: t.arrayExpression(transformImports),
|
||||
}),
|
||||
]),
|
||||
),
|
||||
]);
|
||||
|
||||
this.configuredTransformsIds.push(configuredTransformId);
|
||||
|
||||
return configuredTransform;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function _wrapComponent(id) {
|
||||
* return function (Component) {
|
||||
* return _transformLib2(Component, id);
|
||||
* };
|
||||
* }
|
||||
*/
|
||||
initWrapperFunction(wrapperFunctionId) {
|
||||
const idParam = t.identifier('id');
|
||||
const componentParam = t.identifier('Component');
|
||||
|
||||
const expression = this.configuredTransformsIds
|
||||
.reverse()
|
||||
.reduce((memo, transformId) => {
|
||||
return t.callExpression(transformId, [memo, idParam]);
|
||||
}, componentParam);
|
||||
|
||||
return wrapperFunctionTemplate({
|
||||
WRAPPER_FUNCTION_ID: wrapperFunctionId,
|
||||
ID_PARAM: idParam,
|
||||
COMPONENT_PARAM: componentParam,
|
||||
EXPRESSION: expression,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
visitor: {
|
||||
Program(path, {file, opts}) {
|
||||
ReactTransformBuilder.assertValidOptions(opts);
|
||||
const builder = new ReactTransformBuilder(file, opts);
|
||||
builder.build();
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
{
|
||||
"version": "0.30.2",
|
||||
"name": "metro-babel7-plugin-react-transform",
|
||||
"main": "lib/index.js",
|
||||
"dependencies": {
|
||||
"lodash": "^4.17.5"
|
||||
}
|
||||
}
|
||||
|
|
@ -4005,10 +4005,6 @@ lodash@^4.0.0, lodash@^4.1.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.15.0, lo
|
|||
version "4.17.4"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
|
||||
|
||||
lodash@^4.17.5:
|
||||
version "4.17.5"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
|
||||
|
||||
lolex@^1.6.0:
|
||||
version "1.6.0"
|
||||
resolved "https://registry.yarnpkg.com/lolex/-/lolex-1.6.0.tgz#3a9a0283452a47d7439e72731b9e07d7386e49f6"
|
||||
|
|
|
|||
Loading…
Reference in New Issue