Test selection attribute

[spalger]

We need to choose a way to support selecting elements from with tests. Currently we do this with a combination of CSS selectors and id's, but those have well established issues. In order to circuvent those
issues @epixa suggested we use data attributes (see) to select the elements.

@Bargs suggested we stick with the data-* prefix but pick a name that obviously maps the attribute to it's intended purpose: providing selectors for tests.

Thoughts? Please extend the lists below or comment and a contributor will add your suggestion to the list.

Goals of the selector:

• portray "test selectors" to keep it decoupled from all other uses
• supports multiple values (space separated like class)
• values are not globally unique

Options:

• data-tselect
• data-testselect
• data-purpose
• purpose
• data-test-roles
• data-test-subject
• data-test-subj

[spalger]

I'm currently leaning towards data-test-roles

[BigFunger]

If you're leaning toward data-test-roles, should that be singular? (similar to the class attribute)

[spalger]

I'm open to that, but as I'm starting to use it in a test I don't really like how it looks as a helper function: $.findTestRoles('link appLink')

[BigFunger]

@spalger / @LeeDr would it be beneficial to mock up an example?

[spalger]

I'm working it into a pr right now

[Bargs]

data-test-subject?

e.g. $.findTestSubjects('link appLink')

[spalger]

I like subject, maybe we can abbreviate?

[simianhacker]

+1 on data-test-subject

[cjcenizal]

Closing this because we're using [data-test-subj].