Flutter Code Editor is a multi-platform code editor supporting syntax highlighting, code blocks folding, autocompletion, read-only code blocks, hiding specific code blocks, themes, and more.
Home Page: https://akvelon.com
License: Apache License 2.0
The second suggestion here is multiline and should not be among suggestions:
Precondition:
"Sample A" - current example.
"Sample B" - an example we will be switching to.
User is on the main page. Example "Sample A" is opened in editor.
Steps to reproduce:
Expected Result:
Nothing happens. (According to the prod page)
Acutal Result:
Previous example "Sample A" appears, but selected value in the Catalog dropdown field stays the same.
Our fork is meant to flag unterminated pair characters. It currently does it wrong and falsely flags unterminated braces in Java's MinimalWordCount and probably other examples.
Flutter issue: flutter/flutter#79153
As a temporary solution, tabs are replaced with spaces on loading (#66) and editing (with TabModifier).
Review #4
Likely we don't want to merge it.
Currently, when Tab is pressed, it is processed like this:
We should employ Flutter's shortcuts instead:
https://docs.flutter.dev/development/ui/advanced/actions_and_shortcuts
Review and merge #1
Service comments like //readonly and //[START section1] should be hidden in the editor.
Review and merge #2
It is now mutable for some reason. All widgets' fields must be immutable.
There was an issue in Beam Playground that suggests that tab symbols are not handled correctly in the editor:
https://issues.apache.org/jira/browse/BEAM-13446
Check this and fix if needed.
This feature was added to the original editor since forking. Need to add it to the fork. We do not use it but, but it will be easier to merge future useful features if we keep the diff low.
In #22, lines like var a = "//readonly "; were allowed to be falsely parsed as comments to make such strings read-only.
Need to implement the parser to only flag real end-of-line comments.
Corner cases:
" //readonly "."""multi-line string""".int /* // */ readonly ;.Append if you spot more false positives.
This fork introduced its own MainMode class for language. We should get back to Mode class from highlight package.
readOnlyMethod method name.Expected: Nothing happens.
Acutal: Cursor is moved to the bottom, an empty line is added there.
Reproducible in:
Not reproducible in Linux Desktop.
Found in commit: 72caacd 72caacd2975e80e0c3e3f477b6d82c7b0ef271ce
======== Exception caught by services library ======================================================
The following JSNoSuchMethodError was thrown during method call TextInputClient.updateEditingState:
TypeError: Cannot read properties of null (reading 'Symbol(dartx.length)')
When the exception was thrown, this was the stack:
dart:sdk_internal 29437:17 regExpCaptureCount
dart:sdk_internal 18584:70 split]
packages/flutter_code_editor/src/autocomplete/autocompleter.dart.lib.js 138:32 [_updateText]
packages/flutter_code_editor/src/autocomplete/autocompleter.dart.lib.js 123:24 setText
packages/flutter_code_editor/src/code_field/code_controller.dart.lib.js 464:28 set value
packages/flutter/src/widgets/title.dart.lib.js 41746:36 set [_value]
packages/flutter/src/widgets/title.dart.lib.js 42015:24 [_formatAndSetValue]
packages/flutter/src/widgets/title.dart.lib.js 41557:35 updateEditingValue
packages/flutter/src/services/text_editing_delta.dart.lib.js 3243:66 _handleTextInputInvocation
dart:sdk_internal 40595:34 runBody
dart:sdk_internal 40626:7 _async
packages/flutter/src/services/text_editing_delta.dart.lib.js 3167:20 [_handleTextInputInvocation]
packages/flutter/src/services/text_editing_delta.dart.lib.js 3154:56 _loudlyHandleTextInputInvocation
dart:sdk_internal 40595:34 runBody
dart:sdk_internal 40626:7 _async
packages/flutter/src/services/text_editing_delta.dart.lib.js 3152:20 [_loudlyHandleTextInputInvocation]
packages/flutter/src/services/text_editing_delta.dart.lib.js 4436:57 _handleAsMethodCall
dart:sdk_internal 40595:34 runBody
dart:sdk_internal 40626:7 _async
packages/flutter/src/services/text_editing_delta.dart.lib.js 4433:20 [_handleAsMethodCall]
packages/flutter/src/services/text_editing_delta.dart.lib.js 4430:126 <fn>
packages/flutter/src/services/text_editing_delta.dart.lib.js 9104:31 <fn>
dart:sdk_internal 40595:34 runBody
dart:sdk_internal 40626:7 _async
packages/flutter/src/services/text_editing_delta.dart.lib.js 9101:82 <fn>
dart:sdk_internal 196990:7 invoke2
dart:sdk_internal 133154:15 invoke
dart:sdk_internal 133225:54 push
dart:sdk_internal 133316:19 push
dart:sdk_internal 172366:27 invokeOnPlatformMessage
dart:sdk_internal 187512:49 updateEditingState
dart:sdk_internal 187594:26 <fn>
dart:sdk_internal 179063:38 handleChange
dart:sdk_internal 5438:16 _checkAndCall
dart:sdk_internal 5443:17 dcall
dart:sdk_internal 62137:21 ret
call: MethodCall(TextInputClient.updateEditingState, [1, {text: class MyClass {
void readOnlyMethod() {
}
void method() {
}
}
, selectionBase: 74, selectionExtent: 74, composingBase: null, composingExtent: null}])
====================================================================================================
No errors in browser console.
void _updateText(AutoComplete ac, String text) {
ac.clearEntries();
ac.enterList(
text
.split(RegExps.wordSplit)
.where((t) => t.isNotEmpty)
.toList(growable: false),
);
} void _updateText(AutoComplete ac, String text) {
ac.clearEntries();
ac.enterList(
text
.split(RegExp(RegExps.wordSplit.pattern))
.where((t) => t.isNotEmpty)
.toList(growable: false),
);
}[✓] Flutter (Channel stable, 3.3.0, on Ubuntu 20.04.4 LTS 5.14.0-1051-oem, locale en_US.UTF-8)
• Flutter version 3.3.0 on channel stable at /home/alexey/snap/flutter/common/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision ffccd96b62 (9 days ago), 2022-08-29 17:28:57 -0700
• Engine revision 5e9e0e0aa8
• Dart version 2.18.0
• DevTools version 2.15.0
[!] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
• Android SDK at /home/alexey/Android/Sdk
✗ cmdline-tools component is missing
Run `path/to/sdkmanager --install "cmdline-tools;latest"`
See https://developer.android.com/studio/command-line for more details.
✗ Android license status unknown.
Run `flutter doctor --android-licenses` to accept the SDK licenses.
See https://flutter.dev/docs/get-started/install/linux#android-setup for more details.
[✓] Chrome - develop for the web
• Chrome at google-chrome
[✓] Linux toolchain - develop for Linux desktop
• clang version 6.0.0-1ubuntu2 (tags/RELEASE_600/final)
• cmake version 3.10.2
• ninja version 1.8.2
• pkg-config version 0.29.1
[✓] Android Studio (version 2021.2)
• Android Studio at /home/alexey/bin/android-studio
• Flutter plugin version 68.1.2
• Dart plugin version 212.5744
• Java version OpenJDK Runtime Environment (build 11.0.12+0-b1504.28-7817840)
[✓] VS Code (version 1.70.2)
• VS Code at /usr/share/code
• Flutter extension can be installed from:
🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
[✓] Connected device (2 available)
• Linux (desktop) • linux • linux-x64 • Ubuntu 20.04.4 LTS 5.14.0-1051-oem
• Chrome (web) • chrome • web-javascript • Google Chrome 104.0.5112.101
[✓] HTTP Host Availability
• All required HTTP hosts are available
! Doctor found issues in 1 category.
This editor was forked from https://github.com/BertrandBev/code_field
which uses MIT License. It means we must do one of the following:
Allow to make text within //[START section1] and //[END section1] read-only.
Java highlighting breaks if # is present anywhere but string literals and comments:
public class MyClass {
}
#Java highlighting beaks if a multiline string literal is present anywhere with single or double quotes:
public class MyClass {
private string = """
multiline
""";
}Python highlighting breaks if a block opening line is not terminated with ::
def fn()Scala highlighting breaks if a multiline string literal is present anywhere:
val str4 = """
multiline
""";Dmitry Repin
[5:08 PM]
(https://akvelon.slack.com/archives/D041YQ1E1B4/p1662988084068089)
FoldableBlock(startLine: 0, endLine: 6, type: FoldableBlockType.braces)
FoldableBlock(startLine: 1, endLine: 2, type: FoldableBlockType.braces)
FoldableBlock(startLine: 2, endLine: 3, type: FoldableBlockType.singleLineComment)
FoldableBlock(startLine: 4, endLine: 5, type: FoldableBlockType.braces)
###
class MyClass {
void readOnlyMethod() {// [START section1]
}// [END section1]
// [START section2]
void method() {
}// [END section2]
}
We need to be able to provide to the flutter-code-editor library an information about the key symbols that will be used for autocompletion, when user types code.
Navigation, Delete and Backspace are currently simulated with WidgetTester.sendKeyEvent. This triggers Flutter's Shortcuts mechanism. However, typing text cannot be simulated like this, and we merely set CodeController.value to the new value.
This is insufficient because it leaves key handlers untested while the read-only feature may evolve to use them and to block input there.
In #22, we added read-only blocks by new line blocks. Now we need to allow read-only blocks by named sections like:
editable
[START section_name]
readonly
readonly
[END section_name]
editable
This should work if the given section_name is passed as a read-only section. Multiple such section names are allowed to be read-only.
In
// and # comments for any language in Code.We need to parse end-of-line comments that are specific to the language.
We need to support:
For other languages, do not process end-of-line comments in Code.
Review and merge #3
Currently hidden text ranges are only created inside a line, so we never needed to break line numbering.
In future, we will have hidden ranges that span multiple lines, so we need gaps.
Also line numbering has not been refactored after forking, so there must be something to get in order.
Support read-only parts of code, designated by end-of-line comments.
If the comment contains lowercase readonly, this line is read-only.
At this point, do not parse strings like var a = "//readonly", this is allowed to be false-positive read-only.
Internally it is still named code_text_field after the original.
In code, there may be many names sections designated like this:
editable
[START section_name]
readonly
readonly
[END section_name]
editable
They will be used for read-only functionality, for initially collapsing blocks, and for hidden sections.
We need to parse them into Code object to get started on those features.
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.