qms-angular 1.0.27 → 1.0.31

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/theme/charactergrid.css

@@ -0,0 +1,12 @@
+/*
+ * Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+.ck.ck-character-grid {
+	max-width: 100%;
+	
+	& .ck-character-grid__tiles {
+		display: grid;
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/theme/characterinfo.css

@@ -0,0 +1,9 @@
+/*
+ * Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+.ck.ck-character-info {
+	display: flex;
+	justify-content: space-between;
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/theme/icons/specialcharacters.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 2.5a7.47 7.47 0 0 1 4.231 1.31 7.268 7.268 0 0 1 2.703 3.454 7.128 7.128 0 0 1 .199 4.353c-.39 1.436-1.475 2.72-2.633 3.677h2.013c0-.226.092-.443.254-.603a.876.876 0 0 1 1.229 0c.163.16.254.377.254.603v.853c0 .209-.078.41-.22.567a.873.873 0 0 1-.547.28l-.101.006h-4.695a.517.517 0 0 1-.516-.518v-1.265c0-.21.128-.398.317-.489a5.601 5.601 0 0 0 2.492-2.371 5.459 5.459 0 0 0 .552-3.693 5.53 5.53 0 0 0-1.955-3.2A5.71 5.71 0 0 0 10 4.206 5.708 5.708 0 0 0 6.419 5.46 5.527 5.527 0 0 0 4.46 8.663a5.457 5.457 0 0 0 .554 3.695 5.6 5.6 0 0 0 2.497 2.37.55.55 0 0 1 .317.49v1.264c0 .286-.23.518-.516.518H2.618a.877.877 0 0 1-.614-.25.845.845 0 0 1-.254-.603v-.853c0-.226.091-.443.254-.603a.876.876 0 0 1 1.228 0c.163.16.255.377.255.603h1.925c-1.158-.958-2.155-2.241-2.545-3.678a7.128 7.128 0 0 1 .199-4.352 7.268 7.268 0 0 1 2.703-3.455A7.475 7.475 0 0 1 10 2.5z"/></svg>

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/theme/specialcharacters.css

@@ -0,0 +1,10 @@
+/*
+ * Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/*
+ * Note: This file should contain the wireframe styles only. But since there are no such styles,
+ * it acts as a message to the builder telling that it should look for the corresponding styles
+ * **in the theme** when compiling the editor.
+ */

package/src/assets/qms-ckeditor-plugin/src/plugins/common/qmsCKEditorConstant.js

@@ -9,3 +9,7 @@ export const QMSCK_LINKED = 'LINKED'
 export const QMSCK_LINK_PLUGIN_MSG = 'QMSCK_LINK_PLUGIN_MSG';
 export const QMSCK_LINK_PLUGIN_RESP = 'QMSCK_LINK_PLUGIN_RESP';
 export const QMSCK_LINK_OPTION = 'LINK_OPTION'
+/* Tooltip */
+export const QMSCK_TOOLTIP_PLUGIN_MSG = 'QMSCK_TOOLTIP_PLUGIN_MSG';
+export const QMSCK_TOOLTIP_PLUGIN_RESP = 'QMSCK_TOOLTIP_PLUGIN_RESP';
+export const QMSCK_TOOLTIP_IS_PROCESSING = 'QMSCK_TOOLTIP_IS_PROCESSING';

package/src/assets/qms-ckeditor-plugin/src/plugins/common/qmsCKEditorService.js

@@ -39,3 +39,13 @@ export function linkNotify(value){
         '*'
     );
 }
