@openzeppelin/contracts-ui-builder-adapter-evm/src/wallet/rainbowkit/__tests__/export-service.test.ts

EVM Adapter for Contracts UI Builder

import { describe, expect, it } from 'vitest';

import type { UiKitConfiguration } from '@openzeppelin/contracts-ui-builder-types';

import { generateRainbowKitExportables } from '../export-service';

describe('RainbowKit Export Service', () => {
  describe('generateRainbowKitExportables', () => {
    it('should generate a valid RainbowKit config file with all properties', () => {
      // Arrange
      const uiKitConfig: UiKitConfiguration = {
        kitName: 'rainbowkit',
        kitConfig: {
          appName: 'My Test dApp',
          learnMoreUrl: 'https://test-dapp.com',
          // Note: other properties like 'projectId' are handled by the generator
        },
      };

      const expectedFilePath = 'src/config/wallet/rainbowkit.config.ts';

      // Act
      const result = generateRainbowKitExportables(uiKitConfig);
      const generatedCode = result[expectedFilePath];

      // Assert
      expect(result).toHaveProperty(expectedFilePath);
      expect(generatedCode).toContain('// RainbowKit configuration for your exported application');

      // Check for wagmiParams content
      expect(generatedCode).toContain("appName: 'My Test dApp'");
      expect(generatedCode).toContain("projectId: 'YOUR_PROJECT_ID'");

      // Check for appInfo content
      expect(generatedCode).toContain("learnMoreUrl: 'https://test-dapp.com'");
    });

    it('should generate a valid config with default learnMoreUrl when not provided', () => {
      // Arrange
      const uiKitConfig: UiKitConfiguration = {
        kitName: 'rainbowkit',
        kitConfig: {
          appName: 'Minimal dApp',
        },
      };
      const expectedFilePath = 'src/config/wallet/rainbowkit.config.ts';

      // Act
      const result = generateRainbowKitExportables(uiKitConfig);
      const generatedCode = result[expectedFilePath];

      // Assert
      expect(result).toHaveProperty(expectedFilePath);
      expect(generatedCode).toContain("appName: 'Minimal dApp'");

      // The generator provides a default value for learnMoreUrl
      expect(generatedCode).toContain("learnMoreUrl: 'https://openzeppelin.com'");
    });

    it('should use custom code when provided instead of generating default config', () => {
      // Arrange
      const customCode = `
import { getDefaultConfig } from '@rainbow-me/rainbowkit';
import { darkTheme } from '@rainbow-me/rainbowkit';

const rainbowKitAppConfig = {
  theme: darkTheme({
    accentColor: '#7b3ff2',
    accentColorForeground: 'white',
  }),
  coolMode: true,
};

export default rainbowKitAppConfig;
`;

      const uiKitConfig: UiKitConfiguration = {
        kitName: 'rainbowkit',
        kitConfig: {
          appName: 'My Test dApp',
          learnMoreUrl: 'https://test-dapp.com',
        },
        customCode, // Custom code should override generated config
      };

      const expectedFilePath = 'src/config/wallet/rainbowkit.config.ts';

      // Act
      const result = generateRainbowKitExportables(uiKitConfig);
      const generatedCode = result[expectedFilePath];

      // Assert
      expect(result).toHaveProperty(expectedFilePath);

      // Should use the custom code exactly as provided
      expect(generatedCode).toBe(customCode);

      // Should NOT contain the default generated content
      expect(generatedCode).not.toContain('// Generated by the OpenZeppelin Contracts UI Builder');
      expect(generatedCode).not.toContain('wagmiParams');

      // Should contain the custom theme configuration
      expect(generatedCode).toContain('darkTheme');
      expect(generatedCode).toContain('coolMode: true');
    });
  });
});