feature-flags

Gestiona los feature flags de React a través de canales, prueba condicionalmente las gate tests y depura fallos de prueba específicos de flags. Cuatro archivos de flags controlan los valores predeterminados y las anulaciones específicas de canal (canary, www, React Native, test renderer) con flags __VARIANT__ que simulan gatekeepers probados en ambos estados. Usa la pragma @gate flagName para omitir pruebas por completo cuando un flag no está disponible, o gate() en línea para bifurcar aserciones cuando el comportamiento difiere. Agregar un nuevo flag requiere entradas en el archivo principal más todos los archivos fork;...

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')

Más skills de facebook

gc-safe-coding
facebook
Para la explicación completa y el fundamento, consulta doc/GCSafeCoding.md.
app-review-prep
facebook
Prepara una app de Meta para App Review: comprueba el estado actual, los requisitos pendientes, los privilegios concedidos y el historial de envíos. Úsalo antes de enviar una app…
api-health
facebook
Monitorea la salud de la API para una app de Meta: verifica límites de tasa, volumen de llamadas y deprecaciones de API. Úsalo para diagnosticar limitaciones, planificar capacidad o prepararse para versiones de API…
debug-webhooks
facebook
Soluciona problemas de webhooks para una aplicación de Meta — inspecciona las suscripciones activas, identifica configuraciones incorrectas y envía cargas de prueba para verificar la entrega. Usa cuando…
api-integration
facebook
Guía a un desarrollador para configurar una integración de la API de Meta desde cero: descubre las APIs adecuadas, obtiene guías de configuración, requisitos de autenticación,…
webhook-setup
facebook
Configura webhooks para una app de Meta de principio a fin: descubre los temas disponibles, suscríbete a campos y verifica con una carga de prueba. Úsalo al configurar webhooks para…
test-ui
facebook
Prueba el sistema de UI (PanelUI, ScreenSpace) contra el ejemplo de poke usando la CLI de iwsdk.
flags
facebook
We need to translate the given text from English to Spanish. The text describes a skill for inspecting and comparing feature flag states across React release channels. We must preserve product names, protocol names, URLs, numbers, and technical terms. The name "flags" is not in the text, so we don't include it. We translate only the text inside <text>. No extra commentary, labels, etc. The text: "Inspect and compare feature flag states across React release channels. View all flags across channels (www, www-modern, canary, next, experimental, rn variants) or compare specific channels with --diff Output formats include default table view, CSV export, and cleanup status grouping Flag states indicated by symbols: enabled (✅), disabled (❌), variant testing (🧪), profiling-only (📊) Common pitfall: __VARIANT__ flags are tested in both states on www; use --diff to spot meaningful..." We need to translate to Spanish. Keep technical terms like "React", "www", "www-modern", "canary",