svg-jest

KO | EN

gitlite — search

#python #hacktoberfest #typescript #llm #golang #android #machine-learning #linux #nodejs #java #awesome-list #security #pytorch #openai

(★ 15)

A small utility for Jest for converting SVG files into react components for testing.

svg-jest 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# svg-jest

![npm](https://img.shields.io/npm/v/svg-jest)
![GitHub issues](https://img.shields.io/github/issues/half-halt/svg-jest)

This is a small library which transforms .SVG files for jest. It produces
and SVG in the stream.

The transformed item will have the following properties on it.
* data-jest-file-name: The name of the file (e.g. 'some-image.svg')
* data-jest-svg-name: Only the name portion of the file (e.g. 'some-image')
* data-testid: Same as data-jest-svg-name, but works with @testing-library/react getByTestId()

Works with both of these formats:

```js
import MySvg from '../images/an-image.svg';

import { ReactComponent as MySvg}  from '../images/an-image.svg';
```

The following JavaScript 
```js
const MyComponent = () => {
  return (
    <div>
	<MySvg/>
    </div>
  );
}
```
The resulting snapshot:

```html
<div>
    <AnImage/>
</div>
```

The resulting HTML:

```html
<div>
 <svg 
	data-jest-file-name='an-image.svg' 
	data-jest-svg-name='an-image' 
	data-testid='an-image'/>
</div>
```

In additoin, any properties passed to '<MySvg>' are passed along into both the snapshot
and the resulting trees.

# Usage
Configuring Jest, the example below uses package.json, but you can see: https://jestjs.io/docs/en/configuration for other examples.

```json
{
    "jest": {
        "transform": {
            "\\.svg$": "svg-jest"
        }
    }
}
```

svg-jest

svg-jest 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

svg-jest

svg-jest 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README