User can save invalid changes when closing a component

A component with invalid changes (e.g. a required string field is made empty) can still be saved. Steps to reproduce:

1. Edit the News List component on the 'news' page in the HAP
2. Make the required field "News Document types" empty.
   The 'Save' button becomes disabled because the value is now invalid
3. Click the 'X' button in the top-right corner to close the component.
   A confirmation dialog appears: "'News List' has unsaved changes. Do you want to save or discard these changes?"
4. Click 'Save'

Expected: The confirmation dialog closes and a message is shown that saving failed, the component editor stays open.
Message text: 
"Can't save document '<document name>', it contains an invalid value" 
"Can't save document '<document name>', a required field is empty"
"Can't save document '<document name>', there are errors in field values"
Message button: OK

On OK the message closes and focus should (preferably) move to the first field in the visual editor that has an error (or 

Actual: the invalid component values are saved and the right side panel is closed