renderToString doesn't work with cycle-react components

[corps]

Hey there,

First off wanted to say I'm a fan of cycle-react and have been using it without issue for awhile now.

Recently, however, I moved towards performing a server side render of a page using a cycle react component at the top level and have had problems.

import * as Cycle from "cycle-react";
import * as Rx from "rx";
import * as React from "react";

var MyComponent = Cycle.component(() => Rx.Observable.just(<div>Hello!</div>));
React.renderToString(<MyComponent />);

This unfortunately throws this error:

Error: Invariant Violation: setState(...): Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state.
   at invariant (/Users/dame/Development/nama/node_modules/react/lib/invariant.js:42:15)
   at getInternalInstanceReadyForUpdate (/Users/dame/Development/nama/node_modules/react/lib/ReactUpdateQueue.js:35:44)
   at Object.ReactUpdateQueue.enqueueSetState (/Users/dame/Development/nama/node_modules/react/lib/ReactUpdateQueue.js:194:28)
   at ReactComponent.setState (/Users/dame/Development/nama/node_modules/react/lib/ReactComponent.js:69:20)
   at AnonymousObserver.onNextVTree [as _onNext] (/Users/dame/Development/nama/node_modules/cycle-react/src/create-react-class.js:72:16)
   at AnonymousObserver.Rx.AnonymousObserver.AnonymousObserver.next (/Users/dame/Development/nama/node_modules/rx/dist/rx.js:1785:12)
   at AnonymousObserver.Rx.internals.AbstractObserver.AbstractObserver.onNext (/Users/dame/Development/nama/node_modules/rx/dist/rx.js:1719:31)
   at AnonymousObserver.tryCatcher (/Users/dame/Development/nama/node_modules/rx/dist/rx.js:60:31)
   at InnerObserver.next (/Users/dame/Development/nama/node_modules/rx/dist/rx.js:4478:41)
   at InnerObserver.Rx.internals.AbstractObserver.AbstractObserver.onNext (/Users/dame/Development/nama/node_modules/rx/dist/rx.js:1719:31)

But here's the strange thing -- by merely wrapping the cycle react component in an outer element, not only does the error goes away but the component successfully renders.

import * as Cycle from "cycle-react";
import * as Rx from "rx";
import * as React from "react";

var MyComponent = Cycle.component(() => Rx.Observable.just(<div>Hello!</div>));
React.renderToString(<div><MyComponent /></div>);

The above code works as expected. Weird.

[pH200]

I'll look into it later today.

[pH200]

Sorry it took me a long time to look back at this issue. Though I wasn't able to reproduce this issue for 2.0. It should be now fixed in 3.0 since I've changed the inner render method by using cloneElement. If you still have this error in 3.0, feel free to reopen this issue.