My survey page has a first page with "select age" and "select sex". After I select these options, the "Continue" button is displayed, and follow the next page. Every page has a question.
The HTML code is:
<div id="survey-container"><div id="navigation-survey" style="display: none;"><strong>Pas NaN<span> / 11</span></strong><ul><li style="display: none;"><a class="isDisabled">1</a></li><li style="display: none;"><a class="isDisabled">2</a></li><li><a class="isDisabled">3</a></li><li><a class="isDisabled">4</a></li><li><a class="isDisabled">5</a></li><li><a class="isDisabled">6</a></li><li><a class="isDisabled">7</a></li><li><a class="isDisabled">8</a></li><li><a class="isDisabled">9</a></li><li><a class="isDisabled">10</a></li><li><a class="isDisabled">11</a></li><li><a class="isDisabled">12</a></li><li><a class="isDisabled">14</a></li></ul></div> <div class="start-survey-container"><div class="questions columns-2"><div><strong class="title">NaN. Selecteaza varsta</strong> <p class="description" style="display: none;"></p> <div class="question"><strong class="title">Selecteaza varsta</strong> <div class="answers"><label><img class="icon" style="display: none;"> <input type="radio" name="select-1" value="0"> 18-30 </label></div><div class="answers"><label><img class="icon" style="display: none;"> <input type="radio" name="select-1" value="1"> 31-50 </label></div><div class="answers"><label><img class="icon" style="display: none;">
<input type="radio" name="select-1" value="2"> 51-70 </label></div><div class="answers"><label><img class="icon" style="display: none;"> <input type="radio" name="select-1" value="3"> 71- </label></div> </div> <div class="disclaimer" style="display: none;"><label><input type="checkbox" id="disclaimer"> Text</p></div> <div classname="clearfix"></div> <div class="actions"><a id="prev" class="btn gray" style="display: none;"> Inapoi </a> <a id="next" class="btn isDisabled" style="display: none;"> Continua </a></div></div>
<div><strong class="title">NaN. Selecteaza sex</strong> <p class="description" style="display: none;"></p> <div class="question"><strong class="title">Selecteaza sex</strong> <div class="answers"><label><img class="icon" style="display: none;"> <input type="radio" name="select-2" value="0"> Masculin </label></div><div class="answers"><label><img class="icon" style="display: none;"> <input type="radio" name="select-2" value="1"> Feminin </label></div> </div>
The problem is that any locator you create does not access the desired item. Maybe is necessary a wait time after every question?
My locator:
@FindBy(css = "#survey-container input[type='radio'], input[value='0']")
WebElement years;
@FindBy(css = "#survey-container > div.start-survey-container > div.questions.columns-2 > div:nth-child(2) > div.question > div:nth-child(3) > label > input[type=radio]")
WebElement sex;
@FindBy(css = "#survey-container > div.start-survey-container > div.questions.columns-2 > div:nth-child(1) > div.question > div:nth-child(2) > label")
WebElement startSurvey;
Is there an easier way to identify the desired item? You can suggest to me some tutorials anything related to the automation of a survey page?
If the question is not very clear I am grateful if you would tell me how to write good questions, in accordance with the StackOverflow rules. New shot around here. Thanks!
The questions are like: survey
Can you check with below code, I hope this will help
WebElement element = driver.findElement(By.xpath("((//input[@name='select-
1'])[1])"));
WebElement element2 = driver.findElement(By.xpath(((//input[@name='select-
2'])[1])"));
WebElement element3 = driver.findElement(By.xpath("//*[@id='start-
survey']"));
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);
executor.executeScript("arguments[0].click();", element2);
executor.executeScript("arguments[0].click();", element3);
I've used the JavascriptExecutor interface to interact with the element, As earlier, atleast this works, you may enhance it as per your requirement.