使用Protractor识别元素：自动化文本框输入的元素定位求助

Hey there! Let's break down how to target that input element with Protractor so you can automate text input smoothly. Looking at the HTML snippet you shared, here are several solid approaches to locate the element and get the job done:

1. Use the name Attribute (Simplest Option) #

Since your input has a clear name attribute (name="99286434"), this is the most straightforward way to locate it—if this name value stays consistent across page loads:

// Locate the input by its name attribute
const targetInput = element(by.name('99286434'));

// Send your desired text to the input field
targetInput.sendKeys('Your automated input text here');

2. Leverage the ng-model Directive (Angular-Specific & Reliable) #

In Angular apps, the ng-model binding is usually stable (since it ties directly to your data model). This is a great choice if the name attribute might be dynamic:

// Locate by the exact ng-model value
const targetInput = element(by.model('xxx.xxx.xxx'));

// Wait for the element to be interactable first (good practice!)
const EC = protractor.ExpectedConditions;
browser.wait(EC.elementToBeClickable(targetInput), 5000); // Wait up to 5 seconds

// Input your text
targetInput.sendKeys('Automated text content');

3. Combine CSS Selectors for Flexibility #

If single attributes aren't reliable enough, combine multiple stable features (like class names and directives) with a CSS selector:

// Combine class and ng-required attribute for precision
const targetInput = element(by.css('input.form-control[ng-required="cell.field.required"]'));

// Or mix class with ng-model
const targetInput = element(by.css('input.form-control[ng-model="xxx.xxx.xxx"]'));

// Send text once located
targetInput.sendKeys('Your text here');

4. Partial Match for Dynamic ng-model Values #

If the full ng-model string has dynamic parts, use a partial match with CSS:

// Match any input where ng-model contains "xxx.xxx"
const targetInput = element(by.css('input[ng-model*="xxx.xxx"]'));

Quick Important Note #

Your input has ng-disabled="!cell.editable", so make sure the element is actually editable before trying to send text. The elementToBeClickable wait I included earlier handles this by ensuring the element is enabled and ready for interaction.

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