java - How to use Selenium and Java to interact with dynamic web element?

Question

I want to use Selenium to interact with an element on a website. This element contains further content depending on the user's behavior, but obviously has exactly one HTML-element the whole time.

The element looks like this when the mouse is not on top of it:

When the mouse is on top of it, it looks like this:

When the user clicks on the down arrow, other content is visualized:

As you can see it contains even more logic, I didn't add screenshots for it though.

The corresponding HTML code is that, nothing more:

I do not know how this content is created. Does anybody know how I can use Selenium and java to interact with that web element? Selenium is obviously restricted to HTML content - what can I do without trying any dirty hacks like positioning the mouse at a certain position on the element myself to trigger the different visualization?

Update I want to do automated end-to-end testing. That means I need to programmatically use the buttons of the web element as a user would:

1. Delete the date by clicking the x button
2. Alter the date by clicking up and down buttons
3. Alter the date by using the calender component
4. Changing the text in the web element (I guess I might already be able to do that with my current knowledge of Selenium)

标签： javaseleniumweb-applicationsautomated-tests

Answer 1

I talked to the developer of that application and he told me he actually just adds one HTML input element of type date to the application. The rest (i.e. the renderer/editor of that input field as I presented in the question above) is totaly browser-specific. It looks like that in Chrome and entirely different in Firefox.

The above described web element seems to be the regular HTML 5 DateTime selection in Chrome. With that knowledge you can find the web element yourself and a tutorial for Selenium here: https://www.guru99.com/handling-date-time-picker-using-selenium.html and another discussion similar to my question here: How to set HTML5 type="date" input fields (e.g. in Chrome) using Selenium/Protractor?

The guru-page obviously describes how to control the full web element and it seems to work. I will check this out and accept this as the answer for now. Thanks everyone for your time!