From b6fe4461bfdc9248e5d1c62935ce6d3bf7f5e4f8 Mon Sep 17 00:00:00 2001 From: Nurhan Turgut Date: Tue, 19 Nov 2019 10:37:26 -0800 Subject: [PATCH 1/4] support for autocorrect --- .../lib/src/engine/text_editing/text_editing.dart | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart index 8484483f6f46a..c14785fb27dac 100644 --- a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart +++ b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart @@ -179,13 +179,15 @@ class InputConfiguration { @required this.inputType, @required this.inputAction, @required this.obscureText, + @required this.autocorrect, }); InputConfiguration.fromFlutter(Map flutterInputConfiguration) : inputType = EngineInputType.fromName( flutterInputConfiguration['inputType']['name']), inputAction = flutterInputConfiguration['inputAction'], - obscureText = flutterInputConfiguration['obscureText']; + obscureText = flutterInputConfiguration['obscureText'], + autocorrect = flutterInputConfiguration['autocorrect']; /// The type of information being edited in the input control. final EngineInputType inputType; @@ -195,6 +197,9 @@ class InputConfiguration { /// Whether to hide the text being edited. final bool obscureText; + + /// Whether to to enable autocorrection. Only available on Webkit. + final bool autocorrect; } typedef _OnChangeCallback = void Function(EditingState editingState); @@ -372,6 +377,10 @@ class TextEditingElement { if (inputConfig.obscureText) { domElement.setAttribute('type', 'password'); } + if (browserEngine == BrowserEngine.webkit && inputConfig.autocorrect) { + final String autocorrectValue = inputConfig.autocorrect ? 'on' : 'off'; + domElement.setAttribute('autocorrect', autocorrectValue); + } _setStaticStyleAttributes(domElement); owner._setDynamicStyleAttributes(domElement); domRenderer.glassPaneElement.append(domElement); From 06b0ed69817fbd136547670e27e059a3f27db2ae Mon Sep 17 00:00:00 2001 From: Nurhan Turgut Date: Tue, 19 Nov 2019 10:45:05 -0800 Subject: [PATCH 2/4] fixing the unit tests. Note there is no unit tests for the autocorrect since the unit tests do not run on webkit --- lib/web_ui/test/text_editing_test.dart | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/lib/web_ui/test/text_editing_test.dart b/lib/web_ui/test/text_editing_test.dart index 669ff6eb972ef..dfd4f51571f65 100644 --- a/lib/web_ui/test/text_editing_test.dart +++ b/lib/web_ui/test/text_editing_test.dart @@ -26,6 +26,7 @@ final InputConfiguration singlelineConfig = InputConfiguration( inputType: EngineInputType.text, obscureText: false, inputAction: 'TextInputAction.done', + autocorrect: true, ); final Map flutterSinglelineConfig = createFlutterConfig('text'); @@ -34,6 +35,7 @@ final InputConfiguration multilineConfig = InputConfiguration( inputType: EngineInputType.multiline, obscureText: false, inputAction: 'TextInputAction.newline', + autocorrect: true, ); final Map flutterMultilineConfig = createFlutterConfig('multiline'); @@ -105,6 +107,7 @@ void main() { inputType: EngineInputType.text, inputAction: 'TextInputAction.done', obscureText: true, + autocorrect: true, ); editingElement.enable( config, @@ -263,6 +266,7 @@ void main() { inputType: EngineInputType.text, obscureText: false, inputAction: 'TextInputAction.done', + autocorrect: true, ); editingElement.enable( config, @@ -286,6 +290,7 @@ void main() { inputType: EngineInputType.multiline, obscureText: false, inputAction: 'TextInputAction.done', + autocorrect: true, ); editingElement.enable( config, From 4e65f978b6408fe22f6243b2afa1ec9e3c7d7144 Mon Sep 17 00:00:00 2001 From: Nurhan Turgut Date: Tue, 19 Nov 2019 13:22:59 -0800 Subject: [PATCH 3/4] addressing PR comments --- .../src/engine/text_editing/text_editing.dart | 16 ++++--- lib/web_ui/test/text_editing_test.dart | 42 +++++++++++++++++++ 2 files changed, 53 insertions(+), 5 deletions(-) diff --git a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart index c14785fb27dac..1f0bde6c1bba4 100644 --- a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart +++ b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart @@ -198,7 +198,13 @@ class InputConfiguration { /// Whether to hide the text being edited. final bool obscureText; - /// Whether to to enable autocorrection. Only available on Webkit. + /// Whether to to enable autocorrection. + /// + /// Definition of autocorrect can be found in: + /// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input + /// + /// For future manual tests, note that autocorrect is an attribute only + /// supported by Safari. final bool autocorrect; } @@ -377,10 +383,10 @@ class TextEditingElement { if (inputConfig.obscureText) { domElement.setAttribute('type', 'password'); } - if (browserEngine == BrowserEngine.webkit && inputConfig.autocorrect) { - final String autocorrectValue = inputConfig.autocorrect ? 'on' : 'off'; - domElement.setAttribute('autocorrect', autocorrectValue); - } + + final String autocorrectValue = inputConfig.autocorrect ? 'on' : 'off'; + domElement.setAttribute('autocorrect', autocorrectValue); + _setStaticStyleAttributes(domElement); owner._setDynamicStyleAttributes(domElement); domRenderer.glassPaneElement.append(domElement); diff --git a/lib/web_ui/test/text_editing_test.dart b/lib/web_ui/test/text_editing_test.dart index dfd4f51571f65..2e13b9c7d9add 100644 --- a/lib/web_ui/test/text_editing_test.dart +++ b/lib/web_ui/test/text_editing_test.dart @@ -122,6 +122,46 @@ void main() { editingElement.disable(); }); + test('Knows to turn autocorrect off', () { + final InputConfiguration config = InputConfiguration( + inputType: EngineInputType.text, + inputAction: 'TextInputAction.done', + obscureText: false, + autocorrect: false, + ); + editingElement.enable( + config, + onChange: trackEditingState, + onAction: trackInputAction, + ); + expect(document.getElementsByTagName('input'), hasLength(1)); + final InputElement input = document.getElementsByTagName('input')[0]; + expect(editingElement.domElement, input); + expect(input.getAttribute('autocorrect'), 'off'); + + editingElement.disable(); + }); + + test('Knows to turn autocorrect on', () { + final InputConfiguration config = InputConfiguration( + inputType: EngineInputType.text, + inputAction: 'TextInputAction.done', + obscureText: false, + autocorrect: true, + ); + editingElement.enable( + config, + onChange: trackEditingState, + onAction: trackInputAction, + ); + expect(document.getElementsByTagName('input'), hasLength(1)); + final InputElement input = document.getElementsByTagName('input')[0]; + expect(editingElement.domElement, input); + expect(input.getAttribute('autocorrect'), 'on'); + + editingElement.disable(); + }); + test('Can read editing state correctly', () { editingElement.enable( singlelineConfig, @@ -1134,6 +1174,7 @@ class PlatformMessagesSpy { Map createFlutterConfig( String inputType, { bool obscureText = false, + bool autocorrect = true, String inputAction, }) { return { @@ -1141,6 +1182,7 @@ Map createFlutterConfig( 'name': 'TextInputType.$inputType', }, 'obscureText': obscureText, + 'autocorrect': autocorrect, 'inputAction': inputAction ?? 'TextInputAction.done', }; } From be0c31574b2c6508986033447fb80c0547684ebe Mon Sep 17 00:00:00 2001 From: Nurhan Turgut Date: Tue, 19 Nov 2019 13:26:22 -0800 Subject: [PATCH 4/4] fix typo --- lib/web_ui/lib/src/engine/text_editing/text_editing.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart index 1f0bde6c1bba4..c7f75b2a90023 100644 --- a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart +++ b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart @@ -198,7 +198,7 @@ class InputConfiguration { /// Whether to hide the text being edited. final bool obscureText; - /// Whether to to enable autocorrection. + /// Whether to enable autocorrection. /// /// Definition of autocorrect can be found in: /// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input