From 8efc807ee870663bb748aee3488d43bf9f6bacbe Mon Sep 17 00:00:00 2001 From: Will Chen Date: Tue, 5 Nov 2024 14:46:31 -0800 Subject: [PATCH] Send experiment settings on initial page load (#1093) --- mesop/protos/ui.proto | 7 ----- mesop/server/server.py | 9 ------ mesop/server/static_file_serving.py | 21 ++++++++++++- mesop/web/src/app/editor/index.html | 1 + mesop/web/src/app/prod/index.html | 1 + mesop/web/src/services/channel.ts | 11 ------- mesop/web/src/services/experiment_service.ts | 31 ++++++++++++++++++-- 7 files changed, 50 insertions(+), 31 deletions(-) diff --git a/mesop/protos/ui.proto b/mesop/protos/ui.proto index 3ec822d6..8eb5f653 100644 --- a/mesop/protos/ui.proto +++ b/mesop/protos/ui.proto @@ -172,15 +172,8 @@ message RenderEvent { // Only sent in editor mode: repeated ComponentConfig component_configs = 5; - // Only sent in initial render: - optional ExperimentSettings experiment_settings = 7; } -message ExperimentSettings { - optional bool experimental_editor_toolbar_enabled = 1; - optional bool concurrent_updates_enabled = 2; - optional bool websockets_enabled = 3; -} // UI response event for updating state. message UpdateStateEvent { diff --git a/mesop/server/server.py b/mesop/server/server.py index 16d017b4..9c463c73 100644 --- a/mesop/server/server.py +++ b/mesop/server/server.py @@ -16,8 +16,6 @@ from mesop.component_helpers import diff_component from mesop.editor.component_configs import get_component_configs from mesop.env.env import ( - EXPERIMENTAL_EDITOR_TOOLBAR_ENABLED, - MESOP_CONCURRENT_UPDATES_ENABLED, MESOP_WEBSOCKETS_ENABLED, ) from mesop.events import LoadEvent @@ -101,13 +99,6 @@ def render_loop( f"/{WEB_COMPONENTS_PATH_SEGMENT}{js_module}" for js_module in js_modules ], - experiment_settings=pb.ExperimentSettings( - websockets_enabled=MESOP_WEBSOCKETS_ENABLED, - concurrent_updates_enabled=MESOP_CONCURRENT_UPDATES_ENABLED, - experimental_editor_toolbar_enabled=EXPERIMENTAL_EDITOR_TOOLBAR_ENABLED, - ) - if init_request - else None, ) ) yield serialize(data) diff --git a/mesop/server/static_file_serving.py b/mesop/server/static_file_serving.py index f0899cf4..5992740b 100644 --- a/mesop/server/static_file_serving.py +++ b/mesop/server/static_file_serving.py @@ -1,5 +1,6 @@ import gzip import io +import json import mimetypes import os import re @@ -12,7 +13,12 @@ from flask import Flask, Response, g, make_response, request, send_file from werkzeug.security import safe_join -from mesop.env.env import get_app_base_path +from mesop.env.env import ( + EXPERIMENTAL_EDITOR_TOOLBAR_ENABLED, + MESOP_CONCURRENT_UPDATES_ENABLED, + MESOP_WEBSOCKETS_ENABLED, + get_app_base_path, +) from mesop.exceptions import MesopException from mesop.runtime import runtime from mesop.server.constants import WEB_COMPONENTS_PATH_SEGMENT @@ -75,6 +81,19 @@ def retrieve_index_html() -> io.BytesIO | str: for stylesheet in page_config.stylesheets ] ) + if ( + line.strip() == "" + ): + experiment_settings = { + "websocketsEnabled": MESOP_WEBSOCKETS_ENABLED, + "concurrentUpdatesEnabled": MESOP_CONCURRENT_UPDATES_ENABLED, + "experimentalEditorToolbarEnabled": EXPERIMENTAL_EDITOR_TOOLBAR_ENABLED, + } + lines[i] = f""" + + """ # Create a BytesIO object from the modified lines modified_file_content = "".join(lines) diff --git a/mesop/web/src/app/editor/index.html b/mesop/web/src/app/editor/index.html index ea81d0d1..7a545d4c 100644 --- a/mesop/web/src/app/editor/index.html +++ b/mesop/web/src/app/editor/index.html @@ -18,6 +18,7 @@ + diff --git a/mesop/web/src/app/prod/index.html b/mesop/web/src/app/prod/index.html index 838047c0..9e427358 100644 --- a/mesop/web/src/app/prod/index.html +++ b/mesop/web/src/app/prod/index.html @@ -18,6 +18,7 @@ + diff --git a/mesop/web/src/services/channel.ts b/mesop/web/src/services/channel.ts index 9b291c5e..fca2b1d5 100644 --- a/mesop/web/src/services/channel.ts +++ b/mesop/web/src/services/channel.ts @@ -305,17 +305,6 @@ export class Channel { } else { this.rootComponent = rootComponent; } - const experimentSettings = uiResponse - .getRender()! - .getExperimentSettings(); - if (experimentSettings) { - this.experimentService.websocketsEnabled = - experimentSettings.getWebsocketsEnabled() ?? false; - this.experimentService.concurrentUpdatesEnabled = - experimentSettings.getConcurrentUpdatesEnabled() ?? false; - this.experimentService.experimentalEditorToolbarEnabled = - experimentSettings.getExperimentalEditorToolbarEnabled() ?? false; - } this.componentConfigs = uiResponse .getRender()! diff --git a/mesop/web/src/services/experiment_service.ts b/mesop/web/src/services/experiment_service.ts index 1c67afe1..28fcf471 100644 --- a/mesop/web/src/services/experiment_service.ts +++ b/mesop/web/src/services/experiment_service.ts @@ -1,10 +1,35 @@ import {Injectable} from '@angular/core'; +interface ExperimentSettings { + readonly websocketsEnabled: boolean; + readonly concurrentUpdatesEnabled: boolean; + readonly experimentalEditorToolbarEnabled: boolean; +} + @Injectable({ providedIn: 'root', }) export class ExperimentService { - concurrentUpdatesEnabled = false; - experimentalEditorToolbarEnabled = false; - websocketsEnabled = false; + private readonly settings: ExperimentSettings; + + constructor() { + const windowSettings = (window as any).__MESOP_EXPERIMENTS__; + this.settings = windowSettings ?? { + websocketsEnabled: false, + concurrentUpdatesEnabled: false, + experimentalEditorToolbarEnabled: false, + }; + } + + get websocketsEnabled(): boolean { + return this.settings.websocketsEnabled; + } + + get concurrentUpdatesEnabled(): boolean { + return this.settings.concurrentUpdatesEnabled; + } + + get experimentalEditorToolbarEnabled(): boolean { + return this.settings.experimentalEditorToolbarEnabled; + } }