Tabbing through fields of the form not working properly

[krchristie]

I don't have time to complete this ticket but wanted to get it on your radar @vanaukenk

I'll complete the ticket later today. -Karen

[vanaukenk]

@krchristie
We also showed this to @tmushayahama on today's workbenches call.

[krchristie]

I would like to be able to tab through the fields of the form in the way that is standard in other webpage forms I've used on many sites. Tabbing through the fields was working well until the recent updates which introduced some odd tabbing behavior.

There are 4 fields in the Activity Unit where pressing the tab key after using the down arrow to highlight an option and then pressing return to select the highlighted option behaves inappropriately and does not go to the next field in the form. Tabbing out of the left-most fields in each row ("enabled by GP", "Molecular Function", "MF part of BP", and "MF occurs in CC") does not go to the desired next field in the form. However, tabbing out of other fields works as expected and goes to the next field in the form, moving across the fields in each row in order, and then to the first field in the next row.

It's worth noting that the behavior of tabbing is different if I click in a field (whether blank or empty) and press the tab key. In this situation, tabbing goes to the next field in the form and you can tab all the way through the form in order. So something about using the down arrow to highlight an autocomplete option and pressing return to select it seems to throw the tabbing off.

I'll put in some screenshots with explanation of exactly what I did to document what I'm seeing (using Firefox) and comment on what would be the expected and desired tabbing behavior.

[krchristie]

Activity Unit Form - tabbing out of the "enabled by (GP)" field

Desired behaviour: Pressing the Tab key 1 time from the "enabled by (GP)" field should go to the "Molecular Function" field.

1. I clicked on the enabled by (GP) field, typed "Ift88 mm" which was enough to give me a single option in the autocomplete, used the down arrow to highlight that option:

2. I hit the Return key to select the highlighted option. The selected option appears in the field, and the field remains highlighted (this is a pic with my phone as moving the mouse at this point in time causeing the highlighting of the selected field to disappear).

3. I hit the Tab key, hoping to tab to the next field in the form: the "Molecular Function" field.

Instead, if this is the first time I have filled out the Activity Unit Form, the highlighted "field" is the set of 9 squares immediately to the right of the Gene Ontology logo. If I clear the form and repeat the above steps without reloading the page, tabbing often ends up in some other field in the header or the left hand bar.

[krchristie]

Activity Unit Form - tabbing through the Functional Description rows

1. I clicked on the Molecular Function field, typed "RNA polymer" which give me several options in the autocomplete, and used the down arrow to highlight the second option:

2. I hit the Return key to select the highlighted option: "RNA polymerase activity". The selected option appears in the field, and the field remains highlighted (this is a pic with my phone as moving the mouse at this stage causes the highlighting of the selected field to disappear):

3. I hit the Tab key, hoping to tab to the next field in the form: the "Evidence" field to the right of the "Molecular Function" field.

Instead, if this is the first time I have filled out the Activity Unit Form, the highlighted "field" is My name and selected source on the far right of the row with the Gene Ontology logo.

4. If I now click back into the "Molecular Function" field, I can tab sequentially into the Evidence field, type "IMP" to bring up a couple options via autocomplete, use the down arrow to highlight the one I want, hit return to select the highlighted option, and hit the tab key to move one field to the right to the "Reference" field.

5. The "Reference" field behaves the same way and tabbing moves to the icon in the lower right of "Reference" field. Hitting the tab key again moves to the "With" field.

6. Tabbing out of the "With" field moves to the circle with three dots at the end of the row. Tabbing again moves the active field to the "(MF) part of (GP)" field.

7. The pattern repeats. If I type something into the "(MF) part of (GP)" field, use the down arrow to select an autocomplete option, and hit return, then tabbing out of the field does not to the Evidence field immediately to the right. However, if this field is already filled and I click in it and then tab, hitting the tab key DOES move the active field to the Evidence field immediately to the right. Then tabbing through the rest of the fields to the right behaves fine even when I am using the down arrow and return keys to select the option I want.

8. The same pattern occurs in the bottom row with the "(MF) occurs in (CC)" field.

[vanaukenk]

Noting that this was also discussed in the meeting about requirements for an updated Noctua standard annotation UI.