diff --git a/nicegui/elements/editor.py b/nicegui/elements/editor.py index 3378be9a0..b8e6b3b30 100644 --- a/nicegui/elements/editor.py +++ b/nicegui/elements/editor.py @@ -14,7 +14,8 @@ def __init__(self, ) -> None: """Editor - A code editor with syntax highlighting, based on `Quasar's QEditor `_. + A WYSIWYG editor based on `Quasar's QEditor `_. + The value is a string containing the formatted text as HTML code. :param value: initial value :param on_change: callback to be invoked when the value changes diff --git a/tests/test_editor.py b/tests/test_editor.py new file mode 100644 index 000000000..a9f756be1 --- /dev/null +++ b/tests/test_editor.py @@ -0,0 +1,14 @@ + +from nicegui import ui + +from .screen import Screen + + +def test_editor(screen: Screen): + editor = ui.editor(placeholder='Type something here') + ui.markdown().bind_content_from(editor, 'value', backward=lambda v: f'HTML code:\n```\n{v}\n```') + + screen.open('/') + screen.find_by_class('q-editor__content').click() + screen.type('Hello\nworld!') + screen.should_contain('Hello
world!
') diff --git a/website/documentation.py b/website/documentation.py index 5f8a2e894..9789f2057 100644 --- a/website/documentation.py +++ b/website/documentation.py @@ -143,6 +143,7 @@ def captions_and_overlays_demo(): load_demo(ui.scene) load_demo(ui.tree) load_demo(ui.log) + load_demo(ui.editor) load_demo(ui.json_editor) heading('Layout') diff --git a/website/more_documentation/editor_documentation.py b/website/more_documentation/editor_documentation.py new file mode 100644 index 000000000..72d055210 --- /dev/null +++ b/website/more_documentation/editor_documentation.py @@ -0,0 +1,7 @@ +from nicegui import ui + + +def main_demo() -> None: + editor = ui.editor(placeholder='Type something here') + ui.markdown().bind_content_from(editor, 'value', + backward=lambda v: f'HTML code:\n```\n{v}\n```')