mcpField
I
implementing-new-features

implementing-new-features

github.com/streamlit開発46.2k68 回インストール今日更新
リポジトリ

implementing-new-features について

Streamlitの機能をバックエンド、フロントエンド、protobuf層に実装するための開発ガイドです。Python、Vitest、Playwrightのテストを追加し、修正と検証を行う順序を示します。

主な機能

  1. 01バックエンド・フロントエンド・protobufの実装順
  2. 02Pythonユニットテストの指針
  3. 03Vitestフロントエンドテストの指針
  4. 04Playwright E2Eテストの指針
  5. 05autofixとmake checkによる検証

活用シーン

  1. 01複数レイヤーにまたがる機能変更の計画
  2. 02新しいStreamlit要素へのテスト追加
  3. 03実装完了前の検証

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/streamlit/streamlit --skill implementing-new-features

インストール後、Claude Code で/implementing-new-featuresを入力して読み込まれたか確認します。

詳細

新機能実装ガイド

基盤となるアーキテクチャ(バックエンドランタイム、フロントエンドレンダリング、WebSocket 通信、要素ツリー)を理解するには、understanding-streamlit-architecture スキルを参照してください。

ほとんどの機能は次の 3 つの領域で実装する必要があります。

  • バックエンド: lib/streamlit/
  • フロントエンド: frontend/
  • Protobuf: proto/

新機能には次を含める必要があります。

  • lib/tests 内の Python ユニットテスト
  • Vitest ユニットテスト
  • e2e_playwright/ 内の E2E Playwright テスト

実装の順序

  1. proto/ 内での Protobuf の変更、その後 make protobuf を実行

    • 新しい要素: proto/streamlit/proto/Element.proto に追加
  2. lib/streamlit/ 内のバックエンド

    • 新しい要素: lib/streamlit/__init__.py に追加
  3. lib/tests 内の Python ユニットテスト

    • 実行: uv run pytest lib/tests/streamlit/the_test_name.py
    • 新しい要素: lib/tests/streamlit/element_mocks.py に追加
  4. frontend/ 内のフロントエンド

    • 新しい要素: frontend/lib/src/components/core/Block/ElementNodeRenderer.tsx に追加
  5. *.test.tsx 内の Vitest テスト

    • 実行: cd frontend && yarn vitest lib/src/components/elements/NewElement/NewElement.test.tsx
  6. e2e_playwright/ 内の E2E Playwright テスト

    • 実行: make run-e2e-test e2e_playwright/name_of_the_test.py
  7. フォーマットとリンティングの自動修正: make autofix

  8. 実装の検証: make check

コメント