feature-flags

作者: facebook

管理跨渠道的 React 功能標誌、條件式閘道測試,以及除錯特定標誌的測試失敗。四個標誌檔案控制預設值與特定頻道的覆蓋設定(canary、www、React Native、測試渲染器),其中 __VARIANT__ 標誌模擬在兩種狀態下測試的閘道守護者。使用 @gate flagName 編譯指示可在標誌不可用時完全跳過測試,或使用內聯 gate() 在行為不同時分支斷言。新增標誌需要在主檔案及所有分支檔案中新增條目;...

npx skills add https://github.com/facebook/react --skill feature-flags

React Feature Flags

Flag Files

FilePurpose
packages/shared/ReactFeatureFlags.jsDefault flags (canary), __EXPERIMENTAL__ overrides
packages/shared/forks/ReactFeatureFlags.www.jswww channel, __VARIANT__ overrides
packages/shared/forks/ReactFeatureFlags.native-fb.jsReact Native, __VARIANT__ overrides
packages/shared/forks/ReactFeatureFlags.test-renderer.jsTest renderer

Gating Tests

@gate pragma (test-level)

Use when the feature is completely unavailable without the flag:

// @gate enableViewTransition
it('supports view transitions', () => {
  // This test only runs when enableViewTransition is true
  // and is SKIPPED (not failed) when false
});

gate() inline (assertion-level)

Use when the feature exists but behavior differs based on flag:

it('renders component', async () => {
  await act(() => root.render(<App />));

  if (gate(flags => flags.enableNewBehavior)) {
    expect(container.textContent).toBe('new output');
  } else {
    expect(container.textContent).toBe('legacy output');
  }
});

Adding a New Flag

  1. Add to ReactFeatureFlags.js with default value
  2. Add to each fork file (*.www.js, *.native-fb.js, etc.)
  3. If it should vary in www/RN, set to __VARIANT__ in the fork file
  4. Gate tests with @gate flagName or inline gate()

Checking Flag States

Use /flags to view states across channels. See the flags skill for full command options.

__VARIANT__ Flags (GKs)

Flags set to __VARIANT__ simulate gatekeepers - tested twice (true and false):

/test www <pattern>              # __VARIANT__ = true
/test www variant false <pattern> # __VARIANT__ = false

Debugging Channel-Specific Failures

  1. Run /flags --diff <channel1> <channel2> to compare values
  2. Check @gate conditions - test may be gated to specific channels
  3. Run /test <channel> <pattern> to isolate the failure
  4. Verify flag exists in all fork files if newly added

Common Mistakes

  • Forgetting both variants - Always test www AND www variant false for __VARIANT__ flags
  • Using @gate for behavior differences - Use inline gate() if both paths should run
  • Missing fork files - New flags must be added to ALL fork files, not just the main one
  • Wrong gate syntax - It's gate(flags => flags.name), not gate('name')

來自 facebook 的更多技能

api-health
facebook
監控 Meta 應用程式的 API 健康狀態 — 檢查速率限制、呼叫量與 API 棄用情況。用於診斷節流問題、規劃容量,或為 API 版本…做好準備。
official
api-integration
facebook
Guide a developer through setting up a Meta API integration from scratch — discovers the right APIs, fetches setup guides, authentication requirements,…
official
app-review-prep
facebook
準備將 Meta 應用程式提交至 App Review——檢查目前狀態、未完成的要求、已授予的權限及提交紀錄。請在提交應用程式前使用……
official
debug-webhooks
facebook
Troubleshoot webhook issues for a Meta app — inspect active subscriptions, identify misconfiguration, and send test payloads to verify delivery. Use when…
official
webhook-setup
facebook
Set up webhooks for a Meta app end-to-end — discover available topics, subscribe to fields, and verify with a test payload. Use when configuring webhooks for…
official
buck2-rule-basics
facebook
Guide users through writing their first Buck2 rule to learn fundamental concepts including rules, actions, targets, configurations, analysis, and select(). Use…
official
add-ir-instruction
facebook
Guide for adding a new IR instruction to the Hermes compiler. Use when the user asks to add, create, or define a new IR instruction (Inst/Instruction) in the…
official
binary-size-analysis
facebook
當使用者想要分析 hermesvm 在一系列提交中的二進位大小變化時,應使用此技能。當使用者提及「二進位大小」時使用……
official