// Implementation guide for new Streamlit features. Use when adding new elements, widgets, or features that span backend, frontend, and protobufs.
| name | implementing-new-features |
| description | Implementation guide for new Streamlit features. Use when adding new elements, widgets, or features that span backend, frontend, and protobufs. |
Most features need implementation in three areas:
lib/streamlit/frontend/proto/New features should include:
lib/testse2e_playwright/Protobuf changes in proto/ then run make protobuf
proto/streamlit/proto/Element.protoBackend in lib/streamlit/
lib/streamlit/__init__.pyPython unit tests in lib/tests
uv run pytest lib/tests/streamlit/the_test_name.pylib/tests/streamlit/element_mocks.pyFrontend in frontend/
frontend/lib/src/components/core/Block/ElementNodeRenderer.tsxVitest tests in *.test.tsx
cd frontend && yarn vitest lib/src/components/elements/NewElement/NewElement.test.tsxE2E Playwright tests in e2e_playwright/
make run-e2e-test e2e_playwright/name_of_the_test.pyAutofix formatting and linting: make autofix
Verify the implementation: make check
Finalizes branch changes for merging by simplifying code, running checks, reviewing changes, and creating a PR if needed. Use when ready to merge changes into the target branch.
Creates a draft pull request on GitHub with proper labels, branch naming, and description formatting. Use when changes are ready to be submitted as a PR to the streamlit/streamlit repository.
Address all valid review comments on a PR for the current branch in the streamlit/streamlit repo. Use when a PR has received reviewer feedback that needs to be addressed, including code changes, style fixes, and documentation updates.
Debug Streamlit frontend and backend changes using make debug with hot-reload. Use when testing code changes, investigating bugs, checking UI behavior, or needing screenshots of the running app.
Lists available make commands for Streamlit development. Use for build, test, lint, or format tasks.
Validates all code changes before committing by running format, lint, type, and unit test checks. Use after making backend (Python) or frontend (TypeScript) changes, before committing or finishing a work session.