@jsxui/layout-snapshot

Jest snapshot matcher to generate screenshots of your layout tests.

Install

yarn add @jsxui/layout-snapshot
npm install @jsxui/layout-snapshot

Usage

import { computeLayout, createColumn, createNode } from '@jsxui/layout'
import { toMatchLayoutSnapshot } from '@jsxui/layout-snapshot'

expect.extend({ toMatchLayoutSnapshot })

test('positions Column children along vertical axis', () => {
  const node1 = createNode({ width: 2, height: 2 })
  const node2 = createNode({ width: 4, height: 1 })
  const column = createColumn({
    columns: 1,
    rows: 4,
    children: [node1, node2],
  })
  const { layout } = computeLayout(column)

  expect(layout).toMatchLayoutSnapshot()
})

Development

If you are experiencing issues installing the package for development on your machine, it's most likely due to the canvas dependency this package relies on. Check the installation instructions here to make sure you have the appropriate libaries installed.