Reflect.getMetadata is returning undefined

Question

Introduction:

I am currently using the new experiment decorators as they provide very nice qualify of life changes espescially to avoid making files/configuratoin files specifically aimed for specific stuff.

Anyways, one duty that I'm tasked with is being able to determine the type of a property soely by the propertyName.

In this case I want to use decorators to look at the property, look at the typescript type, and then be able to conditionally render inputs based on the typescript type.

How I approach attempting to get type information:

I've been looking at this stackoverflow question: How to get type data in TypeScript decorator?

WHo seems to have gotten his code from this guide: http://blog.wolksoftware.com/decorators-metadata-reflection-in-typescript-from-novice-to-expert-part-4#a-obtaining-type-metadata-using-the-reflect-m_2

They have their decorator function:

 function logType(target : any, key : string) {
      var t = Reflect.getMetadata("design:type", target, key);
      console.log(`${key} type: ${t.name}`);
    }

And then they have their class Demo:

class Demo{ 
      @logType // apply property decorator
      public attr1 : string;
    }

And supposedly once it's executed it prints out:

attr1 type: String

I have attempted to setup something similar: Here is my Decorator Function:

export const createTrailerPropertySaveDataType = (instance: any, propertyName: string) => {
    var rawType = Reflect.getMetadata('design:type', instance, propertyName);
    console.log('RAW TYPE');
    console.log(rawType);
    console.log('TYPE OF RAW TYPE');
    console.log(typeof rawType);
    // propertyNameToDataType[propertyName] = ;
    // console.log('CREATE Categorization Test');
};

Here is part of the class I want to be able to get the type from:

 @createTrailerPropertySaveDataType
    vin: string;

The Problem:

When I run the debugger, I see that after exectuing the Reflection line that the result is undefined.

Also to note, I've noticed an odd quirk where the decorators won't function unless I call a function from the model they are based in.

Thus I've added a static method below:

static init() {
        return 0;
    }

This is called when the App.tsx gets rendered if I remove the static function from my experince the decorators don't fire

Additional Note I found about Decorator Functions

Additionaly as per requested from the resource I have ensured emitDecoratorMetadata and experimentalDecorators are set to true under Compiler Options

Other Resources I've found but not the solution

• I found this: Typescript emits no decorator metadata

  But the solution in this was referring to a member not being decorated when trying to be access but my member is definitely decorated

• I also looked at this PR: https://github.com/rbuckton/reflect-metadata/issues/12

  It is similar where the result is giving undefined but in their case they stated it was because they used a type that was declared after the current class.

  If that does become a problem I was thinking I could try to reference the types before the static init method I showed.

  However that doesn't apply to my current problem as the type of the property I'm trying to read is string which shouldn't have to be defined from my understanding.

• I also found this question but it doesn't have a resolution: Reflect.getMetadata() returns undefined although metadata is set

Final Words

After looking around without a solution I decided to post a question. I had already send a request to Typescript Discord while I was researching so I just decided to mostly copy and paste that here.

Please let me know if any more information is needed.

I can't share the complete repository as it's for work. Thus I can share the portions that are relevant and in my head would affect this situation.

I appreciate any feedback and thank you inadvance!

Update

I've been continuing to look into this issue. I've discovered this Github Issue: https://github.com/rbuckton/reflect-metadata/issues/104 It seems to indicate if you are using typescript emitMetadata with create-react-app on a certain version than it's not going to work. From what I read Babel doesn't support the emitMetadata tag so it doesn't include it.

This response: https://github.com/rbuckton/reflect-metadata/issues/104#issuecomment-526994558 Seems to indicate a work around. I will try it out and report back.