missing generics in generated typescript file

[Edregol]

Hi there,

first of all, I am working on a windows machine. I got the latest precompiled version of the protoc for windows found on https://github.com/protocolbuffers/protobuf/releases/tag/v3.6.1

I've checked out the grpc-web version e03f5dd and compiled the protoc-gen-grpc-web plugin with bazel myself.

My proto file looks like ths:

service TestProto {
    rpc getTest(TestRequest) returns (TestReply) {}
    rpc getTestStream(TestRequest) returns (stream TestReply) {}
}

message TestRequest {
    int32 id = 1;
}

message TestReply {
    string reply = 1;
}

I am using the npm packages "grpc-web": "1.0.2" and "google-protobuf": "3.6.1"
Now I compile the proto file with :

protoc --proto_path="$protoFilePath/" --js_out="import_style=commonjs:$CurrentOutDir" --grpc-web_out="import_style=commonjs+dts,mode=grpcwebtext:$CurrentOutDir" $protoFile

The following methods will be generated:

getTest(
    request: TestRequest,
    metadata: grpcWeb.Metadata,
    callback: (err: grpcWeb.Error,
      response: TestReply) => void
  ): grpcWeb.ClientReadableStream;

  getTestStream(
    request: TestRequest,
    metadata: grpcWeb.Metadata
  ): grpcWeb.ClientReadableStream;

Which gets me a compiler error Generic type 'ClientReadableStream' requires 1 type argument(s). Manually correcting this to grpcWeb.ClientReadableStream<TestReply> solves the issue and renders the code functional again.

There is similar behavior when setting the output to--grpc-web_out="import_style=typescript
Which generates the following method:

getTestStream(
    request: TestRequest,
    metadata: grpcWeb.Metadata) {
    return this.client_.serverStreaming(
      this.hostname_ +
        '/TestProto/getTestStream',
      request,
      metadata,
      this.methodInfogetTestStream);
  }

This gets me this compiler error Argument of type 'TestRequest' is not assignable to parameter of type 'Request'. Property 'cache' is missing in type 'TestRequest'

In order to make this work again I had to update index.d.ts in the grpc-web npm package which exports the following:

export class AbstractClientBase {
rpcCall<Request, Response> [...]
serverStreaming [...]

since serverStreaming doesn't have any generics defined, a wrong type for Request is assumed.
Adding the generic to the serverStreaming method makes everything work again.

export class AbstractClientBase {
[...]
serverStreaming<Request, Response> [...]

I guess this is a bug, or is there anything that I did wrong?

Thanks in advance!

[pumano]

looks like you need to:

1. recompile grpc-web protoc plugin
2. recompile your proto files
3. update grpc-web npm package to latest

And you got what you want.

[ostwsds]

Hi,

I'm pulled, installed and compiled the current versions a minute ago, same problem like discribed.
What I'm doing wrong?

Best Olaf

[Edregol]

looks like you need to:

1. recompile grpc-web protoc plugin
2. recompile your proto files
3. update grpc-web npm package to latest

And you got what you want.

Just did that protoc Version 3.6.1, grpc-web-plugin version 3401083 recompiled js and ts files. npm grpc-web version 1.0.2
Still the same issue.

[shaxbee]

Generated sample files from master in https://github.com/shaxbee/grpc-web-dts-example/blob/master/master/example/example_grpc_web_pb.d.ts seem to have correctly typed ClientReadableStream.

[yinhm]

I have encountered this as well.
protoc --version libprotoc 3.6.1
protoc-gen-grpc-web 1.0.3
grpc-web: ^1.0.3

Error message from tsc

ERROR in proto/ApiServiceClientPb.ts(116,7): error TS2345: Argument of type 'Sub' is not assignable to parameter of type 'Request'.
  Property 'cache' is missing in type 'Sub'.
proto/ApiServiceClientPb.ts(289,7): error TS2345: Argument of type 'Range' is not assignable to parameter of type 'Request'.
  Property 'cache' is missing in type 'Range'.

[acomagu]

Same issue.
Could anyone solve it?

[acomagu]

I created minimal reproduction on Docker(build).
protobuf: 1.0.3, protoc-gen-grpc-web: 1.0.3, typescript: latest(npm), grpc-web: latest(npm)
protofile: helloworld example.

FROM alpine
RUN apk add curl git nodejs npm libc6-compat
RUN curl -OL https://github.com/protocolbuffers/protobuf/releases/download/v3.6.1/protoc-3.6.1-linux-x86_64.zip && \
    curl -OL https://github.com/grpc/grpc-web/releases/download/1.0.3/protoc-gen-grpc-web-1.0.3-linux-x86_64
RUN unzip -o protoc-3.6.1-linux-x86_64.zip -d /usr/local bin/protoc && \
    chmod +x protoc-gen-grpc-web-1.0.3-linux-x86_64 && \
    mv protoc-gen-grpc-web-1.0.3-linux-x86_64 /usr/local/bin/protoc-gen-grpc-web && \
    git clone https://github.com/grpc/grpc-web
WORKDIR grpc-web/net/grpc/gateway/examples/helloworld
RUN npm install typescript grpc-web google-protobuf && \
    protoc helloworld.proto  --js_out=import_style=commonjs:. --grpc-web_out=import_style=typescript,mode=grpcwebtext:. && \
    node_modules/.bin/tsc helloworld_pb.d.ts HelloworldServiceClientPb.ts

Build the above Dockerfile(by docker build .) and an error can be seen:

HelloworldServiceClientPb.ts(70,7): error TS2345: Argument of type 'RepeatHelloRequest' is not assignable to parameter of type 'Request'.
  Type 'RepeatHelloRequest' is missing the following properties from type 'Request': cache, credentials, destination, headers, and 19 more.

[shaxbee]

@acomagu fix is not released yet, try building grpc-web protoc plugin from master.

[tumasgiu]

Same issue here, using grpc-web protoc plugin compiled from master, protoc 3.6.1, and npm module grpc-web 1.0.3.

The problem actually lies in the the grpc-web npm module 1.0.3 which the generated code inherits from:

export class AbstractClientBase {
    rpcCall<Request, Response> (method: string,
             request: Request,
             metadata: Metadata,
             methodInfo: AbstractClientBase.MethodInfo<Request, Response>,
             callback: (err: Error, response: Response) => void
            ): ClientReadableStream<Response>;

    serverStreaming (method: string,
                     request: Request,
                     metadata: Metadata,
                     methodInfo: AbstractClientBase.MethodInfo<Request, Response>
                    ): ClientReadableStream<Response>;
    }
}

I can see it is fixed in the master branch, but I don't know how I can install a master version of grpc-web via npm so until the next version is released I just modify node_modules/grpc-web/index.d.ts manually in order to get it to compile :

export class AbstractClientBase {
    rpcCall<Request, Response> (method: string,
             request: Request,
             metadata: Metadata,
             methodInfo: AbstractClientBase.MethodInfo<Request, Response>,
             callback: (err: Error, response: Response) => void
            ): ClientReadableStream<Response>;

    serverStreaming<Request, Response> (method: string,
                     request: Request,
                     metadata: Metadata,
                     methodInfo: AbstractClientBase.MethodInfo<Request, Response>
                    ): ClientReadableStream<Response>;
  }
}

Less than ideal - open to suggestions if anyone has a better solution - but at least I'm unstuck.
Hopes it helps anyone that might end up here.

[iiian]

what is the status of this issue? I am getting the same error :/

[iiian]

nevermind, was able to resolve my issue by opting for --grpc-web_out=import_style=commonjs+dts instead of --grpc-web_out=import_style=typescript