Is it good practice to give id attributes to html elements that should only be used for testing purposes?

Suppose I have a form like this:

<form action="/foo" method="POST"> <input type="text" name="username"> <input type="text" name="password"> <input type="submit" value="Login"> </form> 

In my case, I do not need to specify the id attribute to any of the input tags. It is not stylized with CSS, there is no link to javascript, etc. However, there is a QA department that would love it if it had a hard id code, such as a login-button, so that their automated test would remain stable.

CONS . As a developer, I am very skeptical about adding id attributes that do not have a functional purpose.

  • I think this is cluttering up the code.
  • It confuses future developers.
  • Ties us to which testing tool is being used at that time.
  • Binds us to coding outside the product code.
  • A slippery slope of the code begins, knowing something about how it will be tested, and vice versa.

PROFI : From a QA perspective, I can certainly sympathize with this:

  • simplify your work.
  • provide stability (in the short term)

Can I get more help on the pros / cons lists that I started here?

+4
source share
4 answers

One important functional reason for including id attributes on form inputs is that you can explicitly associate the corresponding label elements with the inputs:

 <form action="/foo" method="POST"> <label for="username">User Name</label> <input type="text" id="username" name="username"> </form> 

This is important for accessibility and usability. Screen reader users rely on this association to let them know what input they enter. There is also a huge convenience difference when the labels are correctly connected (the user can click on the label to set the focus to the corresponding input). This is really noticeable when typing checkbox and radio .

A script with an example as on the flags . (Note how much easier it is to click on the label, rather than the input itself)

As for your opposition ... I'm not sure if adding id attributes does any of the "minuses" you state. A mess? no, valid useful code. Mixing? nope, id, and properly linked labels would be the first thing I would add if I saw this code. Tied to a testing tool and external code? how exactly? The fact that this makes life easier for your test team is just icing on the cake.

+4
source

If possible, their testing tool should fill in the fields based on their name attributes and form action attribute if there are multiple forms on the page. They are guaranteed to be as stable as the part of the server responding to a POST request.

Identifiers, field ordering, and other attributes may change due to front-end considerations.

+3
source

Your first 2 minuses are valid, but I do not agree with the last 3.

You could take the position that you would provide a logical element identifier for your testers, but they are responsible for using them with any testing tools, etc. that they use. This means that you are test / tool agnostic, you simply provide Id for testing, not knowing exactly how they will be used.

Adding an identifier like this is a pretty standard practice for many web applications today.

+3
source

For me it depends. It depends on whether you can easily and reliably find items without an identifier.

In your example, yes, so adding an identifier is not waste, but just not necessary. However, this is all there is, an example.

In many web pages, when they become more complex and complex, the ID becomes your friend, because without it you will need to look for other ways to find elements.

Especially in the Selenium world, when you encounter this problem, you usually turn to CSS and / or XPath selectors.

Other selectors are not bad things, but they can work quite slowly in older browsers if you support them.

0
source

All Articles