+
+export function tooltipNotify(value) {
+    window.postMessage(
+        {
+            eventName: constant.QMSCK_TOOLTIP_PLUGIN_MSG,
+            value
+        },
+        '*'
+    );
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/common/qmsCKEditorUtil.js

@@ -25,3 +25,66 @@ export function getUrl(href) {
     if (!href) return '';
     return href.substring(2);
 }
+
+
+function twoDigitPad(num) {
+    return num < 10 ? "0" + num : num;
+}
+
+/**
+ * Get a formatted date for a date and time pattern
+ *
+ * Example: MM/dd/yyy HH:mm:ss aaa
+ *
+ * Date and Time Patterns:
+ * yy = 2-digit year; yyyy = full year
+ * 
+ * M = digit month; MM = 2-digit month
+ * 
+ * d = digit day; dd = 2-digit day
+ * 
+ * h = hours am/pm; hh = 2-digit hours am/pm; H = hours; HH = 2-digit hours
+ * 
+ * m = minutes; mm = 2-digit minutes; aaa = AM/PM
+ * 
+ * s = seconds; ss = 2-digit seconds
+ * 
+ * S = miliseconds
+ */
+export function formatDate(date, datetimeFormat){
+    if (!datetimeFormat) {
+        return date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
+    }
+    var day = date.getDate(),
+        month = date.getMonth(),
+        year = date.getFullYear(),
+        hour = date.getHours(),
+        minute = date.getMinutes(),
+        second = date.getSeconds(),
+        miliseconds = date.getMilliseconds(),
+        h = hour % 12,
+        hh = twoDigitPad(h),
+        HH = twoDigitPad(hour),
+        mm = twoDigitPad(minute),
+        ss = twoDigitPad(second),
+        aaa = hour < 12 ? 'AM' : 'PM',
+        dd = twoDigitPad(day),
+        M = month + 1,
+        MM = twoDigitPad(M),
+        yyyy = year + "",
+        yy = yyyy.substr(2, 2)
+    ;
+    // checks to see if month name will be used
+    return datetimeFormat
+      .replace('hh', hh).replace('h', h)
+      .replace('HH', HH).replace('H', hour)
+      .replace('mm', mm).replace('m', minute)
+      .replace('ss', ss).replace('s', second)
+      .replace('S', miliseconds)
+      .replace('dd', dd).replace('d', day)
+      .replace('yyyy', yyyy)
+      .replace('yy', yy)
+      .replace('MM', MM)
+      .replace('M', M)
+      .replace('aaa', aaa);
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/timestamp/timestamp.js

@@ -0,0 +1,34 @@
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+import timestampIcon from '../../themes/icons/timestamp.svg';
+import { formatDate } from '../common/qmsCKEditorUtil';
+import { toMap } from '@ckeditor/ckeditor5-utils';
+
+export default class Timestamp extends Plugin {
+    init() {
+        const editor = this.editor;
+        const t = editor.t;
+        const datetimeformat= editor.config.get('timestampConfig.datetimeFormat');
+
+        editor.ui.componentFactory.add('timestamp', locale => {
+            const buttonView = new ButtonView( locale );
+
+            buttonView.set( {
+                label: t('Timestamp'),
+                icon: timestampIcon,
+                withText: true,
+                tooltip: true
+            } );
+
+            buttonView.on('execute', () => {
+                editor.model.change( writer => {
+                    const attributes = toMap( editor.model.document.selection.getAttributes() );
+                    const timestamp = writer.createText(formatDate(new Date(), datetimeformat), attributes);
+                    editor.model.insertContent(timestamp, editor.model.document.selection );
+                } );
+            } );
+
+            return buttonView;
+        } );
+    }
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/tooltip/inserttooltipcommand.js

@@ -0,0 +1,98 @@
+import { Command } from '@ckeditor/ckeditor5-core';
+import { findAttributeRange } from '@ckeditor/ckeditor5-typing';
+import { first, toMap } from '@ckeditor/ckeditor5-utils';
+import * as QMSCKEditorConstant from '../common/qmsCKEditorConstant';
+import * as QMSCKEditorService from '../common/qmsCKEditorService';
+import { isTooltipAllowed, TOOLTIP_ATTRIBUTE, findTooltipElementAncestor } from './utils';
+
+export default class InsertTooltipCommand extends Command {
+    refresh() {
+        const model = this.editor.model;
+        const doc = model.document;
+        const selectedElement = first(doc.selection.getSelectedBlocks() );
+
+        // A check for the `LinkImage` plugin. If the selection contains an element, get values from the element.
+        // Currently the selection reads attributes from text nodes only. See #7429 and #7465.
+        if (isTooltipAllowed(selectedElement, model.schema ) ) {
+            this.value = selectedElement.getAttribute(TOOLTIP_ATTRIBUTE);
+            this.isEnabled = model.schema.checkAttribute(selectedElement, TOOLTIP_ATTRIBUTE);
+        } else {
+            this.value = doc.selection.getAttribute(TOOLTIP_ATTRIBUTE);
+            this.isEnabled = model.schema.checkAttributeInSelection(doc.selection, TOOLTIP_ATTRIBUTE);
+        }
+    }
+
+    execute() {
+        const model = this.editor.model;
+        const selection = model.document.selection;
+        let text= '';
+        let content = '';
+        if(selection.isCollapsed){
+            if(selection.hasAttribute(TOOLTIP_ATTRIBUTE)){
+                const view = this.editor.editing.view;
+		        const viewSelection = view.document.selection;
+                const selectedElement = findTooltipElementAncestor(viewSelection.getFirstPosition());
+                if(selectedElement){
+                    text = selectedElement.getChild(0).data;
+                    content = selectedElement.getAttribute(TOOLTIP_ATTRIBUTE);
+                }
+            }
+        }
+        else
+        {
+            const ranges = selection.getFirstRange();
+            if(ranges)
+            {
+                for (const item of ranges.getItems()) {
+                    if (item.data) {
+                        text = text + item.data;
+                    }
+                }
+            }
+        }
+
+        QMSCKEditorService.tooltipNotify({'text': text, 'content': content});
+        window[QMSCKEditorConstant.QMSCK_TOOLTIP_IS_PROCESSING] = false;
+        window.addEventListener(QMSCKEditorConstant.QMSCK_TOOLTIP_PLUGIN_RESP, function (evt) {
+            if (window[QMSCKEditorConstant.QMSCK_TOOLTIP_IS_PROCESSING]) { 
+                return; 
+            }
+            window[QMSCKEditorConstant.QMSCK_TOOLTIP_IS_PROCESSING] = true;             
+            console.log(evt.detail);
+            model.change(writer => {
+                const position = selection.getFirstPosition();
+                const attributes = toMap(selection.getAttributes());     
+                attributes.set(TOOLTIP_ATTRIBUTE, evt.detail.content);
+                
+                if (selection.isCollapsed) {                
+                    // When selection is inside text with `data-tooltip` attribute.
+                    if (selection.hasAttribute(TOOLTIP_ATTRIBUTE)) {
+                        // Then update `data-tooltip` value.
+                        const linkRange = findAttributeRange(position, TOOLTIP_ATTRIBUTE, selection.getAttribute(TOOLTIP_ATTRIBUTE), model);
+                        writer.remove(linkRange);
+                        const newPosition = selection.getFirstPosition();
+                        const { end: positionAfter } = model.insertContent(writer.createText(evt.detail.text, attributes), newPosition);
+                        writer.setSelection(positionAfter);
+                    }
+                    // If not then insert text node with `data-tooltip` attribute in place of caret.
+                    // However, since selection is collapsed, attribute value will be used as data for text node.
+                    // So, if `evt.detail.content` is empty, do not create text node.
+                    else if (!!evt.detail.content && evt.detail.content !== '') {
+                        const { end: positionAfter } = model.insertContent(writer.createText(evt.detail.text, attributes), position);
+                        // Put the selection at the end of the inserted link.
+                        // Using end of range returned from insertContent in case nodes with the same attributes got merged.
+                        writer.setSelection(positionAfter);
+                    }
+                } else {
+                    
+                    const { end: positionAfter } = model.insertContent(writer.createText(evt.detail.text, attributes), selection);
+                    // Put the selection at the end of the inserted link.
+                    writer.setSelection(positionAfter);
+                }
+                // Remove the `data-tooltip` attribute from the selection.
+                // It stops adding a new content into the link element.
+                writer.removeSelectionAttribute(TOOLTIP_ATTRIBUTE);
+            });
+        });
+    }
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/tooltip/removetooltipcommand.js

@@ -0,0 +1,41 @@
+import { Command } from 'ckeditor5/src/core';
+import { findAttributeRange } from 'ckeditor5/src/typing';
+import { first } from 'ckeditor5/src/utils';
+import { isTooltipAllowed, TOOLTIP_ATTRIBUTE } from './utils';
+
+export default class RemoveTooltipCommand extends Command {
+    refresh() {
+        const model = this.editor.model;
+        const doc = model.document;
+        const selectedElement = first(doc.selection.getSelectedBlocks());
+
+        // A check for the `LinkImage` plugin. If the selection contains an image element, get values from the element.
+        // Currently the selection reads attributes from text nodes only. See #7429 and #7465.
+        if (isTooltipAllowed(selectedElement, model.schema)) {
+            this.isEnabled = model.schema.checkAttribute(selectedElement, TOOLTIP_ATTRIBUTE);
+        } else {
+            this.isEnabled = model.schema.checkAttributeInSelection(doc.selection, TOOLTIP_ATTRIBUTE);
+        }
+    }
+
+    execute() {
+        const editor = this.editor;
+        const model = editor.model;
+        const selection = model.document.selection;
+
+        model.change(writer => {
+            const selectedRanges = selection.isCollapsed ?
+                [findAttributeRange(
+                    selection.getFirstPosition(),
+                    TOOLTIP_ATTRIBUTE,
+                    selection.getAttribute(TOOLTIP_ATTRIBUTE),
+                    model
+                )] :
+                model.schema.getValidRanges(selection.getRanges(), TOOLTIP_ATTRIBUTE);
+
+            for (const range of selectedRanges) {
+                writer.removeAttribute(TOOLTIP_ATTRIBUTE, range);
+            }
+        });
+    }
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/tooltip/tooltip.js

@@ -0,0 +1,14 @@
+
+import { Plugin } from '@ckeditor/ckeditor5-core';
+import TooltipEditing from './tooltipediting';
+import TooltipUI from './tooltipui';
+ 
+export default class Tooltip extends Plugin {
+	static get requires() {
+		return [TooltipEditing, TooltipUI];
+	}
+ 
+	static get pluginName() {
+		return 'Tooltip';
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/tooltip/tooltipediting.js

@@ -0,0 +1,280 @@
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import '../../themes/tyles/tooltip.css';
+import { TOOLTIP_CUSTOM_PROPERTY, TOOLTIP_ATTRIBUTE, INSERT_TOOLTIP_COMMAND, REMOVE_TOOLTIP_COMMAND, isTyping, shouldCopyAttributes} from './utils';
+import InsertTooltipCommand from './inserttooltipcommand';
+import RemoveTooltipCommand from './removetooltipcommand';
+import {MouseObserver} from '@ckeditor/ckeditor5-engine';
+import { keyCodes } from '@ckeditor/ckeditor5-utils';
+import { Input, TwoStepCaretMovement, findAttributeRange  } from '@ckeditor/ckeditor5-typing';
+import { ClipboardPipeline } from '@ckeditor/ckeditor5-clipboard';
+
+export default class TooltipEditing extends Plugin {
+ 
+	static get pluginName() {
+		return 'TooltipEditing';
+	} 
+
+	static get requires() {
+		// Clipboard is required for handling cut and paste events while typing over the tooltip.
+		return [ TwoStepCaretMovement, Input, ClipboardPipeline ];
+	}
+
+    init() {
+        const editor = this.editor;
+ 
+       editor.model.schema.extend('$text', { allowAttributes: TOOLTIP_ATTRIBUTE });
+       editor.conversion.for('upcast').elementToAttribute({
+            view: {
+                name: 'span',
+                attributes: {
+                    tooltip: true
+                }
+            },
+            model: {
+                key: TOOLTIP_ATTRIBUTE,
+                value: viewElement => viewElement.getAttribute(TOOLTIP_ATTRIBUTE)
+            }
+        });
+ 
+        editor.conversion.for('downcast').attributeToElement({ 
+            model: TOOLTIP_ATTRIBUTE,
+            view: (modelAttributeValue, { writer: viewWriter }) =>{
+                const attributes = { class: 'np-tooltip'};
+                attributes[TOOLTIP_ATTRIBUTE] = modelAttributeValue;
+                
+                const tooltipElement =  viewWriter.createAttributeElement('span', attributes);
+                viewWriter.setCustomProperty(TOOLTIP_CUSTOM_PROPERTY, true, tooltipElement);
+                return tooltipElement;
+            }
+        });
+
+        editor.commands.add(INSERT_TOOLTIP_COMMAND, new InsertTooltipCommand(editor));
+		editor.commands.add(REMOVE_TOOLTIP_COMMAND, new RemoveTooltipCommand(editor));
+
+		// Enable two-step caret movement for `data-tooltip` attribute.
+		const twoStepCaretMovementPlugin = editor.plugins.get(TwoStepCaretMovement);
+		twoStepCaretMovementPlugin.registerAttribute(TOOLTIP_ATTRIBUTE);
+
+		// Change the attributes of the selection in certain situations after the link was inserted into the document.
+		this._enableInsertContentSelectionAttributesFixer();
+
+        // Handle a click at the beginning/end of a tooltip element.
+		this._enableClickingAtBeginingOrEndTooltip();
+ 
+        // Handle typing over the tooltip element.
+		this._enableTypingOverTooltip();
+
+		// Handle removing the content after the tooltip element.
+		this._handleDeleteContent();
+    }
+
+	_enableInsertContentSelectionAttributesFixer() {
+		const editor = this.editor;
+		const model = editor.model;
+		const selection = model.document.selection;
+ 
+		this.listenTo(model, 'insertContent', () => {
+			const nodeBefore = selection.anchor.nodeBefore;
+			const nodeAfter = selection.anchor.nodeAfter;
+ 
+			if (!selection.hasAttribute(TOOLTIP_ATTRIBUTE)) {
+				return;
+			}
+ 
+			if (!nodeBefore) {
+				return;
+			}
+ 
+			if (!nodeBefore.hasAttribute(TOOLTIP_ATTRIBUTE)) {
+				return;
+			}
+ 
+			if (nodeAfter && nodeAfter.hasAttribute(TOOLTIP_ATTRIBUTE)) {
+				return;
+			}
+			//console.log('_enableInsertContentSelectionAttributesFixer==>insertContent==>writer.removeSelectionAttribute(TOOLTIP_ATTRIBUTE)');
+
+			model.change(writer => {
+				writer.removeSelectionAttribute(TOOLTIP_ATTRIBUTE);
+			});
+		}, { priority: 'low' });
+	}
+
+    _enableTypingOverTooltip() {
+		const editor = this.editor;
+		const view = editor.editing.view;
+
+		// Selection attributes when started typing over the tooltip.
+		let selectionAttributes;
+
+		// Whether pressed `Backspace` or `Delete`. If so, attributes should not be preserved.
+		let deletedContent;
+
+		// Detect pressing `Backspace` / `Delete`.
+	
+		this.listenTo(view.document, 'delete', () => {
+			deletedContent = true;
+		}, { priority: 'high' });
+
+		// Listening to `model#deleteContent` allows detecting whether selected content was the tooltip.
+		// If so, before removing the element, we will copy its attributes.
+		this.listenTo(editor.model, 'deleteContent', () => {
+			const selection = editor.model.document.selection; 
+
+			// Copy attributes only if anything is selected.
+			if (selection.isCollapsed) {
+				return;
+			}
+
+			// When the content was deleted, do not preserve attributes.
+			if (deletedContent) {
+				deletedContent = false;
+				return;
+			}
+
+			// Enabled only when typing.
+			if (!isTyping(editor)) {
+				return;
+			}
+
+			if (shouldCopyAttributes(editor.model)) {
+				selectionAttributes = selection.getAttributes();
+			}
+		}, { priority: 'high' });
+
+		// Listening to `model#insertContent` allows detecting the content insertion.
+		// We want to apply attributes that were removed while typing over the tooltip.
+		this.listenTo(editor.model, 'insertContent', (evt, [ element ]) => {
+			deletedContent = false;
+			//console.log('_enableTypingOverTooltip==>insertContent==>isTyping(editor): ' + isTyping(editor));
+ 
+			// Enabled only when typing.
+			if (!isTyping(editor)) {
+				return;
+			}
+
+			if (!selectionAttributes) {
+				return;
+			}
+			//console.log('_enableTypingOverTooltip==>insertContent==>selectionAttributes: ');
+			//console.log(selectionAttributes);
+
+			editor.model.change(writer => {
+				for (const [ attribute, value ] of selectionAttributes) {
+					writer.setAttribute(attribute, value, element);
+				}
+			});
+
+			selectionAttributes = null;
+		}, { priority: 'high' });
+	}
+
+    _enableClickingAtBeginingOrEndTooltip() {
+		const editor = this.editor;
+		const selection = editor.model.document.selection;
+		editor.editing.view.addObserver(MouseObserver);
+		let clicked = false;
+
+		// Detect the click.
+		this.listenTo(editor.editing.view.document, 'mousedown', () => {
+			clicked = true;
+		});
+
+		// When the selection has changed...
+		this.listenTo(editor.editing.view.document, 'selectionChange', () => {
+ 
+			if (!clicked) {
+				return;
+			}
+
+			// ...and it was caused by the click...
+			clicked = false;
+ 
+			// ...and no text is selected...
+			if (!selection.isCollapsed) {
+				return;
+			}
+
+			//console.log('_enableClickingAtBeginingOrEndTooltip==>selectionChange==>selection.hasAttribute(TOOLTIP_ATTRIBUTE): ' + selection.hasAttribute(TOOLTIP_ATTRIBUTE));
+			// ...and clicked text is the tooltip...
+			if (!selection.hasAttribute(TOOLTIP_ATTRIBUTE)) {
+				return;
+			}
+
+			const position = selection.getFirstPosition();
+			const selectedRange = findAttributeRange(position, TOOLTIP_ATTRIBUTE, selection.getAttribute(TOOLTIP_ATTRIBUTE), editor.model);
+
+			// ...check whether clicked start/end boundary of the tooltip.
+			// If so, remove the `tooltip` attribute.
+			const isTouching = position.isTouching(selectedRange.start) || position.isTouching(selectedRange.end);
+			//console.log('_enableClickingAtBeginingOrEndTooltip==>selectionChange==>isTouching: ' + isTouching);
+			if (isTouching) {
+				editor.model.change(writer => {
+					writer.removeSelectionAttribute(TOOLTIP_ATTRIBUTE);
+				});
+			}
+		});
+	}
+
+    _handleDeleteContent() {
+		const editor = this.editor;
+		const model = editor.model;
+		const selection = model.document.selection;
+		const view = editor.editing.view;
+
+		// A flag whether attributes `tooltip` attribute should be preserved.
+		let shouldPreserveAttributes = false;
+
+		// A flag whether the `Backspace` key was pressed.
+		let hasBackspacePressed = false;
+
+		// Detect pressing `Backspace`.
+		this.listenTo(view.document, 'delete', (evt, data) => {
+			hasBackspacePressed = data.domEvent.keyCode === keyCodes.backspace;
+		}, { priority: 'high' });
+
+		// Before removing the content, check whether the selection is inside a tooltip or at the end of tooltip but with 2-SCM enabled.
+		// If so, we want to preserve tooltip attributes.
+		this.listenTo(model, 'deleteContent', () => {
+			// Reset the state.
+			shouldPreserveAttributes = false;
+
+			const position = selection.getFirstPosition();
+			const tooltip = selection.getAttribute(TOOLTIP_ATTRIBUTE);
+
+			if (!tooltip) {
+				return;
+			}
+
+			const selectedRange = findAttributeRange(position, TOOLTIP_ATTRIBUTE, tooltip, model);
+
+			// Preserve `tooltip` attribute if the selection is in the middle of the tooltip or
+			// the selection is at the end of the tooltip and 2-SCM is activated.
+			shouldPreserveAttributes = selectedRange.containsPosition(position) || selectedRange.end.isEqual(position);
+		}, { priority: 'high' });
+
+		// After removing the content, check whether the current selection should preserve the `tooltip` attribute.
+		this.listenTo(model, 'deleteContent', () => {
+			// If didn't press `Backspace`.
+			if (!hasBackspacePressed) {
+				return;
+			}
+	 
+			//console.log('_handleDeleteContent==>deleteContent==>shouldPreserveAttributes: ' + shouldPreserveAttributes);
+
+			hasBackspacePressed = false;
+
+			// Disable the mechanism if inside a tooltip (`<$text url="foo">F[]oo</$text>` or <$text url="foo">Foo[]</$text>`).
+			if (shouldPreserveAttributes) {
+				return;
+			}
+
+			// Use `model.enqueueChange()` in order to execute the callback at the end of the changes process.
+			editor.model.enqueueChange(writer => {
+				writer.removeSelectionAttribute(TOOLTIP_ATTRIBUTE);
+			});
+		}, { priority: 'low' });
+	}
+
+}
+