Merge pull request #2362 from frnhr/clientside-template-wrap

Wrapper function to avoid polluting global namespace

CHANGELOG.md

@@ -14,6 +14,10 @@ This project adheres to [Semantic Versioning](https://semver.org/).
   - `custom_spinner`  enables using a custom component for loading messages instead of built-in spinners
   - `display`  overrides the loading status with options for "show," "hide," or "auto"
 
+## Fixed
+
+- [#2362](https://github.com/plotly/dash/pull/2362) Global namespace not polluted any more when loading clientside callbacks.
+
 ## [2.16.1] - 2024-03-06
 
 ## Fixed

dash/_callback.py

@@ -502,9 +502,11 @@ def add_context(*args, **kwargs):
 
 
 _inline_clientside_template = """
-var clientside = window.dash_clientside = window.dash_clientside || {{}};
-var ns = clientside["{namespace}"] = clientside["{namespace}"] || {{}};
-ns["{function_name}"] = {clientside_function};
+(function() {{
+    var clientside = window.dash_clientside = window.dash_clientside || {{}};
+    var ns = clientside["{namespace}"] = clientside["{namespace}"] || {{}};
+    ns["{function_name}"] = {clientside_function};
+}})();
 """
 
 

tests/integration/clientside/test_clientside.py

@@ -35,6 +35,10 @@ def update_output(value):
     dash_duo.wait_for_text_to_equal("#output-serverside", 'Server says "hello world"')
     dash_duo.wait_for_text_to_equal("#output-clientside", 'Client says "hello world"')
 
+    assert dash_duo.driver.execute_script("return 'dash_clientside' in window")
+    assert dash_duo.driver.execute_script("return !('clientside' in window)")
+    assert dash_duo.driver.execute_script("return !('ns' in window)")
+
 
 def test_clsd002_chained_serverside_clientside_callbacks(dash_duo):
     app = Dash(__name__, assets_folder="assets")