TypeError: Object is not a function issue when Object message exists in proto file

[larscliff]

Hello everyone, and thank you for this library!

I have encountered an issue with a proto file that includes an "Object" message (yes, I know that is not a good name for the message, but it is what it is). For the sake of simplicity, it looks like this:

syntax = "proto3";

message Object {
     string object_id = 1;
}   

message ObjectList {
    repeated Object object = 1;
}

message RequestMessage {
}

service TestService {
    rpc Get(RequestMessage) returns (Object);
    rpc GetAll(RequestMessage) returns (ObjectList);
}

When I run my React app which is build with CRA I got this error:

Any ideas how to resolve the issue? Except message renaming :)
I did not have this problem using protoc-gen-grpc-web protoc plugin.

[James Wyatt Cready-Pyle]

Can you provide more details for how to reproduce this issue (protoc args, tsconfig, etc.)? As far as I know name clashes with global/reserved identifiers is already taken care of and it's totally valid to have an export like: export const Object = new Object$Type(); and import it in other files

import { MessageType } from '@protobuf-ts/runtime';
import { Object } from '../example';

console.log('Object instanceof MessageType', Object instanceof MessageType);
console.log(Object.create());

[larscliff]

@jcready Thank you for your reply. I have this issue in my old project which is quite complex. I will try to create a small demo and let you know.

[James Wyatt Cready-Pyle]

Also, if you could show what the "View compiled" (at the bottom of your screenshot) shows that would also help. FWIW it seems like the reported error message shown isn't lining up correctly (e.g. imperfect sourcemap mapping) based on the fact that the line shown doesn't use a runtime Object identifier at all.

[larscliff]

I was able to reproduce the issue. You can find the application code here:
https://github.com/larscliff/protobuf-ts-object-issue

So far, I've found two ways to work around the problem. Either update the React version to 18 or remove ">0.2%" from the development section in package.json.

I don't know, perhaps there's a better solution?

[James Wyatt Cready-Pyle]

Yeah, it looks like a bug with webpack where it seems to incorrectly assume that the in-scope Object identifier will always be referencing the global Object class when that isn't the case.

It looks like you might be able to adjust the webpack config to disable the Object(...) wrapping which is the source of the issue: webpack/webpack#5600 (comment)