Add to Cart Form wrong Form Key in FPC

[alexgoodey]

When the page initially loads the formkey that is placed on the page is cached between independent requests. This is not an issue if the entire page loads before the "Add to Cart" button is pressed, however if the Add to Cart is clicked before the Javascript has fully initialized (and therefore the form is actually posted via a standard POST HTTP request) then the formkey that is sent in the form data does not match the users session and the product is not added to the cart.

Preconditions

1. Magento CE 2.2.2 with sample data installed
2. Full Page Cache enabled
3. Redirect to cart on "Add to Cart" set to yes in configuration (Sales>Checkout>Shopping Cart)

Steps to reproduce

1. Open a browser window and navigate to a product page.
2. View the page source and search for the formkey that is part of product_addtocartform form (form id)
3. Note the form_key down
4. Open an incognito window and navigate to the same product page
5. View the page source again and search for the form_key field

Expected result

1. The two form_key values should be different

Actual result

1. The two form_key values are the same (meaning the second one is wrong as it will not match the cookie)

Additional information

• detailed explanation Add to Cart Form wrong Form Key in FPC #13746 (comment)
• confirmed for 2.4-develop Add to Cart Form wrong Form Key in FPC #13746 (comment)

[joshdavenport]

We have literally been looking into this today and are experiencing the same issue. Locally where we don't have a full FPC setup we have no issues. However on our dev/staging/live servers with varnish fully set up we see failed add to carts before JS is initialised.

We initially saw it sporadically but having come to the conclusion it was a form key issue not 10 minutes before finding this issue report, we identified FPC as the issue so the sporadic nature must come from seeing uncached pages sometimes (works, form key is right) and cached pages other times (doesn't, form key isn't right)

[magento-engcom-team]

@alexgoodey , thank you for your report.
We were not able to reproduce this issue by following the steps you provided. Please provide more detailed steps to reproduce or try to reproduce this issue on a clean installation or latest release.

[alexgoodey]

Not sure how else I can explain it. Herer are some screenshots.

1. Viewing a product page that is not yet in the FPC. Showing the form_key cookie value (in Chrome)
   

2. The page source of the above page view shows the correct form key value in the source
   

3. A second view (now that is in the FPC) of the same product page in an incognito window, showing the form_key cookie value (which, as expected, is different to the above as this is a completely different session)
   

4. The page source of the same product page in an incognito window shows the original form_key value not the one belonging to the current (incognito) session
   

[magento-engcom-team]

@alexgoodey , thanks for you update.
We not reproduced this issue on fresh installiation Magento 2.2.2 CE with sample data. See attachments

Defaul browser window

Incognito browser window

The two form_key values should be different

[alexgoodey]

Using developer tools won't demonstrate the problem as the Javascript updates the developer tools and this problem is only apparent before Javascript has fully executed. You need to view the page source (i.e. in chrome using "view-source:", which does not execute Javascript) to see the initial form_key that is loaded with the page (and is therefore used if the Add to Cart button is clicked before the Javascript has executed).