From 42d830f0374488e1f553894b2a99d0211a1ea1bc Mon Sep 17 00:00:00 2001 From: AtlasAutocode <165201146+AtlasAutocode@users.noreply.github.com> Date: Tue, 23 Jul 2024 09:28:40 -0600 Subject: [PATCH] Add tests for PreserveInlineStylesRule and fix link editing. Other minor fixes. (#2058) * Value setting Stateful toolbar buttons derive from base class * Removed deprecated functions * Move clipboard actions to QuillController * Add: Clipboard toolbar buttons * Translation Justify * Translation alignJustify * Fix: Translation en-US * Misc fixes --------- Co-authored-by: Douglas Ward --- lib/src/controller/quill_controller.dart | 35 +++ .../editor/raw_editor/raw_editor_state.dart | 28 +- lib/src/editor/widgets/text/text_line.dart | 13 +- lib/src/rules/insert.dart | 73 ++--- test/rules/insert_test.dart | 289 ++++++++++++++++++ 5 files changed, 366 insertions(+), 72 deletions(-) create mode 100644 test/rules/insert_test.dart diff --git a/lib/src/controller/quill_controller.dart b/lib/src/controller/quill_controller.dart index 03952317..4dd3e7bf 100644 --- a/lib/src/controller/quill_controller.dart +++ b/lib/src/controller/quill_controller.dart @@ -8,6 +8,7 @@ import 'package:meta/meta.dart' show experimental; import '../../quill_delta.dart'; import '../common/structs/image_url.dart'; import '../common/structs/offset_value.dart'; +import '../common/utils/embeds.dart'; import '../delta/delta_diff.dart'; import '../delta/delta_x.dart'; import '../document/attribute.dart'; @@ -515,6 +516,12 @@ class QuillController extends ChangeNotifier { Future clipboardPaste({void Function()? updateEditor}) async { if (readOnly || !selection.isValid) return true; + final pasteUsingInternalImageSuccess = await _pasteInternalImage(); + if (pasteUsingInternalImageSuccess) { + updateEditor?.call(); + return true; + } + final pasteUsingHtmlSuccess = await _pasteHTML(); if (pasteUsingHtmlSuccess) { updateEditor?.call(); @@ -574,6 +581,34 @@ class QuillController extends ChangeNotifier { ); } + /// Return true if can paste internal image + Future _pasteInternalImage() async { + final copiedImageUrl = _copiedImageUrl; + if (copiedImageUrl != null) { + final index = selection.baseOffset; + final length = selection.extentOffset - index; + replaceText( + index, + length, + BlockEmbed.image(copiedImageUrl.url), + null, + ); + if (copiedImageUrl.styleString.isNotEmpty) { + formatText( + getEmbedNode(this, index + 1).offset, + 1, + StyleAttribute(copiedImageUrl.styleString), + ); + } + _copiedImageUrl = null; + await Clipboard.setData( + const ClipboardData(text: ''), + ); + return true; + } + return false; + } + /// Return true if can paste using HTML Future _pasteHTML() async { final clipboardService = ClipboardServiceProvider.instance; diff --git a/lib/src/editor/raw_editor/raw_editor_state.dart b/lib/src/editor/raw_editor/raw_editor_state.dart index d216ff25..ff90998b 100644 --- a/lib/src/editor/raw_editor/raw_editor_state.dart +++ b/lib/src/editor/raw_editor/raw_editor_state.dart @@ -11,7 +11,6 @@ import 'package:flutter/scheduler.dart' show SchedulerBinding; import 'package:flutter/services.dart' show Clipboard, - ClipboardData, HardwareKeyboard, KeyDownEvent, LogicalKeyboardKey, @@ -24,7 +23,6 @@ import '../../common/structs/horizontal_spacing.dart'; import '../../common/structs/offset_value.dart'; import '../../common/structs/vertical_spacing.dart'; import '../../common/utils/cast.dart'; -import '../../common/utils/embeds.dart'; import '../../common/utils/platform.dart'; import '../../controller/quill_controller.dart'; import '../../delta/delta_diff.dart'; @@ -155,31 +153,6 @@ class QuillRawEditorState extends EditorState return; } - // When image copied internally in the editor - final copiedImageUrl = controller.copiedImageUrl; - if (copiedImageUrl != null) { - final index = textEditingValue.selection.baseOffset; - final length = textEditingValue.selection.extentOffset - index; - controller.replaceText( - index, - length, - BlockEmbed.image(copiedImageUrl.url), - null, - ); - if (copiedImageUrl.styleString.isNotEmpty) { - controller.formatText( - getEmbedNode(controller, index + 1).offset, - 1, - StyleAttribute(copiedImageUrl.styleString), - ); - } - controller.copiedImageUrl = null; - await Clipboard.setData( - const ClipboardData(text: ''), - ); - return; - } - if (await controller.clipboardPaste()) { bringIntoView(textEditingValue.selection.extent); return; @@ -909,6 +882,7 @@ class QuillRawEditorState extends EditorState for (final attr in style.values) { controller.formatSelection(attr); } + controller.formatSelection(attribute); } } diff --git a/lib/src/editor/widgets/text/text_line.dart b/lib/src/editor/widgets/text/text_line.dart index ca358128..574c4126 100644 --- a/lib/src/editor/widgets/text/text_line.dart +++ b/lib/src/editor/widgets/text/text_line.dart @@ -931,10 +931,15 @@ class RenderEditableTextLine extends RenderEditableBox { @override TextPosition? getPositionAbove(TextPosition position) { - /// Move up by fraction of the default font height, larger font sizes need larger offset - for (var offset = -0.5;; offset -= 0.25) { - final pos = _getPosition(position, offset); - if (pos != position || offset <= -2.0) { + double? maxOffset; + double limit() => maxOffset ??= + _body!.semanticBounds.height / preferredLineHeight(position) + 1; + bool checkLimit(double offset) => offset < 4.0 ? false : offset > limit(); + + /// Move up by fraction of the default font height, larger font sizes need larger offset, embed images need larger offset + for (var offset = 0.5;; offset += offset < 4 ? 0.25 : 1.0) { + final pos = _getPosition(position, -offset); + if (pos?.offset != position.offset || checkLimit(offset)) { return pos; } } diff --git a/lib/src/rules/insert.dart b/lib/src/rules/insert.dart index f3885af7..4415aff6 100644 --- a/lib/src/rules/insert.dart +++ b/lib/src/rules/insert.dart @@ -558,35 +558,43 @@ class PreserveInlineStylesRule extends InsertRule { final documentDelta = document.toDelta(); final itr = DeltaIterator(documentDelta); + len ??= 0; var prev = itr.skip(len == 0 ? index : index + 1); + var excludeLinkAtLineStart = false; - if (prev == null || prev.data is! String) return null; - - /// Trap for simple insertions at start of line + /// Process simple insertions at start of line if (len == 0) { - final prevData = prev.data as String; - if (prevData.endsWith('\n')) { - /// If current line is empty get attributes from a prior line - final currLine = itr.next(); - final currData = - currLine.data is String ? currLine.data as String : null; - if (currData?.isEmpty == true || currData?.startsWith('\n') == true) { - if (prevData.trimRight().isEmpty) { - final back = - DeltaIterator(documentDelta).skip(index - prevData.length); - if (back != null && back.data is String) { - prev = back; + final currLine = itr.next(); + + /// Trap for previous is not text with attributes + if (prev?.data is! String) { + prev = currLine; + excludeLinkAtLineStart = true; + } else { + final prevData = prev!.data as String; + if (prevData.endsWith('\n')) { + /// If current line is empty get attributes from a prior line + final currData = + currLine.data is String ? currLine.data as String : null; + if (currData?.startsWith('\n') == true) { + if (prevData.trimRight().isEmpty) { + final back = + DeltaIterator(documentDelta).skip(index - prevData.length); + if (back != null && back.data is String) { + prev = back; + } } + } else { + prev = currLine; + excludeLinkAtLineStart = true; } - } else { - prev = currLine; } } } final attributes = {}; - if (prev.attributes != null) { - for (final entry in prev.attributes!.entries) { + if (prev?.attributes != null) { + for (final entry in prev!.attributes!.entries) { if (Attribute.inlineKeys.contains(entry.key)) { attributes[entry.key] = entry.value; } @@ -596,29 +604,12 @@ class PreserveInlineStylesRule extends InsertRule { return null; } - final text = data; - if (attributes.isEmpty || !attributes.containsKey(Attribute.link.key)) { - return Delta() - ..retain(index + (len ?? 0)) - ..insert(text, attributes); + if (excludeLinkAtLineStart) { + attributes.remove(Attribute.link.key); } - - attributes.remove(Attribute.link.key); - final delta = Delta() - ..retain(index + (len ?? 0)) - ..insert(text, attributes.isEmpty ? null : attributes); - final next = itr.next(); - - final nextAttributes = next.attributes ?? const {}; - if (!nextAttributes.containsKey(Attribute.link.key)) { - return delta; - } - if (attributes[Attribute.link.key] == nextAttributes[Attribute.link.key]) { - return Delta() - ..retain(index + (len ?? 0)) - ..insert(text, attributes); - } - return delta; + return Delta() + ..retain(index + len) + ..insert(data, attributes.isEmpty ? null : attributes); } } diff --git a/test/rules/insert_test.dart b/test/rules/insert_test.dart new file mode 100644 index 00000000..00ab5bba --- /dev/null +++ b/test/rules/insert_test.dart @@ -0,0 +1,289 @@ +import 'package:flutter/services.dart'; +import 'package:flutter_quill/flutter_quill.dart'; +import 'package:flutter_quill/quill_delta.dart'; +import 'package:flutter_quill/src/rules/insert.dart'; +import 'package:test/test.dart'; + +void main() { + group('PreserveInlineStylesRule', () { + const rule = PreserveInlineStylesRule(); + + test('Data does not apply', () { + final delta = Delta() + ..insert('data\n') + ..insert('second\n', {'bold': true}) + ..insert('\n\nplain\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 1), null); + expect(rule.apply(document, 0, data: '\n'), null); + }); + + test('Insert in text', () { + final delta = Delta() + ..insert('data\n') + ..insert('second\n', {'bold': true}) + ..insert('\n\nplain\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 1, data: 'X', len: 0), null); + expect( + rule.apply(document, 6, data: 'X', len: 0), + Delta() + ..retain(6) + ..insert('X', {'bold': true})); + expect(rule.apply(document, 16, data: 'X', len: 0), null, + reason: 'insertion with no attributes'); + }); + + test('Insert at start of line', () { + final delta = Delta() + ..insert('data\n') + ..insert('second\n', {'bold': true}) + ..insert('\n\nplain\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'a', len: 0), null); + expect( + rule.apply(document, 5, data: 'X', len: 0), + Delta() + ..retain(5) + ..insert('X', {'bold': true})); + expect( + rule.apply(document, 12, data: 'X', len: 0), + Delta() + ..retain(12) + ..insert('X', {'bold': true})); + expect( + rule.apply(document, 13, data: 'X', len: 0), + Delta() + ..retain(13) + ..insert('X', {'bold': true})); + expect(rule.apply(document, 14, data: 'X', len: 0), null, + reason: 'insertion before "plain" has no attributes'); + }); + + test('Insert on first line of document with bold text', () { + final delta = Delta()..insert('data\n', {'bold': true}); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), + Delta()..insert('X', {'bold': true}), + reason: 'Insert at document start must pickup style for the line'); + expect( + rule.apply(document, 1, data: 'X', len: 0), + Delta() + ..retain(1) + ..insert('X', {'bold': true})); + }); + + test('Insert around image', () { + final delta = Delta() + ..insert({'image': 'url'}) + ..insert('data\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), null); + expect(rule.apply(document, 1, data: 'X', len: 0), null); + }); + + test('Insert around image with bold text', () { + final delta = Delta() + ..insert({'image': 'url'}) + ..insert('data\n', {'bold': true}); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), null, + reason: + 'Insert before image must pickup inline attribute for the image'); + expect( + rule.apply(document, 1, data: 'X', len: 0), + Delta() + ..retain(1) + ..insert('X', {'bold': true}), + reason: + 'Insert after image must pickup style for text following the image'); + }); + + test('Insert around image with inline attribute', () { + final delta = Delta() + ..insert( + {'image': 'url'}, {'bold': true}) + ..insert('data\n', {'bold': true}); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), + Delta()..insert('X', {'bold': true}), + reason: 'Insert before image must pickup style for the image'); + expect( + rule.apply(document, 1, data: 'X', len: 0), + Delta() + ..retain(1) + ..insert('X', {'bold': true})); + }); + + test('Replace in text', () { + final delta = Delta() + ..insert('data\n') + ..insert('second\n', {'bold': true}) + ..insert('\n\nplain\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 1), null); + expect( + rule.apply(document, 5, data: 'X', len: 1), + Delta() + ..retain(6) + ..insert('X', {'bold': true})); + }); + + test('Insert around multiple images', () { + final delta = Delta() + ..insert( + {'image': 'url'}, {'bold': true}) + ..insert({'image': 'url2'}, + {'italic': true}) + ..insert('data\n', {'underline': true}); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), + Delta()..insert('X', {'bold': true})); + expect( + rule.apply(document, 1, data: 'X', len: 0), + Delta() + ..retain(1) + ..insert('X', {'italic': true})); + expect( + rule.apply(document, 2, data: 'X', len: 0), + Delta() + ..retain(2) + ..insert('X', {'underline': true})); + }); + + test('Insert around mix of text and images', () { + final delta = Delta() + ..insert( + {'image': 'url'}, {'bold': true}) + ..insert('p\n') + ..insert({'image': 'url2'}, + {'italic': true}) + ..insert('data\n', {'underline': true}); + final document = Document.fromDelta(delta); + // + expect( + rule.apply(document, 3, data: 'X', len: 0), + Delta() + ..retain(3) + ..insert('X', {'italic': true})); + }); + + test('Insert around images with NL', () { + final delta = Delta() + ..insert('\n\n\n', {'strike': true}) + ..insert( + {'image': 'url'}, {'bold': true}) + ..insert('\n\n\n', {'strike': true}) + ..insert({'image': 'url2'}, + {'italic': true}) + ..insert('data\n', {'underline': true}); + final document = Document.fromDelta(delta); + // + expect( + rule.apply(document, 2, data: 'X', len: 0), + Delta() + ..retain(2) + ..insert('X', {'strike': true})); + expect( + rule.apply(document, 6, data: 'X', len: 0), + Delta() + ..retain(6) + ..insert('X', {'strike': true})); + expect( + rule.apply(document, 7, data: 'X', len: 0), + Delta() + ..retain(7) + ..insert('X', {'italic': true})); + }); + + test('Exclude non-inline styles', () { + final delta = Delta()..insert('\n', {'list': 'ordered'}); + final document = Document.fromDelta(delta); + expect(rule.apply(document, 0, data: 'X', len: 0), null); + }); + + test('Insert around non-inline styles', () { + final delta = Delta() + ..insert('data\n') + ..insert('first') + ..insert('\n', {'list': 'ordered'}) + ..insert('A', {'bold': true}) + ..insert('B') + ..insert('C', {'italic': true}) + ..insert('\n\n', {'list': 'ordered'}) + ..insert('D', {'strike': true}) + ..insert('\n', {'list': 'ordered'}) + ..insert( + {'image': 'url'}, {'bold': true}) + ..insert('\n', {'list': 'ordered'}) + ..insert(' plain\n'); + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), null); + expect(rule.apply(document, 5, data: 'X', len: 0), null, + reason: '1. plain text'); + expect( + rule.apply(document, 11, data: 'X', len: 0), + Delta() + ..retain(11) + ..insert('X', {'bold': true}), + reason: '2. bold text at start'); + expect( + rule.apply(document, 15, data: 'X', len: 0), + Delta() + ..retain(15) + ..insert('X', {'italic': true}), + reason: '3. blank entry gets style from end of previous line'); + expect( + rule.apply(document, 16, data: 'X', len: 0), + Delta() + ..retain(16) + ..insert('X', {'strike': true}), + reason: '4. strike text'); + expect( + rule.apply(document, 18, data: 'X', len: 0), + Delta() + ..retain(18) + ..insert('X', {'bold': true}), + reason: '5. bold image'); + expect(rule.apply(document, 20, data: 'X', len: 0), null); + // + expect(rule.apply(document, 16, data: LogicalKeyboardKey.enter, len: 0), + null); + }); + + test('Insert around link, insert within link label', () { + final delta = Delta() + ..insert({'image': 'imageUrl'}, + {'link': 'linkURL'}) + ..insert('data\n') + ..insert('link', {'link': 'linkURL', 'bold': true}) + ..insert('\n'); + + final document = Document.fromDelta(delta); + // + expect(rule.apply(document, 0, data: 'X', len: 0), Delta()..insert('X')); + expect(rule.apply(document, 1, data: 'X', len: 0), null); + expect( + rule.apply(document, 6, data: 'X', len: 0), + Delta() + ..retain(6) + ..insert('X', {'bold': true})); + expect( + rule.apply(document, 7, data: 'X', len: 0), + Delta() + ..retain(7) + ..insert('X', {'link': 'linkURL', 'bold': true}), + reason: 'Insertion within link label updates label'); + }); + }); +}