wwf
2025-05-20 938c3e5a587ce950a94964ea509b9e7f8834dfae
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
import type { AbstractNode } from './utils'
import { generate, normalizeAttrs } from './utils'
import { render } from '@testing-library/react'
import '@testing-library/jest-dom'
 
describe('generate icon base utils', () => {
  describe('normalizeAttrs', () => {
    it('should normalize class to className', () => {
      const attrs = { class: 'test-class' }
      const result = normalizeAttrs(attrs)
      expect(result).toEqual({ className: 'test-class' })
    })
 
    it('should normalize style string to style object', () => {
      const attrs = { style: 'color:red;font-size:14px;' }
      const result = normalizeAttrs(attrs)
      expect(result).toEqual({ style: { color: 'red', fontSize: '14px' } })
    })
 
    it('should handle attributes with dashes and colons', () => {
      const attrs = { 'data-test': 'value', 'xlink:href': 'url' }
      const result = normalizeAttrs(attrs)
      expect(result).toEqual({ dataTest: 'value', xlinkHref: 'url' })
    })
  })
 
  describe('generate', () => {
    it('should generate React elements from AbstractNode', () => {
      const node: AbstractNode = {
        name: 'div',
        attributes: { class: 'container' },
        children: [
          {
            name: 'span',
            attributes: { style: 'color:blue;' },
            children: [],
          },
        ],
      }
 
      const { container } = render(generate(node, 'key'))
      // to svg element
      expect(container.firstChild).toHaveClass('container')
      expect(container.querySelector('span')).toHaveStyle({ color: 'blue' })
    })
 
    // add not has children
    it('should generate React elements without children', () => {
      const node: AbstractNode = {
        name: 'div',
        attributes: { class: 'container' },
      }
      const { container } = render(generate(node, 'key'))
      // to svg element
      expect(container.firstChild).toHaveClass('container')
    })
 
    it('should merge rootProps when provided', () => {
      const node: AbstractNode = {
        name: 'div',
        attributes: { class: 'container' },
        children: [],
      }
 
      const rootProps = { id: 'root' }
      const { container } = render(generate(node, 'key', rootProps))
      expect(container.querySelector('div')).toHaveAttribute('id', 'root')
    })
  })
})