Update Draftail link data to support copy-pasted links

client/src/components/Draftail/blocks/__snapshots__/EmbedBlock.test.js.snap

@@ -14,7 +14,7 @@ exports[`EmbedBlock renders 1`] = `
   src="http://www.example.com/example.png"
 >
   <a
-    className="EmbedBlock__link"
+    className="Tooltip__link EmbedBlock__link"
     href="http://www.example.com/"
     rel="noopener noreferrer"
     target="_blank"
@@ -23,12 +23,12 @@ exports[`EmbedBlock renders 1`] = `
     Test title
   </a>
   <button
-    className="Tooltip__button"
+    className="button Tooltip__button"
   >
     Edit
   </button>
   <button
-    className="Tooltip__button"
+    className="button button-secondary no Tooltip__button"
   >
     Remove
   </button>

client/src/components/Draftail/blocks/__snapshots__/ImageBlock.test.js.snap

@@ -23,18 +23,19 @@ exports[`ImageBlock alt 1`] = `
       Alt text
     </p>
     <input
+      className="ImageBlock__field__input"
       onChange={[Function]}
       type="text"
       value="Test"
     />
   </label>
   <button
-    className="Tooltip__button"
+    className="button Tooltip__button"
   >
     Edit
   </button>
   <button
-    className="Tooltip__button"
+    className="button button-secondary no Tooltip__button"
   >
     Remove
   </button>
@@ -64,18 +65,19 @@ exports[`ImageBlock renders 1`] = `
       Alt text
     </p>
     <input
+      className="ImageBlock__field__input"
       onChange={[Function]}
       type="text"
       value=""
     />
   </label>
   <button
-    className="Tooltip__button"
+    className="button Tooltip__button"
   >
     Edit
   </button>
   <button
-    className="Tooltip__button"
+    className="button button-secondary no Tooltip__button"
   >
     Remove
   </button>

client/src/components/Draftail/decorators/Link.js

@@ -10,28 +10,23 @@ const getDomainName = url => url.replace(/(^\w+:|^)\/\//, '').split('/')[0];
 
 const Link = props => {
   const { entityKey, contentState } = props;
-  const { linkType, url } = contentState.getEntity(entityKey).getData();
+  const data = contentState.getEntity(entityKey).getData();
   let icon;
   let label;
   let tooltipURL;
 
-  switch (linkType) {
-  case 'email':
+  if (data.id) {
+    icon = 'link';
+    tooltipURL = data.url;
+    label = data.url;
+  } else if (data.url.startsWith('mailto:')) {
     icon = 'mail';
-    tooltipURL = getEmailAddress(url);
-    label = url;
-    break;
-  case 'page':
+    tooltipURL = getEmailAddress(data.url);
+    label = data.url;
+  } else {
     icon = 'link';
-    tooltipURL = url;
-    label = url;
-    break;
-  case 'external':
-  default:
-    icon = 'link';
-    tooltipURL = url;
-    label = getDomainName(url);
-    break;
+    tooltipURL = data.url;
+    label = getDomainName(data.url);
   }
 
   return (

client/src/components/Draftail/sources/LinkSource.js

@@ -23,28 +23,18 @@ const buildInitialUrl = (entity, openAtParentId, canChooseRoot, pageTypes) => {
   };
 
   if (entity) {
-    let data = entity.getData();
+    const data = entity.getData();
 
-    if (typeof data === 'string') {
-      data = { url: data, linkType: 'external', title: '' };
-    }
+    // urlParams.link_text = data.title;
 
-    urlParams.link_text = data.title;
-
-    switch (data.linkType) {
-    case 'page':
+    if (data.id) {
       url = ` ${pageChooser}${data.parentId}/`;
-      break;
-
-    case 'email':
+    } else if (data.url.startsWith('mailto:')) {
       url = emailLinkChooser;
       urlParams.link_url = data.url.replace('mailto:', '');
-      break;
-
-    default:
+    } else {
       url = externalLinkChooser;
       urlParams.link_url = data.url;
-      break;
     }
   }
 
@@ -57,25 +47,17 @@ class LinkSource extends ModalSource {
     this.parseData = this.parseData.bind(this);
   }
 
-  // Plaster over more Wagtail internals.
-  parseData(pageData) {
-    const data = Object.assign({}, pageData);
+  parseData(data) {
+    const parsedData = {
+      url: data.url,
+    };
 
     if (data.id) {
-      data.linkType = 'page';
-    } else if (data.url.indexOf('mailto:') === 0) {
-      data.linkType = 'email';
-    } else {
-      data.linkType = 'external';
+      parsedData.id = data.id;
+      parsedData.parentId = data.parentId;
     }
 
-    // We do not want each link to have the page's title as an attr.
-    // nor links to have the link URL as a title.
-    if (data.linkType === 'page' || data.url.replace('mailto:', '') === data.title) {
-      delete data.title;
-    }
-
-    this.onConfirm(data);
+    this.onConfirm(parsedData);
   }
 
   componentDidMount() {

wagtail/admin/rich_text/converters/contentstate.py

@@ -16,11 +16,11 @@ def link_entity(props):
     """
     <a linktype="page" id="1">internal page link</a>
     """
-    link_type = props.get('linkType', '')
+    id_ = props.get('id')
     link_props = {}
 
-    if link_type == 'page':
-        link_props['linktype'] = link_type
+    if id_ is not None:
+        link_props['linktype'] = 'page'
         link_props['id'] = props.get('id')
     else:
         link_props['href'] = props.get('url')

wagtail/admin/rich_text/converters/html_to_contentstate.py

@@ -148,7 +148,7 @@ class LinkElementHandler(object):
 
 class ExternalLinkElementHandler(LinkElementHandler):
     def get_attribute_data(self, attrs):
-        return {'linkType': 'external', 'url': attrs['href']}
+        return {'url': attrs['href']}
 
 
 class PageLinkElementHandler(LinkElementHandler):
@@ -159,10 +159,8 @@ class PageLinkElementHandler(LinkElementHandler):
             return {}
 
         data = {
-            'linkType': 'page',
             'id': page.id,
             'url': page.url,
-            'title': page.title,
         }
 
         parent_page = page.get_parent()

wagtail/admin/wagtail_hooks.py

@@ -401,6 +401,13 @@ def register_core_features(features):
             'icon': 'link',
             'source': 'LinkSource',
             'decorator': 'Link',
+            # We want to enforce constraints on which links can be pasted into rich text.
+            # Keep only the attributes Wagtail needs.
+            'attributes': ['url', 'id', 'parentId'],
+            # Keep only links which are not anchor references.
+            'whitelist': {
+                'href': '^(?!#)',
+            }
         })
     )
     features.register_converter_rule('contentstate', 'link', {