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;
}