fix(api): Testing issue with Observable.create

Author: prog110

README.md

@@ -19,7 +19,9 @@ npm install x-ng4-http-interceptor-dontuse --save
 And it should be importable with webpack out of the box
 
 # Usage
+
 ## Set up InterceptorService
+
 Interceptors are registered when the service is created (to avoid any race-condition). To do so, you have to provide the instance of the service by yourself. So on your module declaration, you should put a provider like:
 
 ```ts
@@ -53,7 +55,9 @@ export function interceptorFactory(xhrBackend: XHRBackend, requestOptions: Reque
 ```
 
 ## Using InterceptorService
+
 Once we have it set up, we can use it in our Controllers as if we were using the default Angular `Http` service:
+
 ```ts
 import { Component } from '@angular/core';
 import { InterceptorService } from 'x-ng4-http-interceptor-dontuse';
@@ -64,21 +68,22 @@ import { InterceptorService } from 'x-ng4-http-interceptor-dontuse';
   moduleId: 'my-module'
 })
 export class MyComponent {
-
-  constructor(
-     private http: InterceptorService) {
-  }
-
-  ngOnInit(){
-    this.http.get("http://www.example.com/").subscribe(
-      (res) => console.log(res),
-      (err) => console.error(err),
-      () => console.log("Yay"));
+  constructor(private http: InterceptorService) {}
+
+  ngOnInit() {
+    this.http
+      .get('http://www.example.com/')
+      .subscribe(
+        res => console.log(res),
+        err => console.error(err),
+        () => console.log('Yay')
+      );
   }
 }
 ```
 
 We can also "cheat" the Injector so that every time we ask for the `Http` we get the `InterceptorService` instead. All we have to do is replace `InterceptorService` on the provider definition for `Http`, and then we can get our service when we use `private http: Http`:
+
 ```ts
 {
   provide: Http,
@@ -88,13 +93,14 @@ We can also "cheat" the Injector so that every time we ask for the `Http` we get
 ```
 
 ## Creating your own Interceptor
