V2.0.0b7 (#1318)

- JavaScript components will now _automagically_ use ReactPy's internal version of ReactJS, even if the user forgot to call `import_reactjs` within `html.head(...)`. As a result, this adds a few improvements:
   - Components from `component_from_npm` can now piggy-back on ReactPy's internal ReactJS export to prevent bugs caused by ReactJS version mismatches.
   - Components from `component_from_file` and `component_from_string` no longer need to be compiled/built by the user (with `vite`, `webpack`, `rollup`, etc) if they only use the following imports: `react`, `react-dom`, `react-dom/client`, and `react/jsx-runtime`.
- Changes to test suite, fixtures, and tooling to allow pytest to run in parallel mode (via `hatch test --parallel`). This reduces test runtime from ~150 seconds to ~20 seconds on local machines.
- Fix bug where ReactJS components from `component_from_npm` could generate a `ReactDOM.createRoot was called on existing root` warning.
- Move `reactpy.pyscript` code into `reactpy.executors.pyscript`

Author: Archmonger

pyproject.toml

@@ -232,8 +232,8 @@ omit = [
   "src/reactpy/__init__.py",
   "src/reactpy/_console/*",
   "src/reactpy/__main__.py",
-  "src/reactpy/pyscript/layout_handler.py",
-  "src/reactpy/pyscript/component_template.py",
+  "src/reactpy/executors/pyscript/layout_handler.py",
+  "src/reactpy/executors/pyscript/component_template.py",
 ]
 
 [tool.coverage.report]

src/build_scripts/install_playwright.py

@@ -14,4 +14,4 @@
 # as *nix systems (such as WSL) return a failure code if there are *any* dependencies
 # that could be cleaned up via `sudo apt autoremove`. This occurs even if we weren't
 # the ones to install those dependencies in the first place.
-subprocess.run(["playwright", "install-deps"], check=False)  # noqa: S607
+subprocess.run(["playwright", "install-deps", "chromium"], check=False)  # noqa: S607

src/js/packages/@reactpy/client/src/bind.tsx

@@ -6,14 +6,11 @@ export async function infer_bind_from_environment() {
     const React = await import("react");
     // @ts-ignore
     const ReactDOM = await import("react-dom/client");
-
-    console.log(
-      "ReactPy detected 'ReactJS' to bind your JavaScript components.",
-    );
     return (node: HTMLElement) => reactjs_bind(node, React, ReactDOM);
   } catch {
-    console.debug(
-      "ReactPy did not detect a component binding function or a suitable 'importmap'. Using ReactPy's internal framework (Preact) to bind your JavaScript components.",
+    console.error(
+      "Unknown error occurred: 'react' is missing within this ReactPy environment! \
+      Your JavaScript components may not work as expected!",
     );
     return (node: HTMLElement) => local_preact_bind(node);
   }

src/js/packages/@reactpy/client/src/components.tsx

@@ -6,13 +6,13 @@ import type {
   ImportSourceBinding,
   ReactPyComponent,
   ReactPyVdom,
-  ReactPyClientInterface,
 } from "./types";
 import { createAttributes, createChildren, loadImportSource } from "./vdom";
+import type { ReactPyClient } from "./client";
 
-const ClientContext = createContext<ReactPyClientInterface>(null as any);
+const ClientContext = createContext<ReactPyClient>(null as any);
 
-export function Layout(props: { client: ReactPyClientInterface }): JSX.Element {
+export function Layout(props: { client: ReactPyClient }): JSX.Element {
   const currentModel: ReactPyVdom = useState({ tagName: "" })[0];
   const forceUpdate = useForceUpdate();
 

src/js/packages/@reactpy/client/src/vdom.tsx

@@ -1,4 +1,3 @@
-import type { ReactPyClientInterface } from "./types";
 import eventToObject from "event-to-object";
 import type {
   ReactPyVdom,
@@ -11,10 +10,11 @@ import type {
 } from "./types";
 import { infer_bind_from_environment } from "./bind";
 import log from "./logger";
+import type { ReactPyClient } from "./client";
 
 export async function loadImportSource(
   vdomImportSource: ReactPyVdomImportSource,
-  client: ReactPyClientInterface,
+  client: ReactPyClient,
 ): Promise<BindImportSource> {
   let module: ReactPyModule;
   if (vdomImportSource.sourceType === "URL") {
@@ -61,7 +61,7 @@ export async function loadImportSource(
 }
 
 function createImportSourceElement(props: {
-  client: ReactPyClientInterface;
+  client: ReactPyClient;
   module: ReactPyModule;
   binding: ReactPyModuleBinding;
   model: ReactPyVdom;
@@ -180,7 +180,7 @@ export function createChildren<Child>(
 
 export function createAttributes(
   model: ReactPyVdom,
-  client: ReactPyClientInterface,
+  client: ReactPyClient,
 ): { [key: string]: any } {
   return Object.fromEntries(
     Object.entries({
@@ -203,7 +203,7 @@ export function createAttributes(
 }
 
 function createEventHandler(
-  client: ReactPyClientInterface,
+  client: ReactPyClient,
   name: string,
   { target, preventDefault, stopPropagation }: ReactPyVdomEventHandler,
 ): [string, () => void] {
@@ -262,7 +262,7 @@ function createInlineJavaScript(
 class ReactPyChild extends HTMLElement {
   mountPoint: HTMLDivElement;
   binding: ImportSourceBinding | null = null;
-  _client: ReactPyClientInterface | null = null;
+  _client: ReactPyClient | null = null;
   _model: ReactPyVdom | null = null;
   currentImportSource: ReactPyVdomImportSource | null = null;
 
@@ -276,7 +276,7 @@ class ReactPyChild extends HTMLElement {
     this.appendChild(this.mountPoint);
   }
 
-  set client(value: ReactPyClientInterface) {
+  set client(value: ReactPyClient) {
     this._client = value;
   }
 

src/reactpy/__init__.py

@@ -19,11 +19,11 @@
     use_state,
 )
 from reactpy.core.vdom import Vdom
-from reactpy.pyscript.components import pyscript_component
+from reactpy.executors.pyscript.components import pyscript_component
 from reactpy.utils import Ref, reactpy_to_string, string_to_reactpy
 
 __author__ = "The Reactive Python Team"
-__version__ = "2.0.0b6"
+__version__ = "2.0.0b7"
 
 __all__ = [
     "Ref",

src/reactpy/core/_thread_local.py

@@ -8,7 +8,7 @@
 
 class ThreadLocal(Generic[_StateType]):  # nocov
     """Utility for managing per-thread state information. This is only used in
-    environments where ContextVars are not available, such as the `pyodide`
+    environments where ContextVars are not available, such as the `pyscript`
     executor."""
 
     def __init__(self, default: Callable[[], _StateType]):

src/reactpy/core/hooks.py

@@ -84,11 +84,7 @@ def __init__(
         self,
         initial_value: _Type | Callable[[], _Type],
     ) -> None:
-        if callable(initial_value):
-            self.value = initial_value()
-        else:
-            self.value = initial_value
-
+        self.value = initial_value() if callable(initial_value) else initial_value
         hook = HOOK_STACK.current_hook()
 
         def dispatch(new: _Type | Callable[[_Type], _Type]) -> None:
@@ -434,10 +430,7 @@ def use_callback(
     def setup(function: _CallbackFunc) -> _CallbackFunc:
         return memoize(lambda: function)
 
-    if function is not None:
-        return setup(function)
-    else:
-        return setup
+    return setup(function) if function is not None else setup
 
 
 class _LambdaCaller(Protocol):
@@ -553,17 +546,16 @@ def _try_to_infer_closure_values(
     func: Callable[..., Any] | None,
     values: Sequence[Any] | ellipsis | None,
 ) -> Sequence[Any] | None:
-    if values is ...:
-        if isinstance(func, FunctionType):
-            return (
-                [cell.cell_contents for cell in func.__closure__]
-                if func.__closure__
-                else []
-            )
-        else:
-            return None
-    else:
+    if values is not ...:
         return values
+    if isinstance(func, FunctionType):
+        return (
+            [cell.cell_contents for cell in func.__closure__]
+            if func.__closure__
+            else []
+        )
+    else:
+        return None
 
 
 def strictly_equal(x: Any, y: Any) -> bool:

src/reactpy/executors/asgi/pyscript.py

@@ -13,8 +13,11 @@
 from reactpy.executors.asgi.middleware import ReactPyMiddleware
 from reactpy.executors.asgi.standalone import ReactPy, ReactPyApp
 from reactpy.executors.asgi.types import AsgiWebsocketScope
+from reactpy.executors.pyscript.utils import (
+    pyscript_component_html,
+    pyscript_setup_html,
+)
 from reactpy.executors.utils import vdom_head_to_html
-from reactpy.pyscript.utils import pyscript_component_html, pyscript_setup_html
 from reactpy.types import ReactPyConfig, VdomDict
 
 

src/reactpy/executors/asgi/standalone.py

@@ -23,8 +23,8 @@
     AsgiV3WebsocketApp,
     AsgiWebsocketScope,
 )
+from reactpy.executors.pyscript.utils import pyscript_setup_html
 from reactpy.executors.utils import server_side_component_html, vdom_head_to_html
-from reactpy.pyscript.utils import pyscript_setup_html
 from reactpy.types import (
     PyScriptOptions,
     ReactPyConfig,