Unary interceptors conflicts with gRPC-Web Developer Tools

[BobrovskyiYurii]

I'v found that enabled gRPC-Web Developer Tools (by SafetyCulture) brokes up unary interceptors set up for grpc-web client. Interceptors are being not called when gRPC-Web Developer Tools are enabled.

Issue was found with next code:

const AuthInterceptor = function() {
    this.intercept = function(request, invoker) {
        request.getMetadata().Authorization = AuthService.GetAuthHeaderValue();

        return invoker(request);
    };
};

const options = {"unaryInterceptors": [new AuthInterceptor()]};
const APIClient = new APIPromiseClient(API_URL, null, options);

const enableDevTools = window.__GRPCWEB_DEVTOOLS__ || (() => {});
enableDevTools([
    APIClient,
]);

APIClient.me(new ProtobufEmpty(), {})
    .then(result => {
        ...
    })
    .catch(error => {
        console.error(error);    // <-- when gRPC-Web DevTools are enabled I receive error "no auth header" from my backend
    });

Also, this bug was posted to gRPC-web Developers Tools repo: https://github.com/SafetyCulture/grpc-web-devtools/issues/80 and I think it it rather looks like their job to fix this issue on their side. But I want to warn people here about such compatibleness (so that they do not waste time guessing why their UnaryInterceptors not working).

[subhan-nadeem]

Have been able to replicate this issue. Thanks for highlighting

[jrapoport]

I rewrote the gRPC-Web Developer Tool to use native gRPC-Web interceptors. I'm dropping a link here for anyone that finds this and wants to use it with gRPC-Web interceptors: https://github.com/jrapoport/grpc-web-devtools

This version works as expected when added to a chain with other unary and streaming interceptors. I also made a few other updates and improvements.

I tried opening a PR with SafetyCulture for this change, but never got a response.