+
 Basically, an interceptor has the option to selectively implement one more of the following methods depending on what part of the flow it wants to intercept. i.e modify flow/take action.
 
 Here is the interceptor interface that details which method is invoked in what part of the flow
 
 ```ts
 import { Request, RequestOptionsArgs } from '@angular/http';
-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs/Observable';
 
 import { InterceptorRequest } from './interceptor-request';
 import { InterceptorRequestOptionsArgs } from './interceptor-request-options-args';
@@ -117,14 +123,16 @@ import { InterceptorResponseWrapper } from './interceptor-response-wrapper';
  * as request private storage
  */
 export interface Interceptor {
-
   /**
    * Invoked once for each of the interceptors in the chain; in the order defined in the chain,\
    *  unless any of the earlier interceptors asked to complete the flow/return response/throw error to subscriber
    *
    * Gives the ability to transform the request
    */
-  beforeRequest?(request: InterceptorRequest, interceptorStep: number): Observable<InterceptorRequest> | InterceptorRequest | void;
+  beforeRequest?(
+    request: InterceptorRequest,
+    interceptorStep: number
+  ): Observable<InterceptorRequest> | InterceptorRequest | void;
 
   /**
    * Invoked once for each of the interceptors in the chain; in the reverse order of chain,\
@@ -137,8 +145,10 @@ export interface Interceptor {
    * You can know if the respons is generated by short circuit handler/err handler,\
    *  by looking at the `responseGeneratedByShortCircuitHandler` & `responseGeneratedByErrHandler` flags
    */
-  onResponse?(response: InterceptorResponseWrapper,
-    interceptorStep: number): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
+  onResponse?(
+    response: InterceptorResponseWrapper,
+    interceptorStep: number
+  ): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
 
   /**
    * Invoked once for each of the interceptors in the chain; in the reverse order of chain,\
@@ -148,8 +158,10 @@ export interface Interceptor {
    * If no `onShortCircuit(..)` handlers before this handler returns any response/force request to complete
    * An error will be thrown back to the subscriber
    */
-  onShortCircuit?(response: InterceptorResponseWrapper,
-    interceptorStep: number): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
+  onShortCircuit?(
+    response: InterceptorResponseWrapper,
+    interceptorStep: number
+  ): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
 
   /**
    * Invoked when the flow encounters any error along the interceptor chain.
@@ -160,52 +172,71 @@ export interface Interceptor {
    * If no `onErr(..)` handlers before the first interceptor (last in the response cycle)
    * handler returns any response, the error will be thrown back to the subscriber
    */
-  onErr?(response: InterceptorResponseWrapper,
-    interceptorStep: number): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
+  onErr?(
+    response: InterceptorResponseWrapper,
+    interceptorStep: number
+  ): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void;
 
   /**
    * Invoked when any one in the interceptor chain forces request completion/return response/error
    * Use this method to perform operations that should be performed irrespective of what the other interceptors in the chain does
    * such as stopping progress bar/logging
    */
-  onForceCompleteOrForceReturn?(response: InterceptorResponseWrapper,
-    interceptorStep: number): void;
+  onForceCompleteOrForceReturn?(
+    response: InterceptorResponseWrapper,
+    interceptorStep: number
+  ): void;
 
   /**
    * Invoked when the user unsubscribes while the request is still being handled
    * Use this method to perform cleanup operations that should be performed when the request is cancelled by user
    * such as stopping progress bar
    */
-  onUnsubscribe?(interceptorStep: number, url: string | Request, options?: RequestOptionsArgs | InterceptorRequestOptionsArgs): void;
-
+  onUnsubscribe?(
+    interceptorStep: number,
+    url: string | Request,
+    options?: RequestOptionsArgs | InterceptorRequestOptionsArgs
+  ): void;
 }
 ```
 
 One that will get the request that's about to be sent to the server, and another that will get the response that the server just sent. For that, we just need to create a new class that implements Interceptor:
 
 ```ts
-import { Interceptor, InterceptorRequest, InterceptorResponseWrapper } from 'x-ng4-http-interceptor-dontuse';
+import {
+  Interceptor,
+  InterceptorRequest,
+  InterceptorResponseWrapper
+} from 'x-ng4-http-interceptor-dontuse';
 
 export class ServerURLInterceptor implements Interceptor {
-    beforeRequest(request: InterceptorRequest): Observable<InterceptorRequest> | InterceptorRequest | void {
-        // Do whatever with request, such as chaing request by adding additional headers such as `Content-Type` (or) `Authorization`
-        // refer to jsdoc of each of 'InterceptorRequest' to know the significance of return values & additional features such as short circuiting the whole flow
-        let modifiedOptions: RequestOptionsArgs = addHeaders(request.options);
-        return InterceptorRequestBuilder.from(request)
-          .options(modifiedOptions)
-          .build();
-    }
-
-    onResponse(responseWrapper: InterceptorResponseWrapper, interceptorStep?: number): Observable<InterceptorResponseWrapper> | InterceptorResponseWrapper | void {
-        // Do whatever with responseWrapper: get/edit response
-        // refer to jsdoc of each of 'InterceptorResponseWrapper' to know the significance of return values & additional features such as short circuiting the whole flow
+  beforeRequest(
+    request: InterceptorRequest
+  ): Observable<InterceptorRequest> | InterceptorRequest | void {
+    // Do whatever with request, such as chaing request by adding additional headers such as `Content-Type` (or) `Authorization`
+    // refer to jsdoc of each of 'InterceptorRequest' to know the significance of return values & additional features such as short circuiting the whole flow
+    let modifiedOptions: RequestOptionsArgs = addHeaders(request.options);
+    return InterceptorRequestBuilder.from(request)
+      .options(modifiedOptions)
+      .build();
+  }
 
-        return InterceptorResponseWrapperBuilder.from(responseWrapper)
-          .forceReturnResponse(true)
-          .build();
-    }
+  onResponse(
+    responseWrapper: InterceptorResponseWrapper,
+    interceptorStep?: number
+  ):
+    | Observable<InterceptorResponseWrapper>
+    | InterceptorResponseWrapper
+    | void {
+    // Do whatever with responseWrapper: get/edit response
+    // refer to jsdoc of each of 'InterceptorResponseWrapper' to know the significance of return values & additional features such as short circuiting the whole flow
+
+    return InterceptorResponseWrapperBuilder.from(responseWrapper)
+      .forceReturnResponse(true)
+      .build();
+  }
 
-    // can chose to seletively implement any of the four hooks mentioned in the Interceptor interface
+  // can chose to seletively implement any of the four hooks mentioned in the Interceptor interface
 }
 ```
 
