Getting "element not interactable" for below code

Question

I am trying to click on few elements using below code on one webpage but it gives element is not interactable error. I also applied wait condition but it didn't help.

Here is my code:

driver.get("https://www.cleartrip.com/flights/results?from=BDQ&to=PNQ&depart_date=13/04/2019&adults=1&childs=0&infants=0&class=Economy&airline=&carrier=&intl=n&sd=1555000238907&stops=1&departureTime=0_8");
driver.findElement(By.xpath("//input[@value='1' and @name = 'stops']")).click();
driver.findElement(By.xpath("//input[@value='2' and @name = 'stops']")).click();
driver.findElement(By.xpath("//input[@value='0_8' and @name = 'departureTime']")).click();

error :

FAILED: testFlightSearch
org.openqa.selenium.ElementNotVisibleException: element not interactable
  (Session info: chrome=73.0.3683.86)
  (Driver info: chromedriver=73.0.3683.20 (8e2b610813e167eee3619ac4ce6e42e3ec622017),platform=Windows NT 10.0.17134 x86_64) (WARNING: The server did not provide any stacktrace information)
Command duration or timeout: 0 milliseconds
Build info: version: '3.141.0', revision: '2ecb7d9a', time: '2018-10-31T20:09:30'
System info: host: 'DESKTOP-B0K7HHH', ip: '192.168.43.195', os.name: 'Windows 10', os.arch: 'amd64', os.version: '10.0', java.version: '1.8.0_161'
Driver info: org.openqa.selenium.chrome.ChromeDriver
Capabilities {acceptInsecureCerts: false, acceptSslCerts: false, applicationCacheEnabled: false, browserConnectionEnabled: false, browserName: chrome, chrome: {chromedriverVersion: 73.0.3683.20 (8e2b610813e16..., userDataDir: C:\Users\shakti\AppData\Loc...}, cssSelectorsEnabled: true, databaseEnabled: false, goog:chromeOptions: {debuggerAddress: localhost:62726}, handlesAlerts: true, hasTouchScreen: false, javascriptEnabled: true, locationContextEnabled: true, mobileEmulationEnabled: false, nativeEvents: true, networkConnectionEnabled: false, pageLoadStrategy: normal, platform: XP, platformName: XP, proxy: Proxy(), rotatable: false, setWindowRect: true, strictFileInteractability: false, takesHeapSnapshot: true, takesScreenshot: true, timeouts: {implicit: 0, pageLoad: 300000, script: 30000}, unexpectedAlertBehaviour: ignore, unhandledPromptBehavior: ignore, version: 73.0.3683.86, webStorageEnabled: true}
Session ID: 8931562f8f37533e51073920887d83b0

Answer 1

The elements that you are trying the click are present on the page but are not clickable/interactable and that's the reason you are getting element not interactable exception.

You need to pick elements by using the xpath mentioned below and it would work:

driver.get("https://www.cleartrip.com/flights/results?from=BDQ&to=PNQ&depart_date=13/04/2019&adults=1&childs=0&infants=0&class=Economy&airline=&carrier=&intl=n&sd=1555000238907&stops=1&departureTime=0_8");
driver.findElement(By.xpath("//label[@for='1_1_1']")).click();
driver.findElement(By.xpath("//label[@for='1_1_2']")).click();
driver.findElement(By.xpath("//label[@for='1_1_0_8_departureTime']")).click();

Answer 2

The reason why you are getting org.openqa.selenium.ElementNotVisibleException is because when selenium goes to that URL, there is a progress bar on top of page which is still loading contents of the page. While it is loading, your code is searching for first element to click but it has not yet been loaded in the DOM.

You need to wait for the progress bar to complete loading before triggering the element click. The progress bar when loading has xpath: //p[@class='loadState tCenter' and contains(text(), 'Getting prices and availability...')] and after loading completely, the xpath to look for is //p[@class='loadState tCenter' and contains(text(), 'Your search results are ready.')].

Add a wait for element to appear for the 2nd xpath above and once it is visible, then trigger the element click.