Can't add new elements, GraphQL error: Invalid CSRF token

[robertvanlienden]

This weekend I've encountered some issue when I was trying to add a new element.

I've created a new Grid page, and tried to add a new element.
Then just nothing happens.

After some little investigation I've found a error in the console;
GraphQL error: Invalid CSRF token

Seems like we need to catch this error and show something on the front-end like;
"Session expired! Please refresh the page".

Right now I'm not 100% sure if this issue only occurs in our Elemental Grid, or also on the DNADesign/silverstripe-elemental package without our Elemental Grid.
After some investigation, I found out that the console error is thrown inside the following vendor file;
_resources/vendor/silverstripe/admin/client/dist/js/vendor.js

Reproduction steps

For security reasons, CSRF token will get invalidate when you open dev tools (F12) and view the admin in responsive.
So this makes it relative easy to reproduce the issue;

• Go t admin => select a grid page
• F12 (dev tools) => Toggle device toolbar (responsive view)
• Add a new row/grid block and see that it won't get added. Now, the error shows up in the console

[robertvanlienden]

Investigated => Found out that this issue also occurs when only using DNADesign/silverstripe-elemental (without grid module)

Created silverstripe/silverstripe-elemental#956 as bug-report to the original module.