@@ -234,23 +265,27 @@ class InterceptedResponseWrapper {
     // a lot more properties; refer to jsdoc
 }
 ```
+
 `sharedData` on `InterceptorRequest` is guaranteed to be the same of that one of `InterceptedResponseWrapper` for the same call: The stuff you put in `interceptorOptions` while in `interceptBefore` will be available when you get `onResponse(..)` called.
 
 ## Creating one Injectable Interceptor
+
 Interceptors are usually pure classes with pure functions: Given a call, they return a modified one, but sometimes we need these Interceptors to be actual Services to be used all around our application.
 
 For instance, an interceptor that shows a loading spinner every time we have a call has -in some way- to comunicate with the `LoadingComponent` to make the spinner appear/disappear from the screen.
 
 To do that you have to do some steps in the module/factory declaration file:
-1. Create a Service (`@Injectable()` annotation) that implements `Interceptor` and the interceptor methods.
-2. Define his provider before `InterceptorService`
-3. Add it as a parameter to the factory function
-4. Add it to the `deps` array. Note that the order of the elements have to match the one on the factory function.
-5. Add it to the pipeline
+
+1.  Create a Service (`@Injectable()` annotation) that implements `Interceptor` and the interceptor methods.
+2.  Define his provider before `InterceptorService`
+3.  Add it as a parameter to the factory function
+4.  Add it to the `deps` array. Note that the order of the elements have to match the one on the factory function.
+5.  Add it to the pipeline
 
 If you are using the `provideInterceptorService` option (without AoT Compiler support), then you can skip steps 2-4.
 
 If our `ServerURLInterceptor` were a Service, we would have a module declaration like:
+
 ```ts
 import { InterceptorService } from 'x-ng4-http-interceptor-dontuse';
 import { ServerURLInterceptor } from './services/serverURLInterceptor';

src/interceptor-response-wrapper.ts

@@ -5,7 +5,6 @@ import { InterceptorResponseWrapperBuilder } from './interceptor-response-wrappe
 import { InterceptorUtils } from './interceptor-utils';
 
 export class InterceptorResponseWrapper {
-
   /**
    * url which will be cascaded to the final {@code Http} call
    */
@@ -78,6 +77,10 @@ export class InterceptorResponseWrapper {
     return this._url;
   }
 
+  get urlAsStr(): string {
+    return typeof this._url === 'string' ? this._url : this._url.url;
+  }
+
   get options(): any {
     return this._options;
   }
@@ -123,15 +126,20 @@ export class InterceptorResponseWrapper {
   }
 
   isShortCircuited(): boolean {
-    return this._shortCircuitTriggeredBy !== undefined && this._shortCircuitTriggeredBy !== null && !!this._shortCircuitTriggeredBy;
+    return (
+      this._shortCircuitTriggeredBy !== undefined &&
+      this._shortCircuitTriggeredBy !== null &&
+      !!this._shortCircuitTriggeredBy
+    );
   }
 
   circuitShortedByMe(currentStep: number): boolean {
-    return this.isShortCircuited() && this._shortCircuitTriggeredBy === currentStep;
+    return (
+      this.isShortCircuited() && this._shortCircuitTriggeredBy === currentStep
+    );
   }
 
   errThrownByMe(currentStep: number): boolean {
     return !!this._errEncounteredAt && this._errEncounteredAt === currentStep;
   }
-
 }

src/interceptor-service.ts

@@ -90,16 +90,15 @@ export class InterceptorService extends Http {
         (e: Error) => observer.error(e),
         () => observer.complete()
       );
-      observer.add(() => {
+      return function() {
         subscription.unsubscribe();
         for (let index = this.interceptors.length - 1; index >= 0; index--) {
           const interceptor = this.interceptors[index];
           if (interceptor.onUnsubscribe !== undefined) {
             interceptor.onUnsubscribe(index, url, options, reqNum);
           }
         }
-      });
-      return this;
+      };
     });
   }
 
@@ -216,10 +215,6 @@ export class InterceptorService extends Http {
     this._realResponseObservableTransformer = value;
   }
 
-  public newHttpNative(): HttpDirect {
-    return new this.HttpDirect();
-  }
-
   /** Private functions **/
   private httpRequest(
     request: InterceptorRequest,
@@ -268,7 +263,7 @@ export class InterceptorService extends Http {
             response$ = this._realResponseObservableTransformer.transform(
               response$,
               transformedRequest,
-              this.newHttpNative(),
+              new this.HttpDirect(),
               this
             );
           }