Radio buttons not checking when outer circle only is clicked

[charlottewild]

Case with two users who clicked the outer edge of the radio button, which activated the 'live' state of yellow but the radio button was not checked. User failed to notice.

How would you expect it to work?

Whole radio button should be clickable and instigate the radio button become active when clicked.

How does it work currently?

User can click the outer ring (quite common now they are larger) but the radio button does not become checked.

Feel free to suggest a fix...

Would suggest that should the outer ring be clicked, the radio button becomes checked without need for user to hit the middle of the target.

Caveat: this has only happened with two low-to-no users to date but thought I would share. Should it happen more, will update this ticket.

Explain the steps to reproduce the bug

1. Use of radio buttons (new large format) in any question on Gov.uk website

Tell us about your environment

Radio buttons were being accessed in Google Chrome (unsure what version) on PC with Windows7 and being used on a GOV.uk prototype. No live example available.

[robinwhittleton]

Thanks for the report! I’ve replicated something, but I want to check that it’s the same behaviour you’re seeing. I can get the focus ring to appear if I:

1. hold the mouse button down while hovering over the outer ring
2. mouse the cursor away from the radio
3. release the mouse button

This adds the focus ring to the radio but doesn’t select it. Is this the behaviour you were seeing in the lab?

[charlottewild]

Thanks Robin. Yes, that sounds very similar. I have video footage that I can slice down to show the specific issue. Can I add video content to this thread to you know?

[NickColley]

That'd be really useful if you can manage it!

You could upload the clip to YouTube - as long as it does not have anything sensitive of course.

[charlottewild]

Hi Nick, sorry for delay with this - was just wanting sign off from the Service Manager that she was happy for me to share. First clip is here - https://youtu.be/0LCF37YLgOw - am just editing the second down.