Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement a script tag #544

Closed
Archmonger opened this issue Dec 11, 2021 · 2 comments · Fixed by #617
Closed

Implement a script tag #544

Archmonger opened this issue Dec 11, 2021 · 2 comments · Fixed by #617
Labels
priority-2-moderate Should be resolved on a reasonable timeline. type-feature About new capabilities
Milestone

Comments

@Archmonger
Copy link
Contributor

Archmonger commented Dec 11, 2021

Current Situation

There are several situations where the user might want to run simple JavaScript on-demand.

For example, in Django-IDOM when a sign out button is clicked, the user is signed out from the backend but there's no way to window.location.reload or set the current window.location = ....

Or, if using non-react libraries (ex. classic bootstrap), it would be convenient to be able to run $("#modal").toggle().

Proposed Changes

Allow components to have some way of running some arbitrary JavaScript.

Option 1: Script Parameter

idom.html.button("click me", script="window.location.reload()")

Option 2: Script Executor

# This feels like the most pythonic to exec a script
idom.exec_script("window.location.reload()");

Option 3: Script Tag

# This feels like the most IDOM-like method of script execution
# Should be executed if the internal contents of the `script` tag has changed.
idom.html.div(
    idom.html.script("window.location.reload()")
)

Option 4: Script Hook

@hooks.use_script
async def my_javascript(context):
    return "window.location.reload()"

Implementation Details

Will need to be careful to not eval this script on every component re-render.

See more details here.

@Archmonger Archmonger added the flag-triage Not prioritized. label Dec 11, 2021
@Archmonger
Copy link
Contributor Author

I added in a third option which I believe to be the easiest to develop, from IDOM's perspective.

@rmorshea
Copy link
Collaborator

rmorshea commented Jan 9, 2022

I think I like option 3 in order to make this front-end independent. For example a front-end can just choose not to support a script tag.

@rmorshea rmorshea added type-feature About new capabilities and removed flag-triage Not prioritized. labels Jan 9, 2022
@rmorshea rmorshea added this to the 1.0 milestone Jan 11, 2022
@rmorshea rmorshea changed the title Eval-able script parameter in components Implement a script tag Jan 11, 2022
@rmorshea rmorshea added the priority-2-moderate Should be resolved on a reasonable timeline. label Jan 13, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
priority-2-moderate Should be resolved on a reasonable timeline. type-feature About new capabilities
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants