Csrf token is sometimes filled as an attribute in the form

Hi, I have a strange case I can not figure out - sometimes a form field is filled with a csrf_token

  1. People are enrolling in a group.
  2. The form contains enroll[group_user][group_id].

It looks like this

<form data-target="groups-enroll.form" action="/teach/groups/636191/enrolls" accept-charset="UTF-8" data-remote="true" method="post">
 <input type="hidden" name="authenticity_token" value="ntKeXi34N7Ob6u7K4K4cgifKp22MNNyFOTz/ocQQlbVHnEnT+n/aLZlEfBYu/lqgN2qhdpjwdXXNdkY36TB//A==">
 <input type="hidden" value="636191" name="enroll[group_user_attributes][group_id]" id="enroll_group_user_attributes_group_id">

Sometimes, like exactly four times in the last month when the form is submitted the value of group_id is

"enroll": {
  "group_user_attributes": {
    "group_id": "x96KqNDRLhUhwWgQpf1c/x5puCXpLeiD+/Ym2gm3auRRBZsaVOw2rCpauziCJGmepsP6ueiBud/8ItW5JUhLxg==",
    ...
  }
  ...
}

Why would that be. Why would the group_id field have a csrf_token?

The input field is generated with:

 <%= f.fields_for :group_user, {parent_builder: f} do |group_user_form| %>
        <%= group_user_form.hidden_field :group_id %> 

I can not figure out how come in these 4 cases the id for the group was replaced with a token?

First time it occurred it did not bother me. But it is happening like once a week for the last 4 weeks (compared to having hundreds of successful enrollments) so I think there is something I am missing here.

Thanks

Update 1 It seems to be a Firefox issue. If the form is rendered on firefox this is what happens

The fields is filed with a different ID and not the id of the group.

Update 2

I have checked with other browsers and also how the form is rendered. Even though the output buffer is

   209:         yield
=> 210:         output_buffer
   211:       ensure
   212:         self.output_buffer = old_buffer
   213:       end
   214:     end
(byebug) output_buffer
"\n        <input type=\"hidden\" value=\"636191\" name=\"enroll[group_user_attributes][group_id]\" id=\"enroll_group_user_attributes_group_id\" /> \n   

The form on FF is still rendered as the picture above - the value for the group is no 636191 but is something else

Update 3 In the network tab I can see the payload of the response, but in the same time firefox shows a different value.

I guess it is not a rails specific problem. More like an Firefox problem, but I hope my findings here could help someone. See how the payload of the response for the enroll[group_user_attributes][group_id] has the correct value while the value in the source displayed by firefox is another

Update 4 Reporting to Firefox as a bug - https://bugzilla.mozilla.org/show_bug.cgi?id=1667657

I’ve been having the same issue. From my understanding Firefox tries to remember form values and pre-fills them when navigating between pages. This has the tendency of making hidden csrf input value incorrect.

My current fix is to add autocomplete="off" to the form element.

Hope this helps.

3 Likes

Thanks @rolandas. I will try it. In the mean time I recorded a video for Firefox team and add steps for them to reproduce it so I hope they could take a look.