Move refetch(), startPolling() and stopPolling() from Subscription to ObservableQuery

[martijnwalraven]

Interoperability with other Observable implementations (see #149) means we have no control over the Subscription object users end up with.

For example, Rx.Observable.from(handle).subscribe() would return an RxJS Subscription object without the Apollo-specific helper methods.

So I think it makes most sense to move these methods to ObservableQuery (maybe this needs a better name, like QueryHandle or simply Query).

This will require some refactoring of the current code to share fetching and polling logic between observers, but that actually seems like a better design anyway.

const handle = queryManager.watchQuery({ query });
handle.refetch();
handle.startPolling();
handle.stopPolling();

[jbaxleyiii]

@martijnwalraven I'm all for it!

[stubailo]

@Urigo, @kamilkisiela I think we should fix this ASAP. I was just talking to @purban and it's a bit weird because people from Angular 2 are going to be expecting RxJS, not a regular old observable. With this merged, at least we can implement a feature to replace the observable shim with Rx.

[kamilkisiela]

Maybe you guys will be interested in it.

Here's an implementation of QueryObservable that works with RxJS.

---

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/from';

const origin = client.watchQuery(options); // QueryObservable
const obs = Observable.from(origin);

origin.refetch(); // works
obs.refetch(); // refetch is undefined
obs.ish.refetch(); // works (it should) because `ish` is a reference to `origin`

To solve that problem I created a custom observable called ApolloQueryObservable that extends Observable from RxJS. QueryObservable is being hold under apollo property. This way I could create methods like refetch(), startPolling(), stopPolling().

---

import 'rxjs';
import { ApolloQueryObservable } from 'angular2-apollo';

const origin = client.watchQuery(options); // QueryObservable
const obs = new ApolloQueryObservable(origin);

origin.refetch(); // works
obs.refetch(); // works

obs.map(customMapFunction).refetch() // refetch is undefined

As you can see, it still won't work with operators. Here's why.

Every operator uses Observable.lift() method, for example map().

Observable.lift() creates new Observable, then assigns the current observable under source property. Here the moment where our custom methods (refetch etc) are being dropped.

I solved this by overwriting lift() method.

---

@stubailo @martijnwalraven @jbaxleyiii @Urigo I was thinking about moving this ApolloQueryObservable (in different name, whatever) to ApolloClient, because it's not angular2 specific and will help a lot of people, I think.

[stubailo]

Hmm, sounds like this could be a good idea. Could you open a new issue with some details about how ApolloQueryObservable works?

[kamilkisiela]

#430