Skip to content

Latest commit

 

History

History
913 lines (887 loc) · 21.7 KB

test.js.md

File metadata and controls

913 lines (887 loc) · 21.7 KB

Snapshot report for test.js

The actual snapshot is saved in test.js.snap.

Generated by AVA.

handles circle elements

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const CircleIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 12 A 4 4 0 0 1 16 20 A 4 4 0 0 1 16 12' />␊
      </svg>␊
    )␊

    CircleIcon.displayName = 'CircleIcon'␊

    CircleIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default CircleIcon`,
    name: 'Circle',
  },
]

handles polygon elements

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const PolygonIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 0 L 0 30 L 32 30 z' />␊
      </svg>␊
    )␊

    PolygonIcon.displayName = 'PolygonIcon'␊

    PolygonIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default PolygonIcon`,
    name: 'Polygon',
  },
]

handles rect elements

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const RectIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 2 9 H 30 V 23 H 2 z' />␊
      </svg>␊
    )␊

    RectIcon.displayName = 'RectIcon'␊

    RectIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default RectIcon`,
    name: 'Rect',
  },
]

returns an Icon.js component module

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const BasicIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M16,4l14,26H2L16,4z' />␊
      </svg>␊
    )␊

    BasicIcon.displayName = 'BasicIcon'␊

    BasicIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default BasicIcon`,
    name: 'Basic',
  },
  {
    content: `import React from 'react'␊

    const MultipathIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    MultipathIcon.displayName = 'MultipathIcon'␊

    MultipathIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default MultipathIcon`,
    name: 'Multipath',
  },
  {
    content: `import React from 'react'␊

    const DeepIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    DeepIcon.displayName = 'DeepIcon'␊

    DeepIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default DeepIcon`,
    name: 'Deep',
  },
  {
    content: `import React from 'react'␊

    const PolygonIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 0 L 0 30 L 32 30 z' />␊
      </svg>␊
    )␊

    PolygonIcon.displayName = 'PolygonIcon'␊

    PolygonIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default PolygonIcon`,
    name: 'Polygon',
  },
  {
    content: `import React from 'react'␊

    const CircleIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 12 A 4 4 0 0 1 16 20 A 4 4 0 0 1 16 12' />␊
      </svg>␊
    )␊

    CircleIcon.displayName = 'CircleIcon'␊

    CircleIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default CircleIcon`,
    name: 'Circle',
  },
  {
    content: `import React from 'react'␊

    const RectIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 2 9 H 30 V 23 H 2 z' />␊
      </svg>␊
    )␊

    RectIcon.displayName = 'RectIcon'␊

    RectIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default RectIcon`,
    name: 'Rect',
  },
  {
    content: `import React from 'react'␊
    import * as Icons from './index'␊

    const Icon = ({ name, ...props }) => {␊
      const Component = Icons[name]␊
      if (!Component) return false␊
      return <Component {...props} />␊
    }␊

    Icon.displayName = 'Icon'␊

    export default Icon`,
    name: 'Icon',
  },
  {
    content: `export { default as Basic } from './Basic'␊
    export { default as Multipath } from './Multipath'␊
    export { default as Deep } from './Deep'␊
    export { default as Polygon } from './Polygon'␊
    export { default as Circle } from './Circle'␊
    export { default as Rect } from './Rect'`,
    name: 'index',
  },
]

