_unchecked falsey value displays on check your answers page

[murrlipp]

Description of the issue

When viewing a 'check your answers' page or playing back any submitted checkbox values, _unchecked is sometimes displayed in the list of values. This only appears to happen when a set of answers is submitted, and then changed.

Example:

Steps to reproduce the issue

1. Submit multiple answers via a checkbox list
2. Go back and uncheck one, or several, but not all of the answers
3. Go to a check your answers screen, or another screen that displays the values to see if _unchecked appears in the list of values

Note that this only happens intermittently so you may need to try several times before _unchecked appears.

Actual vs expected behaviour

_unchecked is being displayed, which is an internal falsey value. I would expect no value to be displayed if the value is falsey.

Environment (where applicable)

• Operating system: macOS Catalina
• Browser: Chrome
• Browser version: 96.0.4664.110
• GOV.UK Prototype Kit version: 9.4.0

[murrlipp]

Tagging @edwardhorsford in as he has experienced this too.

[edwardhorsford]

I've had this a longstanding issue in one part of my prototype - where checkboxes are used in search filters doing GET requests to the page or loading the page with pre-set query strings.

The kit uses _unchecked as a special value internally - but it's meant to be stripped out so it doesn't bleed out in to the interface. I think there's some edge cases where this doesn't happen correctly.

I wasn't able to track down the cause of the issue, and as it was so intermittent, diagnosing it was hard.

My hacky / brute force solution was to write a function to 'clean' my inputs as part of my route.

[trang-erskine]

@murrlipp are you able to link to the repo so we can look into it further?

[murrlipp]

@trang-erskine the repo is here: https://github.com/CriminalInjuriesCompensationAuthority/apply-for-compensation-prototype

Note that it includes @edwardhorsford's brute force solution mentioned above.

[BenSurgisonGDS]

I have managed to reproduce this bug with the following steps:

• Start the app
• Go directly to http://localhost:3000/application/_1-adult/_10-end/check-your-answers-page
• Click change for Do you have physical injuries?
• Select yes
• Click Continue
• Select the top 3 check boxes
• Click Continue
• Select the top 2 of the next page
• Click Continue
• Press back twice
• Unselect the top check box
• Click Continue
• Go directly to http://localhost:3000/application/_1-adult/_10-end/check-your-answers-page
• The _unchecked value will be displayed in the list of physical injuries

[BenSurgisonGDS]

This appears to occur because the code that removes the _unchecked entry from the list of values assumes there is only one there. When the bug occurs, there are two so only one is removed. I have made a fix to remove all occurrences of _unchecked from the list. While this fixes the symptom, it doesn't fix the cause as to why there were two _unchecked entries in the first place. I'll be investigating the cause in my next step followed by a fix and some unit tests to hopefully catch any issues here in the future.

[edwardhorsford]

@BenSurgisonGDS nice catch!

[BenSurgisonGDS]

I've fixed this in PR: #1333

[lfdebrux]

Hi @murrlipp, thanks for raising this issue! We're hoping a fix will go out in the next release, would you be happy for us to credit you in the release notes?

If you'd prefer to reply privately please feel free to message me using the email address on my public profile :)