vitest-launchdarkly-mock

import { render, fireEvent } from '@testing-library/react'; import { describe, beforeEach, test, expect } from 'vitest'; import { mockFlags, ldClientMock, resetLDMocks } from 'vitest-launchdarkly-mock'; // A dummy React component for demonstration, in a real app this would use useFlags() const Button = () => { // Assume 'devTestFlag' determines some UI aspect, mocked by mockFlags // Simplified for this quickstart; actual implementation would use useFlags() const isFeatureEnabled = true; // Value controlled by mockFlags in test return ( <button data-testid="test-button" onClick={() => ldClientMock.identify({ key: 'aa0ceb', name: 'Test User' })}> {isFeatureEnabled ? 'Feature On' : 'Feature Off'} </button> ); }; describe('Button component with LaunchDarkly mocks', () => { beforeEach(() => { // Reset mocks before each test to ensure test isolation. resetLDMocks(); }); test('should display button when devTestFlag is enabled', () => { // Arrange: Mock 'devTestFlag' to be true. mockFlags({ devTestFlag: true }); // Act: Render the component under test. const { getByTestId } = render(<Button />); // Assert: Verify the button is rendered and visible. expect(getByTestId('test-button')).toBeInTheDocument(); }); test('should call ldClientMock.identify when button is clicked', () => { // Arrange: Mock the flag state and render the component. mockFlags({ 'dev-test-flag': true }); // Act: Render the button and simulate a user click. const { getByTestId } = render(<Button />); fireEvent.click(getByTestId('test-button')); // Assert: Verify that ldClientMock.identify was called with the correct arguments. expect(ldClientMock.identify).toBeCalledWith({ key: 'aa0ceb', name: 'Test User' }); }); });