Skip to content

Утилиты для тестирования

ts
import {
  createTestFeatureProvider,
  withFeatures,
  setTestFlag,
  resetTestProvider,
} from 'vue-feature-toggles/testing'

Точка входа vue-feature-toggles/testing исключена из продакшен-бандла.

Монтирование с флагами

ts
import { mount } from '@vue/test-utils'
import { withFeatures } from 'vue-feature-toggles/testing'

const wrapper = mount(
  MyComponent,
  withFeatures({
    newDashboard: true,
    betaSearch: false,
  }),
)

Полный доступ к провайдеру в тестах

ts
import { createTestFeatureProvider } from 'vue-feature-toggles/testing'

const { install, provider } = createTestFeatureProvider({ newDashboard: true })

const wrapper = mount(MyComponent, {
  global: { plugins: [{ install }] },
})

provider.setFlag('newDashboard', false)
await nextTick()

Изменение флагов посреди теста

ts
import { setTestFlag } from 'vue-feature-toggles/testing'

it('hides the component when flag is off', async () => {
  const wrapper = mount(MyComponent, withFeatures({ betaSearch: true }))
  expect(wrapper.find('[data-testid="beta"]').exists()).toBe(true)

  await setTestFlag('betaSearch', false) // автоматически дожидается nextTick
  expect(wrapper.find('[data-testid="beta"]').exists()).toBe(false)
})

setTestFlag() работает с последним созданным тестовым провайдером — если тест создаёт больше одного провайдера параллельно (например, два вызова createTestFeatureProvider()/withFeatures() выполняются одновременно), она всегда нацелена на последний созданный, не обязательно на тот, что тестируется.

Очистка

ts
import { resetTestProvider } from 'vue-feature-toggles/testing'

afterEach(() => resetTestProvider())