Skip to content

Commit

Permalink
pass down context in create-class addresses github#705
Browse files Browse the repository at this point in the history
  • Loading branch information
Havunen committed Jan 14, 2017
1 parent 5a9e217 commit 5797299
Show file tree
Hide file tree
Showing 9 changed files with 208 additions and 21 deletions.
4 changes: 2 additions & 2 deletions packages/inferno/dist/inferno-compat.js
Expand Up @@ -477,8 +477,8 @@ function applyMixins(inst, mixins) {
}
function createClass(obj) {
var Cl = (function (Component$$1) {
function Cl(props) {
Component$$1.call(this, props);
function Cl(props, context) {
Component$$1.call(this, props, context);
this.isMounted = function () {
return !this._unmounted;
};
Expand Down
2 changes: 1 addition & 1 deletion packages/inferno/dist/inferno-compat.min.js

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions packages/inferno/dist/inferno-compat.node.js
Expand Up @@ -477,8 +477,8 @@ function applyMixins(inst, mixins) {
}
function createClass(obj) {
var Cl = (function (Component$$1) {
function Cl(props) {
Component$$1.call(this, props);
function Cl(props, context) {
Component$$1.call(this, props, context);
this.isMounted = function () {
return !this._unmounted;
};
Expand Down
4 changes: 2 additions & 2 deletions packages/inferno/dist/inferno-create-class.js
Expand Up @@ -118,8 +118,8 @@ function applyMixins(inst, mixins) {
}
function createClass$1(obj) {
var Cl = (function (Component$$1) {
function Cl(props) {
Component$$1.call(this, props);
function Cl(props, context) {
Component$$1.call(this, props, context);
this.isMounted = function () {
return !this._unmounted;
};
Expand Down
2 changes: 1 addition & 1 deletion packages/inferno/dist/inferno-create-class.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions packages/inferno/dist/inferno-create-class.node.js
Expand Up @@ -118,8 +118,8 @@ function applyMixins(inst, mixins) {
}
function createClass$1(obj) {
var Cl = (function (Component$$1) {
function Cl(props) {
Component$$1.call(this, props);
function Cl(props, context) {
Component$$1.call(this, props, context);
this.isMounted = function () {
return !this._unmounted;
};
Expand Down
20 changes: 11 additions & 9 deletions src/component/__tests__/createClass.spec.browser.ts
@@ -1,8 +1,8 @@
import { expect } from 'chai';
import { render } from '../../DOM/rendering';
import createClass from '../createClass';
import createElement from '../../factories/createElement';
import { innerHTML } from '../../tools/utils';
import {expect} from "chai";
import {render} from "../../DOM/rendering";
import createClass from "../createClass";
import createElement from "../../factories/createElement";
import {innerHTML} from "../../tools/utils";

describe('Components createClass (non-JSX)', () => {
let container;
Expand Down Expand Up @@ -43,13 +43,13 @@ describe('Components createClass (non-JSX)', () => {
render(createElement(LifecycleComponent1 as Function, {}), container);
expect(componentWillUpdate).to.equal(true);
});
it('should render a basic component with methods bound', done => {

it('should have context available in getInitialState', done => {
let context;
let context2;
const BoundComponent = createClass({
getInitialState() {
context = this;
setTimeout(this.foo, 1);
expect(this.context)
},
foo() {
context2 = this;
Expand All @@ -65,9 +65,11 @@ describe('Components createClass (non-JSX)', () => {
done();
}, 2);
});

it('should have propTypes on created class', () => {
const propTypes = {
value() {}
value() {
}
};
const Component = createClass({
propTypes,
Expand Down
185 changes: 185 additions & 0 deletions src/component/__tests__/createClass.spec.browser.tsx
@@ -0,0 +1,185 @@
import {expect} from 'chai';
import {render} from '../../DOM/rendering';
import {innerHTML} from '../../tools/utils';
import createClass from '../createClass';

describe('Components createClass (non-JSX)', () => {
let container;

beforeEach(() => {
container = document.createElement('div');
container.style.display = 'none';
document.body.appendChild(container);
});

afterEach(() => {
document.body.removeChild(container);
render(null, container);
});

/*
describe("mixins", () => {
describe("getDefaultProps", () => {
it('should use a mixin', () => {
const Foo = createClass({
mixins: [
{getDefaultProps: () => ({a: true})}
],
render() {
return <div></div>;
}
});
expect(Foo.defaultProps).to.eql({
a: true
});
});
it('should combine the results', () => {
const Foo = createClass({
mixins: [
{getDefaultProps: () => ({a: true})},
{getDefaultProps: () => ({b: true})}
],
getDefaultProps() {
return {c: true};
},
render() {
return <div />;
}
});
expect(Foo.defaultProps).to.eql({
a: true,
b: true,
c: true
});
});
it('should throw an error for duplicate keys', () => {
expect(() => {
createClass({
mixins: [
{getDefaultProps: () => ({a: true})}
],
getDefaultProps() {
return {a: true};
},
render() {
return <div />;
}
});
}).to.throw();
});
});
describe("getInitialState", () => {
it('should combine the results', () => {
const Foo = createClass({
mixins: [
{getInitialState: () => ({a: true})},
{getInitialState: () => ({b: true})}
],
getInitialState() {
return {c: true};
},
render() {
return <div />;
}
});
let a;
render(<Foo ref={function (i) {a = i}} />, container);
expect(a.state).to.eql({
a: true,
b: true,
c: true
});
});
it('should throw an error for duplicate keys', () => {
const Foo = createClass({
mixins: [
{getInitialState: () => ({a: true})}
],
getInitialState() {
return {a: true};
},
render() {
return <div />;
}
});
expect(() => {
render(<Foo />, container);
}).to.throw();
});
});
});
*/
describe('Context', () => {
it('It should have context defined when context moved to children', () => {
const App = createClass({
getDefaultProps() {
return {
wrapContext: false,
};
},

getChildContext() {
return {
foo: 'bar baz',
};
},

addPageContexts(children) {
const newChildren = [];

for (let i = 0; i < children.length; i++) {
newChildren.push(<Page {...children[i].props} />);
}

return newChildren;
},

render() {
let children;

if (this.props.wrapContext) {
children = this.addPageContexts(this.props.children);
} else {
children = this.props.children;
}

return (
<div>
{children}
</div>
);
},
});

const Page = createClass({
getInitialState() {
return {
foo: this.context.foo,
};
},
render() {
return <div>{this.props.greeting} {this.state.foo}</div>;
},
});

render(
(
<App wrapContext={true}>
<Page greeting="Hello" />
<Page greeting="Hai" />
</App>
), container);

expect(container.innerHTML).to.eql(innerHTML('<div><div>Hello bar baz</div><div>Hai bar baz</div></div>'));
});
});
});
4 changes: 2 additions & 2 deletions src/component/createClass.ts
Expand Up @@ -100,8 +100,8 @@ export default function createClass<P, S>(obj: ComponentSpec<P, S>) {
static defaultProps = obj.getDefaultProps ? obj.getDefaultProps() : undefined;
static mixins = obj.mixins && collateMixins(obj.mixins);

constructor(props) {
super(props);
constructor(props, context) {
super(props, context);
extend(this, obj);
if (Cl.mixins) {
applyMixins(this, Cl.mixins);
Expand Down

0 comments on commit 5797299

Please sign in to comment.