https://github.com/penx/render-glamorous
Render a Glamorous React component as static html, useful for visual regression tests
https://github.com/penx/render-glamorous
css-in-js glamor glamorous react visual-regression-tests
Last synced: about 2 months ago
JSON representation
Render a Glamorous React component as static html, useful for visual regression tests
- Host: GitHub
- URL: https://github.com/penx/render-glamorous
- Owner: penx
- Created: 2018-02-01T10:47:59.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-03-23T09:42:49.000Z (about 8 years ago)
- Last Synced: 2024-05-01T14:15:43.606Z (about 2 years ago)
- Topics: css-in-js, glamor, glamorous, react, visual-regression-tests
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/render-glamorous
- Size: 6.84 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# render-glamorous
[![Travis][build-badge]][build]
[![npm package][npm-badge]][npm]
[![Coveralls][coveralls-badge]][coveralls]
Render a Glamorous React component as static html, useful for visual regression tests.
Originally built for use with [component-image](https://github.com/corygibbons/component-image).
## Usage
`npm i -D render-glamorous`
```js
import renderGlamorous from 'render-glamorous';
import MyComponent from './components/my-component';
const htmlString = renderGlamorous(MyComponent); // returns static html markup with inline CSS
```
### With component-image
`npm i -D render-glamorous component-image`
```js
import { generateImage } from 'component-image';
import renderGlamorous from 'render-glamorous';
import MyComponent from './components/my-component';
generateImage(MyComponent, {
renderer: renderGlamorous
}).then(image => {
// do something
});
```
[build-badge]: https://img.shields.io/travis/penx/render-glamorous/master.png?style=flat-square
[build]: https://travis-ci.org/penx/render-glamorous
[npm-badge]: https://img.shields.io/npm/v/render-glamorous.png?style=flat-square
[npm]: https://www.npmjs.org/package/render-glamorous
[coveralls-badge]: https://img.shields.io/coveralls/penx/render-glamorous/master.png?style=flat-square
[coveralls]: https://coveralls.io/github/penx/render-glamorous