React Feature Flags Flag Files File Purpose packages/shared/ReactFeatureFlags.js Default flags (canary), EXPERIMENTAL overrides packages/shared/forks/ReactFeatureFlags.www.js www channel, VARIANT overrides packages/shared/forks/ReactFeatureFlags.native-fb.js React Native, VARIANT overrides packages/shared/forks/ReactFeatureFlags.test-renderer.js Test 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(
if (gate(flags => flags.enableNewBehavior)) { expect(container.textContent).toBe('new output'); } else { expect(container.textContent).toBe('legacy output'); } });
Adding a New Flag Add to ReactFeatureFlags.js with default value Add to each fork file (.www.js, .native-fb.js, etc.) If it should vary in www/RN, set to VARIANT in the fork file 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
Debugging Channel-Specific Failures
Run /flags --diff