Menu Updates Do Not Save On Config Screen

Problem/Motivation

Located on the config page at the /admin/structure/tb-megamenu/ url, clicking the green "Save" button does not save the menu. It displays the message "Saved config successfully!", and the request sent by the browser returns a 200 response, but the changes do not get reflected on the frontend. Refreshing the config page similarly does not reflect the changes.

Steps to reproduce

On the menu page (/admin/structure/tb-megamenu), select a menu and click "config". Make a change to the menu, like changing a sub-menu's width, and click save. The menu says it saves, but does not actually save.

Proposed resolution

The error comes from line 14 of tb_megamenu.ajax.inc,

if (drupal_valid_token($token, $menu_name))

is returning false. The request sent by the "Save" button is not including the X-CSRF-TOKEN header, so this line fails, and the menu is not saved. This should probably have an "else" statement that returns a 403 to the client, rather than failing silently and returning a 200.

To get the line to pass, we must include the X-CSRF-TOKEN header in our request. The request is made in the saveConfig function in js/tb-megamenu-object.js, line 532. This line appears to be adding the header:

headers: { 'X-CSRF-Token': Drupal.TBMegaMenu.csrf_token },

, but it is not working for me, my browser does not send it (FF, latest version). Adding:

beforeSend: function (xhr){
  xhr.setRequestHeader('X-CSRF-TOKEN', Drupal.TBMegaMenu.csrf_token);
},

fixed the issue for me. This sends the X-CSRF-TOKEN header, and the menu is saved.

Remaining tasks

n/a

User interface changes

Proposed change: Add error handler callback in aforementioned ajax call in tb-megamenu-object.js to handle the 403 response by the server. Should display "Config could not be saved!".

API changes

n/a

Data model changes

n/a

Added proposed .patch file with a fix. Have used this patch myself to fix a site.