Auto-save changes from code editor get lost if you navigate out too quickly

It's a mistake in the useEffect hook responsible for auto-saving changes: the timeout is cleared in the clean-up function, which means navigating to another route will cancel any pending changes. MR incoming.

There is another mistake there: compiledCss and compiledJs are dependencies of the same useEffect hook. Whenever the source code is updated, it will trigger the useEffect hook and kick off the compilation at the same time. The useEffect hook starts the 1 second time-out for the auto-save. If the compilation takes less than that, it will re-trigger the same useEffect hook, canceling out the already ongoing time-out. This means that triggering an auto-save can take up to 1.99 seconds depending on how fast the compilation is. This better explains to me why you were hitting this problem frequently. I will make sure to address this when I update this logic in the yet-to-be-created follow-up issue for 🐛 Global CSS is applied only after there are changes to a component after Global CSS was modified Active .

I recently experienced an issue where the JS component lost all of its data except its label:

(object) array(
   'owner' => '2',
   'data' => 
  array (
    'entity_type' => 'js_component',
    'entity_id' => 'navigation_menu',
    'data' => 
    array (
      'status' => false,
      'name' => '',
      'machineName' => 'navigation_menu',
      'source_code_js' => '',
      'source_code_css' => '',
      'block_override' => NULL,
      'props' => 
      array (
      ),
      'slots' => 
      array (
      ),
      'required' => 
      array (
      ),
    ),
    'data_hash' => 'ebb6b23bf8ad844f',
    'langcode' => NULL,
    'label' => 'Navigation menu',
  ),
   'updated' => 1743575219,
)

It even became disabled. Could this be due to a misfired autosave?