fix: sidebar hint en CSS pur (cause: testid disparu en Streamlit 1.57) - #33
Merged
Conversation
Root cause of all prior failures: the JS queried [data-testid="stSidebarCollapsedControl"], which does not exist in Streamlit 1.57 — so the "sidebar closed" check was never true and the arrow never showed. Both st.html and st.components.v1.html also render in an iframe whose timers die on every Streamlit re-render, and st.components.v1.html is deprecated (removed after 2026-06-01). Replace the whole thing with pure CSS injected via st.markdown (renders inline in the main document, keeps <style>, no iframe, no JS): - The sidebar <section data-testid="stSidebar"> exposes aria-expanded="false" when collapsed; a body:has(...) selector shows the hint only then, so it vanishes the instant the sidebar opens. - animation-delay:20s provides the inactivity wait; a bounce keyframe animates the arrow. Drop the now-unused json and streamlit.components.v1 imports. https://claude.ai/code/session_01VTBKKYLiAQ6mDPdmVhpRAT
Up to standards ✅🟢 Issues
|
| Metric | Results |
|---|---|
| Complexity | 0 |
| Duplication | 0 |
NEW Get contextual insights on your PRs based on Codacy's metrics, along with PR and Jira context, without leaving GitHub. Enable AI reviewer
TIP This summary will be updated as you push new changes.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
La vraie cause racine (enfin trouvée)
En inspectant le frontend compilé de Streamlit 1.57 :
→ Le testid
stSidebarCollapsedControlque toutes les versions JS précédentes interrogeaient n'existe plus dans Streamlit 1.57. LequerySelectorne trouvait jamais le bouton, donc la condition « sidebar fermée » était toujours fausse et la flèche ne s'affichait jamais.En plus :
st.html()ETst.components.v1.html()rendent dans une iframe → les timers JS meurent à chaque re-render Streamlit.st.components.v1.htmlest déprécié (supprimé après 2026-06-01) → d'où le warning récurrent.Solution propre : CSS pur, zéro JS, zéro iframe
Injecté via
st.markdown(unsafe_allow_html=True)qui rend inline dans le document principal (garde les<style>, pas d'iframe, pas de dépréciation) :<section data-testid="stSidebar">portearia-expanded="false"quand fermée,"true"quand ouverte (vérifié dans le source 1.57).body:has(section[data-testid="stSidebar"][aria-expanded="false"]) #_sb_hintn'affiche la flèche que sidebar fermée → elle disparaît instantanément à l'ouverture, sans JS.animation-delay: 20sgère l'attente d'inactivité.sb-bouncepour l'animation de la flèche.Suppression des imports
jsonetstreamlit.components.v1devenus inutiles.Comportement
Note : sans JS/sessionStorage, si l'utilisateur referme la sidebar et attend 20s, l'indice réapparaît — comportement voulu et cohérent.
Test
https://claude.ai/code/session_01VTBKKYLiAQ6mDPdmVhpRAT
Generated by Claude Code