stipsan

import renderer from 'react-test-renderer'
import Form, { validate } from '../Form'

jest.mock('redux-form', () => ({
  Field: 'Field',
  reduxForm: options => {
    // Wrap the component and return the new component, just like the real hoc does
    return Form => props => {
      // call the validate error to make sure errors are detected
      options.validate({}, props)

stipsan

import renderer from 'react-test-renderer'
import Canvas from '../Canvas'

it('should render correctly', () => {
  const component = renderer.create(<Form x={0} y={0} />)
  expect(component.toJSON()).toMatchSnapshot()

  const instance = component.getInstance()
  const spy = jest.spyOn(instance, 'calculateGrid')

ryanflorence

// how I share state anywhere in the tree
<Route render={({ match: { params } }) => ()}/>

<Geolocation>
  {coords => ()}
</Geolocation>

<FirebaseRef path="/somewhere">
  {(doc) => ()}
</FirebaseRef>

jsdf

var util = require('util');

// nobody cares about warnings so lets make them errors

// keep a reference to the original console methods
var consoleWarn = console.warn;
var consoleError = console.error;

function logToError() {
  throw new Error(util.format.apply(this, arguments).replace(/^Error: (?:Warning: )?/, ''));

daniula

module SignupForm exposing (..)

-- This is where our Elm logic lives.`module SignupForm` declares that this is
-- the SignupForm module, which is how other modules will reference this one
-- if they want to import it and reuse its code.
-- Elm’s "import" keyword works similarly to "require" in node.js.

import Html exposing (..)

stipsan

import renderer from 'react-test-renderer'
import Field from '../Field'

// this import is created by our mock, it is inteded to help with testing and
// don't exist in the real package
import { intl } from 'react-intl'

it('should render correctly', () => {
  const component = renderer.create(<Field intl={intl} />)
  expect(component.toJSON()).toMatchSnapshot()

stipsan

{
  "jest": {
    "setupFiles": [
      "<rootDir>/test-setup.js"
    ]
  }
}

stipsan

{
  "jest": {
    "setupFiles": [
      "<rootDir>/test-setup.js"
    ]
  }
}

markerikson

Jotting down a list of posts I'd like to write. Probably won't write them in this exact order.

• Practical Redux series
  • Connected lists, basic form editing
  • Form change handling, feature reducers
  • "editing/draft slice" approach
  • Modal management and "picker" modals
  • Handling more complex nested/relational data
  • Entity creation
• Treeview

DavidWells

Here is a checklist of all the things I need my CSS solution to handle.

I can explain any of the points. Leave a comment on the gist or tweet @DavidWells

Challenge: Take your favorite CSS solution and see how the checklist holds up.

• Has ability Localize classes
• Has ability to use global classes
• Has ability to write raw CSS
• Syntax highlighting and auto completion