react redux saga websocket binance stream

Question

Not able to dispatch the action from saga, please have a look in the foo saga, here is the complete code and recent push github link May I know where I am going wrong? without saga it is working fine, but i want to implement trade app with saga.

import { takeEvery, put, call, take } from 'redux-saga/effects'
import {
    updateMarketPairs
} from '../actions/updateMarketPairs'

export default function* marketPairsSagas() {
    yield takeEvery("UPDATE_MARKET_PAIRS", connectSocketStreams)

}

function doAction (data){
    let ticker = {}
    data.forEach(item => {
        let symbol = item.symbol || item.s;
        ticker[symbol] = {
            symbol: symbol,
            lastPrice: item.lastPrice || item.c,
            priceChange: item.priceChange || item.p,
            priceChangePercent: item.priceChangePercent || item.P,
            highPrice: item.highPrice || item.h,
            lowPrice: item.lowPrice || item.l,
            quoteVolume: item.quoteVolume || item.q,
        }
    }) 
    return ticker;

}

function* foo (tickerdata) {
    console.log("yielding");  // appears in console
    console.log('after yielding tickerdata',tickerdata);
    yield put(updateMarketPairs(tickerdata));  // action *is not* dispatched
    console.log("yielded"); //appears in console
}

 function connectSocketStreams(action) {
    const payload = action.payload
    const allStreams = payload.streams && payload.streams.join('/');
    let connection = btoa(allStreams);
    connection = new WebSocket(`wss://stream.binance.com:9443/stream?streams=${allStreams}`);
    connection.onmessage = evt => {
        // yield put({ type: 'ACTION_TYPE', payload: JSON.parse(evt.data)})
        let tickerdata = doAction(JSON.parse(evt.data).data);
        const iter = foo(tickerdata);
        iter.next();
        // yield put(updateMarketPairs(tickerdata));
        console.log('tickerdata saga---->',tickerdata);
    }
    connection.onerror = evt => {
        console.error(evt);
    }
    // yield put(updateMarketPairs(tickerdata));
}

Answer 1

That's because foo is a generator and you cannot invoke it like an ordinary function. You need to use redux-saga call effect.

But there is another problem: call effect won't work inside onmessage handler. Special for cases like this, there is an eventChannel helper that allows saga to communicate with external event sources.