posit-dev / py-shiny

Shiny for Python
https://shiny.posit.co/py/
MIT License
1.11k stars 62 forks source link

Not possible to include CSS & Javascript #1427

Open Konkrad opened 1 month ago

Konkrad commented 1 month ago

Hello, my app fails when I include both CSS and Javascript, only one of them is loaded

Shiny version: 0.10.1 Example:

# app.py
from shiny import ui

ui.page_fluid(
    ui.head_content(ui.include_css("custom.css"), ui.include_js("script.js")),

    # You can also inline css by passing a dictionary with a `style` element.
    ui.div(
        {"style": "font-weight: bold;"},
        ui.p("Some text!"),
    )
)

What do I expect? That both custom.css and script.js will be added to the HTML.

What happens? One of them generates a 404 error

Screenshot from 2024-05-27 11-20-49

Konkrad commented 1 month ago

Workaround: Create a separate folder for each file. Problem should be somewhere here: https://github.com/posit-dev/py-shiny/blob/33c8c79b7edf28f2e0d1d1e2b6051eed084d15ad/shiny/ui/_include_helpers.py#L215

Konkrad commented 1 month ago

Furthermore, I discovered that when you use (in the core syntax)

app_ui = ui.page_output("page_generator")

and return both in the headers, it will not be copied too

    @output
    @render.ui
    def page_generator():
        return ui.page_fillable(
            ui.head_content(ui.include_css(Path(__file__).parent / "css/style.css")),
            ui.head_content(
                ui.include_js(Path(__file__).parent / "js/script.js"),
            ),