使用ng-repeat可定位元素，换用virtual repeat后测试代码失效求助

嘿，这个坑我踩过！当开发把ng-repeat换成虚拟滚动组件（比如Angular Material的md-virtual-repeat或者Angular CDK的cdk-virtual-scroll-viewport）后，你原来用by.repeater()的测试代码直接失效，原因很简单：

虚拟滚动组件不会一次性渲染所有列表项，只会渲染当前视口内可见的元素；而且它不像ng-repeat那样暴露store in ui.stores这样的重复器绑定，所以by.repeater()根本找不到任何元素，自然就报「Index out of bound」了。

解决步骤和修改后的测试代码 #

1. 替换定位器：用CSS/XPath替代by.repeater()
   直接定位虚拟滚动容器内的列表项元素，比如假设每个store项都有类名.store-item，或者你可以根据组件结构写更精确的选择器：

2. 处理元素可见性：滚动到目标元素（如果需要）
   因为虚拟滚动只渲染可见元素，如果目标元素不在当前视口，必须先滚动到对应位置才能定位到它。

修改后的测试代码示例（以Angular Material的md-virtual-repeat为例）：

// 定位虚拟滚动容器
const virtualScrollContainer = element(by.css('md-virtual-repeat-container'));

// 滚动容器，确保目标元素被渲染（如果初始不可见的话）
virtualScrollContainer.sendKeys(protractor.Key.PAGE_DOWN);

// 改用CSS选择器定位所有store项
const storeItems = element.all(by.css('.store-item'));

// 现在执行你的断言
expect(storeItems.count()).toEqual(1);
expect(storeItems.get(0).getText()).toContain('Prahran');

额外注意事项 #

• 如果用的是Angular CDK的虚拟滚动，容器选择器要换成cdk-virtual-scroll-viewport；
• 如果你不确定列表项的选择器，可以打开浏览器开发者工具，查看虚拟滚动渲染出来的DOM结构，找到每个store项的专属标识；
• 避免依赖by.repeater()定位虚拟滚动的元素——所有虚拟滚动组件都不支持这个定位器，必须用原生的CSS/XPath。

内容的提问来源于stack exchange，提问作者user9793769