Add a style fallback to avoid invalid inline styles

- fixes #7387

CHANGELOG.txt

@@ -29,6 +29,7 @@ Changelog
  * Fix: `blocks.MultipleChoiceBlock`, `forms.CheckboxSelectMultiple` and `ArrayField` checkboxes will now stack instead of display inline to align with all other checkboxes fields (Seb Brown)
  * Fix: Screen readers can now access login screen field labels (Amy Chan)
  * Fix: Admin breadcrumbs home icon now shows for users with access to a subtree only (Stefan Hammer)
+ * Fix: Add handling of invalid inline styles submitted to `RichText` so `ConfigException` is not thrown (Alex Tomkins)
 
 
 2.14.1 (12.08.2021)

docs/releases/2.15.rst

@@ -44,6 +44,7 @@ Bug fixes
  * ``blocks.MultipleChoiceBlock``, ``forms.CheckboxSelectMultiple`` and ``ArrayField`` checkboxes will now stack instead of display inline to align with all other checkboxes fields (Seb Brown)
  * Screen readers can now access login screen field labels (Amy Chan)
  * Admin breadcrumbs home icon now shows for users with access to a subtree only (Stefan Hammer)
+ * Add handling of invalid inline styles submitted to ``RichText`` so ``ConfigException`` is not thrown (Alex Tomkins)
 
 Upgrade considerations
 ======================

wagtail/admin/rich_text/converters/contentstate.py

@@ -47,6 +47,12 @@ def entity_fallback(props):
     return None
 
 
+def style_fallback(props):
+    type_ = props['inline_style_range']['style']
+    logging.warn('Missing config for "%s". Deleting style.' % type_)
+    return props['children']
+
+
 def persist_key_for_block(config):
     # For any block level element config for draft js exporter, return a config that retains the
     # block key in a data attribute
@@ -90,7 +96,9 @@ class ContentstateConverter():
                 'atomic': render_children,
                 'fallback': block_fallback,
             },
-            'style_map': {},
+            'style_map': {
+                'FALLBACK': style_fallback,
+            },
             'entity_decorators': {
                 'FALLBACK': entity_fallback,
             },

wagtail/admin/tests/test_contentstate.py

@@ -1036,3 +1036,21 @@ class TestContentStateToHtml(TestCase):
             <p data-block-key='00000'>Hello world!</p>
             <p data-block-key='00001'>Goodbye world!</p>
             ''')
+
+    def test_style_fallback(self):
+        # Test a block which uses an invalid inline style, and will be removed
+        converter = ContentstateConverter(features=[])
+        result = converter.to_database_format(json.dumps({
+            'entityMap': {},
+            'blocks': [
+                {
+                    'inlineStyleRanges': [{'offset': 0, 'length': 12, 'style': 'UNDERLINE'}],
+                    'text': 'Hello world!', 'depth': 0, 'type': 'unstyled', 'key': '00000', 'entityRanges': []
+                },
+            ]
+        }))
+        self.assertHTMLEqual(result, '''
+            <p data-block-key="00000">
+                Hello world!
+            </p>
+        ''')