implementing-feature

bởi streamlit

Triển khai một tính năng từ bản đặc tả sản phẩm/kỹ thuật, URL hoặc vấn đề GitHub. Đọc bản đặc tả, triển khai tính năng theo các mẫu Streamlit và tạo ra một…

npx skills add https://github.com/streamlit/streamlit --skill implementing-feature

Implementing feature

Implement a feature from a specification document, from reading the spec through to a merge-ready PR.

Usage examples

Use by pointing to a spec folder:

/implementing-feature specs/2025-12-12-menu-button

Or with a URL to a raw document:

/implementing-feature https://raw.githubusercontent.com/streamlit/streamlit/refs/heads/develop/specs/2025-12-12-menu-button/product-spec.md

Or with a GitHub issue (feature request as spec):

/implementing-feature https://github.com/streamlit/streamlit/issues/12345

When to use

  • You have a spec folder, URL, or GitHub issue to implement
  • You want end-to-end implementation: spec → code → tests → PR
  • You want a guided workflow that ensures all implementation steps are followed

Workflow

Copy this checklist and track your progress:

Progress:
- [ ] Phase 1: Read and understand the spec
- [ ] Phase 2: Research and plan
- [ ] Phase 3: Implement and test
- [ ] Phase 4: Verify against spec
- [ ] Phase 5: Finalize for merge

Phase 1: Read and understand the spec

  • If given a folder path (e.g., specs/YYYY-MM-DD-feature-name):
    • Read all files in the folder (specs, images, code samples)
  • If given a URL to a raw document:
    • Fetch the spec content directly from the URL
  • If given a GitHub issue URL:
    • Use the gh client to read the issue and all comments
    • Treat the issue description and discussion as the feature specification

Phase 2: Research and plan

Run this phase in a foreground subagent. The subagent should:

  • Search for similar existing features to follow patterns
  • Use the /understanding-streamlit-architecture skill to understand relevant internals
  • Always write an implementation plan to work-tmp/<feature-name>-implementation-plan.md, where <feature-name> is derived from the branch name (e.g., git branch --show-current | sed 's|.*/||') or, if on a detached HEAD, the spec folder basename

The implementation plan must include:

  • Summary of the feature requirements (from spec)
  • Relevant existing patterns found in codebase
  • List of files to create or modify (backend, frontend, proto, tests)
  • Implementation steps in order
  • Key decisions and trade-offs
  • Test strategy (unit tests, E2E tests)

Wait for the subagent to complete and verify the implementation plan exists before proceeding.

Phase 3: Implement and test

Run this phase in a foreground subagent. Provide all relevant context needed to implement the feature, including the full spec content, the implementation plan from Phase 2, and any key API signatures or patterns identified during research.

The subagent should:

  • Implement the feature based on the spec and plan. Read wiki/new-feature-guide.md for tips.
  • Do additional research if anything is unclear or missing from the provided context
  • Run make protobuf after any protobuf changes
  • Add unit tests (Python in lib/tests/, frontend co-located) and E2E tests in e2e_playwright/
  • Use the /debugging-streamlit skill to test and debug backend, frontend, and UI
  • Return a summary of key implementation decisions and any spec divergences

Phase 4: Verify against spec

  • Re-read the spec to verify all requirements are met; document any necessary divergences in work-tmp/
  • Run the /qa-testing-feature subagent to perform comprehensive QA testing of the implementation. Provide:
    • A brief description of the feature being tested
    • Paths to relevant documents (spec, implementation plan, API files with docstrings)
  • Review the QA report and address any issues found before proceeding

Phase 5: Finalize for merge

  • Run /finalizing-pr skill to execute quality checks, create the PR, and make it merge-ready
  • Follow all steps until the PR is merge-ready

Important notes

  • Be fully autonomous - Do NOT stop or pause to ask for confirmation. You are tasked to go from spec to merge-ready PR without human intervention. Note any open questions or ambiguities in the PR description rather than blocking on them.
  • Use foreground subagents - Phases 2 and 3 run as foreground (blocking) subagents to preserve main context while delegating intensive research and implementation work.
  • Follow Streamlit patterns - Check existing similar features for conventions
  • Reference the spec in PR - Include spec link in PR description
  • Test thoroughly - Use /debugging-streamlit before finalizing

Thêm skills từ streamlit

developing-with-streamlit
streamlit
**[BẮT BUỘC]** Sử dụng cho TẤT CẢ các tác vụ Streamlit: tạo, chỉnh sửa, gỡ lỗi, làm đẹp, tạo kiểu, tạo chủ đề hoặc tối ưu hóa ứng dụng Streamlit. Cũng bắt buộc…
official
addressing-pr-review-comments
streamlit
Giải quyết tất cả các nhận xét đánh giá hợp lệ trên một PR cho nhánh hiện tại trong kho lưu trữ streamlit/streamlit. Bao gồm cả nhận xét đánh giá nội dòng và nhận xét PR chung (vấn đề)…
official
checking-changes
streamlit
Xác thực tất cả các thay đổi mã nguồn trước khi commit bằng cách chạy các kiểm tra định dạng, lint, kiểu và kiểm thử đơn vị. Sử dụng sau khi thực hiện thay đổi backend (Python) hoặc frontend (TypeScript)…
official
discovering-make-commands
streamlit
Liệt kê các lệnh make có sẵn cho phát triển Streamlit. Sử dụng cho các tác vụ build, test, lint hoặc format.
official
finalizing-pr
streamlit
Hoàn thiện các thay đổi trên nhánh để chuẩn bị hợp nhất bằng cách đơn giản hóa mã, chạy kiểm tra, xem xét thay đổi và tạo PR nếu cần. Sử dụng khi sẵn sàng hợp nhất các thay đổi vào…
official
fixing-flaky-e2e-tests
streamlit
Chẩn đoán và sửa các bài kiểm tra e2e Playwright không ổn định. Sử dụng khi các bài kiểm tra thất bại không liên tục, hiển thị lỗi hết thời gian chờ, có sự không khớp ảnh chụp nhanh hoặc hiển thị các vấn đề cụ thể theo trình duyệt…
official
fixing-streamlit-ci
streamlit
Phân tích và sửa các công việc CI GitHub Actions bị lỗi cho nhánh/PR hiện tại. Sử dụng khi kiểm tra CI thất bại, kiểm tra PR hiển thị lỗi, hoặc bạn cần chẩn đoán…
official
generating-changelog
streamlit
Tạo ghi chú phát hành trang web được trau chuốt giữa hai thẻ git cho docs.streamlit.io. Sử dụng khi chuẩn bị một bản phát hành Streamlit mới hoặc xem xét các thay đổi giữa…
official