How to iterate through Page Object selectors declared in the constructor (剧作家)

Question

我有一个网页，我在其中定义了过滤器的数量。为单个过滤器选择值会立即影响显示的结果。我正在尝试定义一个函数，它将遍历每个过滤器，断言结果已更新，然后清理过滤器。将为每个过滤器执行此操作。

执行迭代的那一刻给我带来了麻烦。我对定义我的选择器的任何其他方法持开放态度，只要它实现了目标。

这是我的页面类：

import { Page, Locator} from '@playwright/test'

export Class MyPage {
   readonly page: Page;
   readonly filterA: Locator;
   readonly filterB: Locator;
   readonly filterC: Locator;
   ...and so on...
}

constructor(page: Page) {
   this.page = page;
   this.filterA = page.getByTestId('filterA');
   this.filterB = page.getByTestId('filterB');
   this.filterC = page.getByTestId('filterC');
   ...and so on...
}

async applySingleFilter() {

   const filterWithValues = {
        filterA: "1",
        filterB: "2",
        filterC: "3"
   }
 
   let filter: any = null;
   for (filter in filtersWithValues) {
       this.hereMyProblem.selectOption(filtersWithValues[filter])
   }
   // next action that will happen within this method:
   // assert that filter affected shown results
   // perform cleaning the filter
}

1. 我尝试将构造函数中的选择器放入数组中，但我无法在 this.heresMyProblem.selectOption(filtersWithValues[filter]) 中引用它们