Limit the parameter of a TypeScript method decorator based on the method's type

Question

Limit the parameter of a TypeScript method decorator based on the method's type

Is it possible to generically restrict the argument of a method decorator based on the type of the method it is applied to?

I attempted to obtain the method's type that the decorator is applied to using

TypedPropertyDescriptor<Method>

. However, the type system did not raise any errors.

function MyCache<Method extends (...args: any[]) => Promise<any>>(keyFn: (...args: Parameters<Method>) => string) {
  return function (target: object, methodName: string, descriptor: TypedPropertyDescriptor<Method>) {
    const originalMethod = descriptor.value;

    descriptor.value = function (...args: Parameters<Method>) {
      const cacheKey = keyFn(...args);
      return originalMethod?.apply(this, args);
    } as Method;
  };
}

class CounterService {
  // There should be an error because the function signature does not match the argument list of the method
  @MyCache((id: string) => `test-${id}`)
  async getCounter(config: { valid: boolean }, value: number): Promise<number> {
    return 0;
  }
}

Test it out here Typescript Playground

typescript typescript-generics typescript-decorator

Answer 1

Answer №1

It is important to shift your perspective slightly. Instead of confining the argument within the decorator, focus on restricting the method to which the decorator is applied. This distinction arises from the sequence in which the decorator factory function call and the resulting decorator are validated against the target.

The initial adjustment entails eliminating the reliance on Parameters, as it interferes with inference based on the arguments supplied to MyCache. By modifying the type argument of TypedPropertyDescriptor, we can trigger the intended error:

function MyCache<A extends any[]>(
    keyFn: (...args: A) => string
) {
    return function (target: object, methodName: string, descriptor: TypedPropertyDescriptor<(...args: A) => Promise<any>>) {
        const originalMethod = descriptor.value;

        descriptor.value = function (...args: A) {
            const cacheKey = keyFn(...args);
            return originalMethod!.apply(this, args);
        };
    };
}

class CounterService {
    // Error
    @MyCache((id: string) => `test-${id}`)
    async getCounter(config: { valid: boolean }, value: number): Promise<number> {
        return 0;
    }

    // ok
    @MyCache((id: string) => `test-${id}`)
    async getCounter2(id: string): Promise<number> {
        return 0;
    }
}

Playground Link

Answer 2

It is important to shift your perspective slightly. Instead of confining the argument within the decorator, focus on restricting the method to which the decorator is applied. This distinction arises from the sequence in which the decorator factory function call and the resulting decorator are validated against the target.

The initial adjustment entails eliminating the reliance on Parameters, as it interferes with inference based on the arguments supplied to MyCache. By modifying the type argument of TypedPropertyDescriptor, we can trigger the intended error:

function MyCache<A extends any[]>(
    keyFn: (...args: A) => string
) {
    return function (target: object, methodName: string, descriptor: TypedPropertyDescriptor<(...args: A) => Promise<any>>) {
        const originalMethod = descriptor.value;

        descriptor.value = function (...args: A) {
            const cacheKey = keyFn(...args);
            return originalMethod!.apply(this, args);
        };
    };
}

class CounterService {
    // Error
    @MyCache((id: string) => `test-${id}`)
    async getCounter(config: { valid: boolean }, value: number): Promise<number> {
        return 0;
    }

    // ok
    @MyCache((id: string) => `test-${id}`)
    async getCounter2(id: string): Promise<number> {
        return 0;
    }
}

Playground Link

Limit the parameter of a TypeScript method decorator based on the method's type

Answer №1

Similar questions

Assuming control value accessor - redirecting attention

The type '(props: Props) => Element' cannot be assigned to the type 'FunctionComponent<FieldRenderProps<any, HTMLElement>>' in React-final-form

Empty array being returned by Mongoose after calling the populate() function

When defining a stripe in TypeScript using process.env.STRIPE_SECRET_KEY, an error of "string | undefined" is encountered

Unable to access component properties through react-redux

Utilize the authenticated page across various tests in Playwright for efficient testing

Join the Observable in Angular2 Newsletter for the latest updates and tips

Tips for utilizing parameters within SQL Server

Issue with updating component

Incorporating numerous query parameters in Angular version 14

Adjusting the interface of a third-party TypeScript library

Unfortunately, the utilization of an import statement outside a module is restricted when working with Electron

Ensuring that a service is completely initialized before Angular injects it into the system

Tips for storing the device token received from Firebase Cloud Messaging in an Ionic2 application

Check out the uploaded file preview on React Native Expo!

The ES6 import feature conceals the TypeScript definition file

I'm looking for a way to modify the Turkish characters and spaces in the names of JSON data objects. I plan to do this using WebApi

Toggling multiple ions simultaneously does not function independently

Error: The jasmine framework is unable to locate the window object

Whenever signing in with Next Auth, the response consistently exhibits the values of "ok" being false and "status" being 302, even