returns an index.js module

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const BasicIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M16,4l14,26H2L16,4z' />␊
      </svg>␊
    )␊

    BasicIcon.displayName = 'BasicIcon'␊

    BasicIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default BasicIcon`,
    name: 'Basic',
  },
  {
    content: `import React from 'react'␊

    const MultipathIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    MultipathIcon.displayName = 'MultipathIcon'␊

    MultipathIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default MultipathIcon`,
    name: 'Multipath',
  },
  {
    content: `import React from 'react'␊

    const DeepIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    DeepIcon.displayName = 'DeepIcon'␊

    DeepIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default DeepIcon`,
    name: 'Deep',
  },
  {
    content: `import React from 'react'␊

    const PolygonIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 0 L 0 30 L 32 30 z' />␊
      </svg>␊
    )␊

    PolygonIcon.displayName = 'PolygonIcon'␊

    PolygonIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default PolygonIcon`,
    name: 'Polygon',
  },
  {
    content: `import React from 'react'␊

    const CircleIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 12 A 4 4 0 0 1 16 20 A 4 4 0 0 1 16 12' />␊
      </svg>␊
    )␊

    CircleIcon.displayName = 'CircleIcon'␊

    CircleIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default CircleIcon`,
    name: 'Circle',
  },
  {
    content: `import React from 'react'␊

    const RectIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 2 9 H 30 V 23 H 2 z' />␊
      </svg>␊
    )␊

    RectIcon.displayName = 'RectIcon'␊

    RectIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default RectIcon`,
    name: 'Rect',
  },
  {
    content: `export { default as Basic } from './Basic'␊
    export { default as Multipath } from './Multipath'␊
    export { default as Deep } from './Deep'␊
    export { default as Polygon } from './Polygon'␊
    export { default as Circle } from './Circle'␊
    export { default as Rect } from './Rect'`,
    name: 'index',
  },
]

snapshot

Snapshot 1

[
  {
    content: `import React from 'react'␊

    const BasicIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M16,4l14,26H2L16,4z' />␊
      </svg>␊
    )␊

    BasicIcon.displayName = 'BasicIcon'␊

    BasicIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default BasicIcon`,
    name: 'Basic',
  },
  {
    content: `import React from 'react'␊

    const MultipathIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    MultipathIcon.displayName = 'MultipathIcon'␊

    MultipathIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default MultipathIcon`,
    name: 'Multipath',
  },
  {
    content: `import React from 'react'␊

    const DeepIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </svg>␊
    )␊

    DeepIcon.displayName = 'DeepIcon'␊

    DeepIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default DeepIcon`,
    name: 'Deep',
  },
  {
    content: `import React from 'react'␊

    const PolygonIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 0 L 0 30 L 32 30 z' />␊
      </svg>␊
    )␊

    PolygonIcon.displayName = 'PolygonIcon'␊

    PolygonIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default PolygonIcon`,
    name: 'Polygon',
  },
  {
    content: `import React from 'react'␊

    const CircleIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 16 12 A 4 4 0 0 1 16 20 A 4 4 0 0 1 16 12' />␊
      </svg>␊
    )␊

    CircleIcon.displayName = 'CircleIcon'␊

    CircleIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default CircleIcon`,
    name: 'Circle',
  },
  {
    content: `import React from 'react'␊

    const RectIcon = ({␊
      size,␊
      color,␊
      ...props␊
    }) => (␊
      <svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill={color}␊
      >␊
        <path d='M 2 9 H 30 V 23 H 2 z' />␊
      </svg>␊
    )␊

    RectIcon.displayName = 'RectIcon'␊

    RectIcon.defaultProps = {␊
      size: 24,␊
      color: 'currentcolor'␊
    }␊

    export default RectIcon`,
    name: 'Rect',
  },
]

snapshot with function template

Snapshot 1

[
  {
    content: 'hello',
    name: 'Basic',
  },
  {
    content: 'hello',
    name: 'Multipath',
  },
  {
    content: 'hello',
    name: 'Deep',
  },
  {
    content: 'hello',
    name: 'Polygon',
  },
  {
    content: 'hello',
    name: 'Circle',
  },
  {
    content: 'hello',
    name: 'Rect',
  },
]

snapshot with named template

Snapshot 1

[
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const BasicIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M16,4l14,26H2L16,4z' />␊
      </Svg>␊
    )␊

    BasicIcon.displayName = 'BasicIcon'␊

    BasicIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default BasicIcon`,
    name: 'Basic',
  },
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const MultipathIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </Svg>␊
    )␊

    MultipathIcon.displayName = 'MultipathIcon'␊

    MultipathIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default MultipathIcon`,
    name: 'Multipath',
  },
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const DeepIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M0 0 H32 V4 H0z M0 32 H32 V28 H0z' />␊
      </Svg>␊
    )␊

    DeepIcon.displayName = 'DeepIcon'␊

    DeepIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default DeepIcon`,
    name: 'Deep',
  },
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const PolygonIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M 16 0 L 0 30 L 32 30 z' />␊
      </Svg>␊
    )␊

    PolygonIcon.displayName = 'PolygonIcon'␊

    PolygonIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default PolygonIcon`,
    name: 'Polygon',
  },
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const CircleIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M 16 12 A 4 4 0 0 1 16 20 A 4 4 0 0 1 16 12' />␊
      </Svg>␊
    )␊

    CircleIcon.displayName = 'CircleIcon'␊

    CircleIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default CircleIcon`,
    name: 'Circle',
  },
  {
    content: `import React from 'react'␊
    import styled from 'styled-components'␊
    import { space, color } from 'styled-system'␊

    const Svg = styled('svg')({ flex: 'none' }, space, color)␊

    const RectIcon = ({␊
      size,␊
      ...props␊
    }) => (␊
      <Svg␊
        {...props}␊
        viewBox='0 0 32 32'␊
        width={size}␊
        height={size}␊
        fill='currentcolor'␊
      >␊
        <path d='M 2 9 H 30 V 23 H 2 z' />␊
      </Svg>␊
    )␊

    RectIcon.displayName = 'RectIcon'␊

    RectIcon.defaultProps = {␊
      size: 24␊
    }␊

    export default RectIcon`,
    name: 'Rect',
  },
]