Merge pull request #1243 from zauberzeug/open-in-new-tab

Support `ui.open` with new tab

nicegui/client.py

@@ -135,10 +135,10 @@ class Client:
             await asyncio.sleep(check_interval)
         return self.waiting_javascript_commands.pop(request_id)
 
-    def open(self, target: Union[Callable[..., Any], str]) -> None:
+    def open(self, target: Union[Callable[..., Any], str], new_tab: bool = False) -> None:
         """Open a new page in the client."""
         path = target if isinstance(target, str) else globals.page_routes[target]
-        outbox.enqueue_message('open', path, self.id)
+        outbox.enqueue_message('open', {'path': path, 'new_tab': new_tab}, self.id)
 
     def download(self, url: str, filename: Optional[str] = None) -> None:
         """Download a file from the given URL."""

nicegui/functions/open.py

@@ -3,7 +3,7 @@ from typing import Any, Callable, Union
 from .. import globals
 
 
-def open(target: Union[Callable[..., Any], str]) -> None:
+def open(target: Union[Callable[..., Any], str], new_tab: bool = False) -> None:
     """Open
 
     Can be used to programmatically trigger redirects for a specific client.
@@ -12,6 +12,7 @@ def open(target: Union[Callable[..., Any], str]) -> None:
     User events like button clicks provide such a socket.
 
     :param target: page function or string that is a an absolute URL or relative path from base URL
+    :param new_tab: whether to open the target in a new tab
     """
     path = target if isinstance(target, str) else globals.page_routes[target]
-    globals.get_client().open(path)
+    globals.get_client().open(path, new_tab)

nicegui/templates/index.html

@@ -261,7 +261,11 @@
               }
             },
             run_javascript: (msg) => runJavascript(msg['code'], msg['request_id']),
-            open: (msg) => (location.href = msg.startsWith('/') ? "{{ prefix | safe }}" + msg : msg),
+            open: (msg) => {
+              const url = msg.path.startsWith('/') ? "{{ prefix | safe }}" + msg.path : msg.path;
+              const target = msg.new_tab ? '_blank' : '_self';
+              window.open(url, target);
+            },
             download: (msg) => download(msg.url, msg.filename),
             notify: (msg) => Quasar.Notify.create(msg),
           };

tests/test_open.py

@@ -0,0 +1,18 @@
+import pytest
+
+from nicegui import ui
+
+from .screen import Screen
+
+
+@pytest.mark.parametrize('new_tab', [False, True])
+def test_open_page(screen: Screen, new_tab: bool):
+    @ui.page('/test_page')
+    def page():
+        ui.label('Test page')
+    ui.button('Open test page', on_click=lambda: ui.open('/test_page', new_tab=new_tab))
+
+    screen.open('/')
+    screen.click('Open test page')
+    screen.switch_to(1 if new_tab else 0)
+    screen.should_contain('Test page')