0

I'm being trying unsuccesfully to combine to streams into one, and show the text in a h1.

But not being able to make it work:

this is my code:

function main(sources) {
  // single streams
  let letter$ = xs.of({text: 'abcd'}); 
  let number$ = xs.of({text: '123456'});

  //try to combine them into one
  const combined$ = 
    xs.combine( letter$, number$ ).
      map( ( [ letter, number ] ) => {
        return { text: letter.text + ' ' + number.text };
      });

  //updates the virtual dom with the reponse
  const vdom$ = combined$
    .map(o => o.text) 
    .startWith('Loading...')
    .map(text =>
      div('.container', [
        h1(text)
      ])
    );


  return {
    DOM: vdom$
  };
}

It shows error saying:

index.js:6 TypeError: f is not a function
at invoke (core.js:36)
at CombineListener._n (core.js:72)
at Stream._n (core.js:886)
at FromArrayProducer._start (core.js:142)
at Stream._add (core.js:959)
at CombineProducer._start (core.js:118)
at Stream._add (core.js:959)
at MapOperator._start (core.js:681)
at Stream._add (core.js:959)
at StartWithOperator._start (core.js:786)

being trying to understand why but no luck so far.

ismapro
  • 162
  • 9
  • What is line 6 in file *index.js*? – bloodyKnuckles Aug 18 '16 at 14:21
  • The `combine` part works fine here: http://www.webpackbin.com/VkmIaiCtZ – bloodyKnuckles Aug 18 '16 at 14:26
  • thanks for give it a look, it looks like the problem happen when the combined stream goes to the vtree. The webpackbin is a great recommendation, here is with the additional code: [http://www.webpackbin.com/VkpnY30K-](http://www.webpackbin.com/VkpnY30K-) – ismapro Aug 18 '16 at 14:52
  • thanks @bloodyKnuckles I was using some outdated dependencies and that created the error. Thanks for the help. – ismapro Aug 18 '16 at 15:50

1 Answers1

2

My problem was using the dependencies specified in the package.json of the examples in the CycleJS repo.

Those dependencies are outdated:

https://github.com/cyclejs/cyclejs/blob/master/examples/http-search-github/package.json

"dependencies": {
   "@cycle/xstream-run": "1.1.0",
   "@cycle/dom": "10.0.0-rc20",
   "@cycle/http": "9.0.0-rc3",
   "xstream": "2.4.x"
}

and the dependencies to date are:

"@cycle/dom": "^12.1.0",
"@cycle/http": "^10.1.0",
"@cycle/xstream-run": "^3.0.4",
"xstream": "^5.3.6"

rule of thumb check for the latest stable dependencies.

thanks @bloodyKnuckles, and everybody in the CycleJS gitter.

ismapro
  • 162
  • 9