React.js 如何定义自定义id,而不是在html中显示

如何更改 React.js 应用程序以停止随机分配 inputId,以便 Selenium 能够始终如一地工作?


我正在使用 Selenium 和 React.js 应用程序。该应用程序一直在开发中。我有一个 Selenium 方法,可以使用一个可重用的方法随机选择反应下拉列表,但是反应下拉列表的 id 由于某种原因不断变化,可能是每次构建应用程序时,所以这会为 Selenium 测试创建返工。


Selenium 方法:(在 JAVA 中)


除了那些 react-select inputIds 改变之外,这个方法可以在反应下拉列表中随机选择选项,但它需要被清理。无论是否已经通过导航选择了一个选项,它都会选择一个选项,然后返回下拉菜单。


public String RandomSelect(WebDriver mydriver, String myid)

{

try{

Actions actions = new Actions(mydriver);

actions.pause(300);

WebElement dropdown = mydriver.findElement(By.id(myid));

String scrollElementIntoMiddle = "var viewPortHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);" +"var elementTop = arguments[0].getBoundingClientRect().top;"+"window.scrollBy(0, elementTop-(viewPortHeight/2));";

((JavascriptExecutor) mydriver).executeScript(scrollElementIntoMiddle, dropdown);


//((JavascriptExecutor) mydriver).executeScript(

// "arguments[0].scrollIntoView();", dropdown); 


actions.moveToElement(dropdown).click().build().perform();

actions.pause(1000);

actions.sendKeys(Keys.DELETE).build().perform();

actions.pause(1000);

actions.sendKeys(Keys.TAB).build().perform();

actions.pause(1000);

actions.moveToElement(dropdown).click().build().perform();

actions.pause(1000);

//  actions.pause(3000);

//actions.sendKeys(Keys.DELETE);

WebDriverWait wait = new WebDriverWait(mydriver, 10);

wait.until(ExpectedConditions.elementToBeClickable(By.className("Select-option")));

List<WebElement> options = mydriver.findElements(By.className("Select-option"));

List<String> stroptions = new ArrayList<>();

System.out.println(options.size());

for (WebElement option: options) 


使用硒方法:


做这样的事情 100 次比键入所有 Selenium 方法 100 次要容易。


WebDriver driver;

driver = new EdgeDriver();

ReactDropdown mydropdown = new ReactDropdown();

mydropdown.RandomSelect(driver, "react-select-1--value");

如何删除动态分配的“react-select-1--value”并将 id 定义为更直观的东西,如“mydropdown--value”,以便每次应用程序构建时都维护 id?


暮色呼如
浏览 222回答 2
2回答

吃鸡游戏

您可以将 xpath 用作 -//span[@class='Select-multi-value-wrapper' 和 @id[starts-with(@id,'react-select')

蓝山帝景

我自己找到了一个解决方案,inputId 是制作唯一 id 并删除 react-select 丑陋的关键。这是一个例子......import React from 'react';import Select from 'react-select';const options = [{ value: 'chocolate', label: 'Chocolate' },{ value: 'strawberry', label: 'Strawberry' },{ value: 'vanilla', label: 'Vanilla' }];export class Counter extends React.Component {state = {&nbsp; &nbsp; selectedOption: null,}handleChange = (selectedOption) => {&nbsp; &nbsp; this.setState({ selectedOption });&nbsp; &nbsp; console.log(`Option selected:`, selectedOption);}render() {&nbsp; &nbsp; const { selectedOption } = this.state;&nbsp; &nbsp; return (&nbsp; &nbsp; &nbsp; &nbsp; <Select&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; value={selectedOption}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; inputId="mydropdown"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onChange={this.handleChange}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; options={options}&nbsp; &nbsp; &nbsp; &nbsp; />&nbsp; &nbsp; );}}静态定义 inputId 后,我的 Selenium 方法似乎效果更好。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Java