Radio button invalid states are persisting #264

Activity

1. adam-the commented on Jul 20, 2025

   

   adam-the

   on Jul 20, 2025

   More actions

   Hey. Not got anything productive to comment on your issue, but found it a bit uninclusive that you were sharing links to resources only accessible with an NHS account. I can get in to your SharePoint as I have an nhs.net account, but can't view your Jira. I tried with a regular Outlook account and couldn't get into either resource.

   I thought half of the purpose of this being a public GitHub repository was to encourage external people to support it? 😊
2. ozgurozbek commented on Aug 22, 2025

   

   ozgurozbek

   on Aug 22, 2025

   Last edited by ozgurozbek

   More actions

   Looking at the code, this conditional exists in the memory as a React node so the conditional fields stay alive, i.e. display the red border.

   So this happens in the radio element, by not fully unmounting or disabling the conditional fields when their radio isn’t selected. Not in the group as stated in the issue. Unfortunately, as @adam-the stated I don't have any access to those links and I'm going by what I've used so far.

   Nonetheless, flipping the conditional should fix it:

   {shouldShowConditional || forceShowConditional
     ? conditional && (
       <div
         className="nhsuk-radios__conditional"
         id={`${inputID}--conditional`}
         {...conditionalWrapperProps}
       >
         {conditional}
       </div>
     )
     : null}

   Passes the tests as well, although I haven't tested it properly by making a new storybook entry.

   
3. colinrotherham commented on Sep 9, 2025

   

   colinrotherham

   on Sep 9, 2025

   Collaborator

   More actions

   To match NHS.UK frontend we're going to always render conditional content:

   • Upgrade to NHS.UK frontend v10.0.0 and support SSR #267

   But it'll stay hidden in the DOM until revealed

   Can anyone help test?