test.js.md

Snapshot report for test.js

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

Generated by AVA.

renders JSX

Snapshot 1

`␊
  import React from 'react'␊
  const scope = {}␊
␊
  const keys = Object.keys(scope)␊
  const values = keys.map(key => scope[key])␊
  const Component = new Function(␊
    'React',␊
    ...keys,␊
    `return props =>␊
      React.createElement(React.Fragment, null,␊
        React.createElement( 'div', null,␊
  React.createElement( 'h1', null, "Compositor JSX" ),␊
  React.createElement( 'ul', null,␊
    React.createElement( 'li', null,␊
      React.createElement( Link, { to: ("/?title=" + (props.title)) }, "Home")␊
    ),␊
    React.createElement( 'li', null,␊
      React.createElement( Link, { to: '/scoped' }, "Scoped with front matter import")␊
    ),␊
    React.createElement( 'li', null,␊
      React.createElement( Link, { to: '/options-scope' }, "Scoped with loader options")␊
    )␊
  )␊
)␊
␊
      )␊
    `␊
  )(React, ...values)␊
␊
  export const jsx = `<div>␊
  <h1>Compositor JSX</h1>␊
  <ul>␊
    <li>␊
      <Link to={\\`/?title=\\${props.title}\\`}>Home</Link>␊
    </li>␊
    <li>␊
      <Link to='/scoped'>Scoped with front matter import</Link>␊
    </li>␊
    <li>␊
      <Link to='/options-scope'>Scoped with loader options</Link>␊
    </li>␊
  </ul>␊
</div>␊
`␊
␊
  export { scope }␊
␊
  Component.defaultProps = {␊
	title: 'Hello'␊
}␊
␊
  export default Component␊
  `

renders JSX with scope in front matter

Snapshot 1

`␊
  import React from 'react'␊
  import * as scope from 'rebass'␊
␊
  const keys = Object.keys(scope)␊
  const values = keys.map(key => scope[key])␊
  const Component = new Function(␊
    'React',␊
    ...keys,␊
    `return props =>␊
      React.createElement(React.Fragment, null,␊
        React.createElement( Provider, null,␊
  React.createElement( Box, { px: 2, py: 3, color: 'white', bg: 'blue' },␊
    React.createElement( Heading, null, "Rebass" )␊
  )␊
)␊
␊
      )␊
    `␊
  )(React, ...values)␊
␊
  export const jsx = `<Provider>␊
  <Box px={2} py={3} color='white' bg='blue'>␊
    <Heading>␊
      Rebass␊
    </Heading>␊
  </Box>␊
</Provider>␊
`␊
␊
  export { scope }␊
␊
  Component.defaultProps = {␊
	title: 'Scope Example',␊
	scope: 'import * as scope from \\'rebass\\''␊
}␊
␊
  export default Component␊
  `

renders with scope from loader options

Snapshot 1

`␊
  import React from 'react'␊
  import * as scope from 'grid-styled'␊
␊
  const keys = Object.keys(scope)␊
  const values = keys.map(key => scope[key])␊
  const Component = new Function(␊
    'React',␊
    ...keys,␊
    `return props =>␊
      React.createElement(React.Fragment, null,␊
        React.createElement( Box, { p: 4, bg: 'tomato' },␊
  React.createElement( 'h1', null, "Scope from loader options" )␊
)␊
␊
      )␊
    `␊
  )(React, ...values)␊
␊
  export const jsx = `<Box p={4} bg='tomato'>␊
  <h1>Scope from loader options</h1>␊
</Box>␊
`␊
␊
  export { scope }␊
␊
  Component.defaultProps = {␊
	title: 'Scope from loader options'␊
}␊
␊
  export default Component␊
  `