Injecting accessToken in http.request, pipe() not called

I am trying to set an header dynamicaly with an access token with a call like this :

const requestObs = from( options.assets ? Promise.resolve(new HttpHeaders({})) : this.getHeaders(options.headers) ).pipe( concatMap((headers: HttpHeaders) => { const url = path.includes("http") || options.assets ? path : `${this.baseUrl}/${path}`; const opts = this.getOptions(headers, options); return this.http.request(method, url, opts); }) );

The accessToken is not available immediately so I want my getHeaders() function to wait before making the call

My getHeader

protected getHeaders(otherHeaders?: HttpClientOptions["headers"]): Promise<HttpHeaders> { this.environment.authService.getaccessTokenObs().subscribe(token =>{ console.log("FullHttpService token SUBSCRIBE ", token.accessToken);//works }); return lastValueFrom(this.environment.authService.getaccessTokenObs().pipe( switchMap(token => { console.log("FullHttpService token PIPE ", token.accessToken); return Promise.resolve(new HttpHeaders({ authorization: `Bearer ${token.accessToken}` })); })));

The log inside the subscribe() is displayed but when I am using a pipe/switchMap/concatMap the code is never called

Note, I tried using an httpInterceptor and the issue is the same : The code inside pipe() is never called:

Code in the intercept :

return this.authService.getaccessTokenObs().pipe( mergeMap((token) => { console.log("Interceptor token INTERCEPTOR ", token.accessToken); request = request.clone( { setHeaders: { Authorization: `Bearer ${token.accessToken}` } }); return next.handle(request); }) )