interceptBefore not called

[jogelin]

I am working on an app which is transpiled to es5 and there is something that I don't understand (sorry in advance if my question is stupid).

I created my own interceptor and I added to the the interceptor service :

export class TimeoutInterceptor implements Interceptor {

     private _timeout: number = 1;

     public interceptBefore(request: InterceptedRequest): Observable<InterceptedRequest> {
         return Observable.of<InterceptedRequest>(request)
             .timeout(this._timeout);
     }

     public interceptAfter(response: InterceptedResponse): InterceptedResponse {
         return response;
     }
 }

But in the interceptor-service.js file at the line 176 there is a test
if (!bf.interceptBefore)
and it returns undefined.

When I debug I see my interceptor in the list and I see in the prototype of it the correct function. If I debug bf.prototype.interceptBefore the function exists :

bf: TimeoutInterceptor()
   arguments:(...)
   caller:(...)
   length:0
   name:"TimeoutInterceptor"
   prototype:Object
       constructor:
       TimeoutInterceptor()
       interceptAfter:(response)
       interceptBefore:(request)
       __proto__:Object
   __proto__:()
   [[FunctionLocation]]:timeout.interceptor.ts:4
   [[Scopes]]:Scopes[2]

Thank you in advance

[jfcere]

@jogelin I had the same issue and fixed it by creating a new instance or the interceptor class to pass to the InterceptorService.addInterceptor() method.

export function interceptorFactory(xhrBackend: XHRBackend, requestOptions: RequestOptions){
  const service = new InterceptorService(xhrBackend, requestOptions);
  service.addInterceptor(new ServerURLInterceptor()); // create new instance of ServerURLInterceptor service
  return service;
}