I have proto file that contains all the message definitions. I am currently working on a reactjs project in which I want to dynamically use some of these proto models inside js code, and for this I am using the protobufjs library.

I have a function within which I invoke protobuf.load() to create a new object of type defined in the proto file. The code for the function looks something like this:

function doSomething () {
  // This is what I want to return
  let result = [];

  // Load the proto models and extract necessary info
  protobuf.load(protoFile, function(err, root) {
      if (err)
          throw err;
      const someMessageType = root.lookupType("someMessageType");

      // res is actually populated here
      res = Object.keys(someMessageType.fields);
  });

  return res;
}

On calling doSomething(), the result is always an empty array returned as the load function is executed asynchronously (as I understand).

Is there a clean way to make the load execute to completion before the result is returned? It is okay if the UI freezes and it is not a concern.

The protobufjs documentation specifies another syntax

protobuf.load("awesome.proto")
.then(function(root) {
   ...
});

On trying this, I get: Error: illegal token '<' (models.proto, line 1)

I am a novice when it comes to working with js. Any help on this issue would be of great help. Thanks in advance!