Other Text Elements - Instructions

Event enabled examples of some specific text input elements.

The page shows controls that send a text value to the server.

A textarea and a multiple select list and a single select drop down.

These all have a set of list items that show the events that are triggered.

Text Area

Text area allows editing larger text values. It can be configured to allow the user to resize it.

One of the textarea has a maxlength attribute to limit the amount of characters that can be input to 40. This offers some input validation but it is very easy to amend the DOM to remove or amend this value, so it should never be the only source of length validation used for the value.

Select Controls

The select controls allow the user to choose from a specific set of inputs from the list.

Explore the Events on the Controls

For each of the controls you are encouraged to interact with them using they keyboard and the mouse to see what events fire for each control.

Try tabbing between the controls and using keyboard.

Make sure you know how to select multiple values as a ‘chunk’ using the shift key and discontinuously using the ctrl key.

Automating

For each of the controls.

  • Try to automate them with your tool of choice.
  • You can use the event listing to assert on, or assert on the value and state from the control itself.
  • Select different combinations of values from the multi-select.
  • Input multi-line text into the text area.

You can learn more about Testing Input Elements in our reference section.