Supports Custom Streamlit Components Consistently Fail to Load in IDX - Even with ngrok Tunneling
Bug: Streamlit Components Fail in IDX
Summary: Custom Streamlit components consistently fail to load in Project IDX, even w/ ngrok. Error: "app.[comp] from [ngrok_url] hasn't received Streamlit.setComponentReady()." Suggests IDX bug.
To Reproduce: 1. IDX. 2. Basic Streamlit (app.py
) + React/Webpack component (frontend/
). 3. Simple React comp: Streamlit.setComponentReady()
on mount. 4. package.json
: webpack serve
, Webpack: streamlit
external. 5. ngrok.yml
: ports 3001, 8501. 6. devserver.sh
: ngrok, URLs, start Streamlit. 7. ./build.sh
. 8. Start: npm start
, ngrok start --all
, ./devserver.sh
. 9. Access Streamlit.
Expected: Component loads.
Actual: Component fails. Error: "app.[comp] from [ngrok_url] hasn't received Streamlit.setComponentReady()."
Troubleshooting: 1. Minified comp. 2. Verified Streamlit.setComponentReady()
. 3. Correct Webpack. 4. ngrok used. 5. Browsers. 6. No index.html
. 7. Cleaned env. 8. Dev/prod. 9. Restarts.
Probable Cause: IDX's handling of component requests, even w/ ngrok. Internal proxy issue.
Impact: Impossible to dev/test Streamlit components in IDX.
Request: Investigate.
Code: Code in the env.
Info: Exhaustive troubleshooting done. Problem is in IDX.