chore(deps): update jest monorepo to v23 (major) (#305)

* chore(deps): update jest monorepo to v23

* feature(formatting): Harmonize the function formatting

BREAKING CHANGE: If you use the `showFunctions: true` option, the function are now always inlined in the output by default. Before it was not always the case (depending one the engine, platform or babel versions)

You could get back to the previous behavior by using the `preserveFunctionLineBreak` function export as a value of the option `functionValue`.

* test(smoke): Adapt the CommonJS bundle import

package.json

@@ -39,7 +39,7 @@
     "@commitlint/config-angular": "7.3.1",
     "babel-cli": "6.26.0",
     "babel-eslint": "10.0.1",
-    "babel-jest": "22.2.2",
+    "babel-jest": "23.6.0",
     "babel-preset-es2015": "6.24.1",
     "babel-preset-flow": "6.23.0",
     "babel-preset-react": "6.24.1",
@@ -57,11 +57,11 @@
     "eslint-plugin-prettier": "3.0.1",
     "eslint-plugin-react": "7.12.4",
     "esm": "3.1.1",
-    "expect": "22.3.0",
+    "expect": "23.6.0",
     "flow-bin": "0.91.0",
     "flow-copy-source": "2.0.2",
     "husky": "1.3.1",
-    "jest": "22.3.0",
+    "jest": "23.6.0",
     "json": "9.0.6",
     "lint-staged": "8.1.0",
     "mversion": "1.12.0",

src/formatter/formatFunction.js

@@ -2,7 +2,16 @@ import type { Options } from './../options';
 
 function noRefCheck() {}
 
-const defaultFunctionValue = (fn: any): any => fn.toString();
+export const inlineFunction = (fn: any): string =>
+  fn
+    .toString()
+    .split('\n')
+    .map(line => line.trim())
+    .join('');
+
+export const preserveFunctionLineBreak = (fn: any): string => fn.toString();
+
+const defaultFunctionValue = inlineFunction;
 
 export default (fn: Function, options: Options): string => {
   const { functionValue = defaultFunctionValue, showFunctions } = options;

src/formatter/formatFunction.spec.js

@@ -22,10 +22,9 @@ describe('formatFunction', () => {
   });
 
   it('should format a function if showFunctions is true', () => {
-    expect(formatFunction(hello, { showFunctions: true }))
-      .toEqual(`function hello() {
-  return 1;
-}`);
+    expect(formatFunction(hello, { showFunctions: true })).toEqual(
+      'function hello() {return 1;}'
+    );
   });
 
   it('should format a function without name if showFunctions is true', () => {

src/index.js

@@ -41,3 +41,8 @@ const reactElementToJsxString = (
 };
 
 export default reactElementToJsxString;
+
+export {
+  inlineFunction,
+  preserveFunctionLineBreak,
+} from './formatter/formatFunction';

src/index.spec.js

@@ -5,7 +5,7 @@
 import React, { Fragment, Component } from 'react';
 import { createRenderer } from 'react-test-renderer/shallow';
 import { mount } from 'enzyme';
-import reactElementToJSXString from './index';
+import reactElementToJSXString, { preserveFunctionLineBreak } from './index';
 import AnonymousStatelessComponent from './AnonymousStatelessComponent';
 
 class TestComponent extends React.Component {}
@@ -889,13 +889,25 @@ describe('reactElementToJSXString(ReactElement)', () => {
       reactElementToJSXString(<div fn={fn} />, {
         showFunctions: true,
       })
-    ).toEqual(
-      `<div
+    ).toEqual(`<div fn={function fn() {return 'value';}} />`);
+  });
+
+  it('should expose the multiline "functionValue" formatter', () => {
+    /* eslint-disable arrow-body-style */
+    const fn = () => {
+      return 'value';
+    };
+
+    expect(
+      reactElementToJSXString(<div fn={fn} />, {
+        showFunctions: true,
+        functionValue: preserveFunctionLineBreak,
+      })
+    ).toEqual(`<div
   fn={function fn() {
       return 'value';
     }}
- />`
-    );
+ />`);
   });
 
   it('reactElementToJSXString(<DisplayNamePrecedence />)', () => {

tests/smoke/smoke.js

@@ -8,7 +8,7 @@ const requireReactElementToJsxString = buildType => {
   if (buildType === 'esm') {
     return require(`./../../dist/esm`).default;
   } else if (buildType === 'cjs') {
-    return require('./../../dist/cjs');
+    return require('./../../dist/cjs').default;
   }
 
   throw new Error(`Unknown build type: "${buildType}"`);