Skip to content
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .changeset/light-lemons-smoke.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
"@self/app": patch
"@self/spa": patch
"gradio": patch
---

fix:Fix custom `js` param
2 changes: 2 additions & 0 deletions demo/blocks_js_load/run.py
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,8 @@ def welcome(name):

return 'Animation created';
}

createGradioAnimation();
"""

with gr.Blocks() as demo:
Expand Down
3 changes: 1 addition & 2 deletions gradio/blocks.py
Original file line number Diff line number Diff line change
Expand Up @@ -2497,7 +2497,7 @@ def launch(
theme: A Theme object or a string representing a theme. If a string, will look for a built-in theme with that name (e.g. "soft" or "default"), or will attempt to load a theme from the Hugging Face Hub (e.g. "gradio/monochrome"). If None, will use the Default theme.
css: Custom css as a code string. This css will be included in the demo webpage.
css_paths: Custom css as a pathlib.Path to a css file or a list of such paths. This css files will be read, concatenated, and included in the demo webpage. If the `css` parameter is also set, the css from `css` will be included first.
js: Custom js as a code string. The custom js should be in the form of a single js function. This function will automatically be executed when the page loads. For more flexibility, use the head parameter to insert js inside <script> tags.
js: Custom js as a code string. The js code will automatically be executed when the page loads. For more flexibility, use the head parameter to insert js inside <script> tags.
head: Custom html code to insert into the head of the demo webpage. This can be used to add custom meta tags, multiple scripts, stylesheets, etc. to the page.
head_paths: Custom html code as a pathlib.Path to a html file or a list of such paths. This html files will be read, concatenated, and included in the head of the demo webpage. If the `head` parameter is also set, the html from `head` will be included first.
Returns:
Expand Down Expand Up @@ -2647,7 +2647,6 @@ def reverse(text):
print(self.mcp_error)

self.config = self.get_config_file()

if self.is_running:
if not isinstance(self.local_url, str):
raise ValueError(f"Invalid local_url: {self.local_url}")
Expand Down
10 changes: 10 additions & 0 deletions js/app/src/routes/[...catchall]/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -292,6 +292,16 @@
window.parent.postMessage(supports_zerogpu_headers, origin);
}
if (config.js) {
try {
const script = document.createElement("script");
script.textContent = config.js;
document.head.appendChild(script);
} catch (e) {
console.error("Error executing custom JS:", e);
}
}
dispatch("loaded");
if (config.dev_mode) {
setTimeout(() => {
Expand Down
10 changes: 9 additions & 1 deletion js/spa/src/Index.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -375,7 +375,15 @@
if (config.deep_link_state === "invalid") {
pending_deep_link_error = true;
}
if (config.js) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was originally running in the other onMount block, but that one runs before the config is set so I was getting an error when running this locally. Pushed a fix and now its working

try {
const script = document.createElement("script");
script.textContent = config.js;
document.head.appendChild(script);
} catch (e) {
console.error("Error executing custom JS:", e);
}
}
if (config.dev_mode) {
setTimeout(() => {
const { host } = new URL(api_url);
Expand Down
Loading