Question

有没有办法从属性装饰器向属性对象添加一个函数。我试图这样做，但无法在装饰器内引用属性的对象。我正在使用Intern js版本4进行UI自动化项目。我已经实现了页面对象模型。我想在这里实现的是

将包含验证消息的div的xpath传递给page对象文本框通过属性装饰。
从属性装饰器内部，在文本框的页面对象中添加一个函数从该div获取可见文本。

这是我迄今为止所做的尝试：

ClientPage.ts

export class ClientPage extends AbstractSearchPage implements LandingPage {
  @Validate({xpath: '//sumit/shrestha'})
  public clientId: TextBox;
  constructor(remote: any) {
    super(remote)
    this.clientId = new TextBox(remote,'//*[@id="clientId"]')
    this.dataGrid = new DataGrid(remote, '//table[@id="Table"]')
    this.searchBtn = '//*[@id="search"]';
  }

  getPageUrl(): string {
    return '#/clients/clients'
  };
}

TextBox.ts

export class TextBox extends InputElement {
constructor(remote: any, locator: any) {
    super(remote, locator);
}
async  enterValue(input: string) {
    await this.remote.findByXpath(this.locator).clearValue().type(input);
}
async  clearValue() {
    await this.remote.findByXpath(this.locator).clearValue()
    // return Promise.resolve(this);
}
}

Validate.ts

export function Validate(config: any) {
var remote = getRemote();
return function (target: Object, property: string | symbol) {
    /*
   // I thought target is reference to Textbox object but it refers to 
   // ClientPage object and even clientpage object here (target) shows only 
   // functions when doing console.log(target)
    */
    console.log(config.xpath)
    target.prototype.requiredFieldValidation = async function (): Promise<string> {
        await target.enterValue('ddd')
        await  target.clearValue('ddd')
        return await remote.findByXpath(config.xpath).getVisibleText();
    }
}
}

Answer 1

target是ClientPage的原型。您应该了解装饰器的工作原理。例如，请参阅my article（rus）。

如果要将对象添加到对象中，存储在字段中，有两种方法。

第一种方法 - 定义get / set访问器，当赋值给property时，将函数添加到该值。

export function Validate(config: any) {
    var remote = getRemote();
    return function (target: Object, property: string | symbol) {
        // Create get/set accessors for the property
        let value;
        let propertyDescription = {
            get: function() { 
                return value;
            },
            set: function(textBox) {
                value = textBox;
                // When textBox assigned to property, add function to object
                textBox.requiredFieldValidation = async function (): Promise<string> {
                    await this.enterValue('ddd')
                    await  this.clearValue('ddd')
                    return await remote.findByXpath(config.xpath).getVisibleText();
                }
            },
            configurable: true,
            enumerable: true
        };            
        Object.defineProperty(target, property, propertyDescription);
    }
}

有working example

第二种方法，使用reflect-metadata获取属性类型（类Constructor），并在其原型中定义函数。您可以在example from the article中找到使用reflect-metadata的示例。它使用类型信息来执行依赖注入。

通过typescript

1 个答案: