Unable to resolve signature of method decorator when called as an expression

by

I am working on a TypeScript project where I am trying to use decorators to add steps to Playwright tests. My goal is to create a custom decorator that wraps methods with Playwright’s test.step function for better logging and readability. However, I am encountering TypeScript errors that I’m unable to resolve.

type GenericFunction = (...args: unknown[]) => unknown;
type ClassesWithStepDecorator = Component;

function step(target: GenericFunction, context: ClassMethodDecoratorContext) {
  return function replacementMethod(this: ClassesWithStepDecorator, ...args: unknown[]) {
    const className = this.constructor.name;
    if (typeof context.name !== 'string') {
      throw new Error('Method name is not a string');
    }

    const methodName = context.name;
    const argsString = args.map(arg => JSON.stringify(arg)).join(', ');

    return test.step(`${className}.${methodName}(${argsString})`, () => {
      return target.call(this, ...args);
    });
  };
}

class Component {
  constructor(private page: Page) {}

  @step
  checkComponent(name: string) {
    expect(name).toEqual('button');
  }
}

"target": "es2018",
"experimentalDecorators": true,
"emitDecoratorMetadata": true

When running this code, it functions as expected in the Playwright environment. However, TypeScript throws the following errors:

 - error TS1241: Unable to resolve signature of method decorator when called as an expression.   Argument of type 'Component' is not assignable to parameter of type 'GenericFunction'.     Type 'Component' provides no match for the signature '(...args: unknown[]): unknown'. 
- error TS1270: Decorator function return type '(this: ClassesWithStepDecorator, ...args: unknown[]) => Promise<unknown>' is not assignable to type 'void | TypedPropertyDescriptor<(name: string) => void>'.

The TypeScript configuration includes "experimentalDecorators": true and "emitDecoratorMetadata": true.

Leave a Comment