// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`array-iter.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
)

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>{_.map(todos, (todo, i) => <TodoItem key={i} {...todo} />)}</ul>
  </div>
);

<div className="search-filter-chips">
    {scopes
        .filter(scope => scope.value !== '')
        .map((scope, i) => (
            <FilterChip
                query={this.props.query}
                onFilterChosen={this.onSearchScopeClicked}
                key={i}
                value={scope.value}
                name={scope.name}
            />
        ))}
</div>

=====================================output=====================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
);

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>
      {_.map(todos, (todo, i) => (
        <TodoItem key={i} {...todo} />
      ))}
    </ul>
  </div>
);

<div className="search-filter-chips">
  {scopes
    .filter(scope => scope.value !== "")
    .map((scope, i) => (
      <FilterChip
        query={this.props.query}
        onFilterChosen={this.onSearchScopeClicked}
        key={i}
        value={scope.value}
        name={scope.name}
      />
    ))}
</div>;

================================================================================
`;

exports[`array-iter.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
)

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>{_.map(todos, (todo, i) => <TodoItem key={i} {...todo} />)}</ul>
  </div>
);

<div className="search-filter-chips">
    {scopes
        .filter(scope => scope.value !== '')
        .map((scope, i) => (
            <FilterChip
                query={this.props.query}
                onFilterChosen={this.onSearchScopeClicked}
                key={i}
                value={scope.value}
                name={scope.name}
            />
        ))}
</div>

=====================================output=====================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
);

const TodoList = ({ todos }) => (
  <div className='TodoList'>
    <ul>
      {_.map(todos, (todo, i) => (
        <TodoItem key={i} {...todo} />
      ))}
    </ul>
  </div>
);

<div className='search-filter-chips'>
  {scopes
    .filter(scope => scope.value !== "")
    .map((scope, i) => (
      <FilterChip
        query={this.props.query}
        onFilterChosen={this.onSearchScopeClicked}
        key={i}
        value={scope.value}
        name={scope.name}
      />
    ))}
</div>;

================================================================================
`;

exports[`array-iter.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
)

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>{_.map(todos, (todo, i) => <TodoItem key={i} {...todo} />)}</ul>
  </div>
);

<div className="search-filter-chips">
    {scopes
        .filter(scope => scope.value !== '')
        .map((scope, i) => (
            <FilterChip
                query={this.props.query}
                onFilterChosen={this.onSearchScopeClicked}
                key={i}
                value={scope.value}
                name={scope.name}
            />
        ))}
</div>

=====================================output=====================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
);

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>
      {_.map(todos, (todo, i) => (
        <TodoItem key={i} {...todo} />
      ))}
    </ul>
  </div>
);

<div className="search-filter-chips">
  {scopes
    .filter(scope => scope.value !== '')
    .map((scope, i) => (
      <FilterChip
        query={this.props.query}
        onFilterChosen={this.onSearchScopeClicked}
        key={i}
        value={scope.value}
        name={scope.name}
      />
    ))}
</div>;

================================================================================
`;

exports[`array-iter.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
)

const TodoList = ({ todos }) => (
  <div className="TodoList">
    <ul>{_.map(todos, (todo, i) => <TodoItem key={i} {...todo} />)}</ul>
  </div>
);

<div className="search-filter-chips">
    {scopes
        .filter(scope => scope.value !== '')
        .map((scope, i) => (
            <FilterChip
                query={this.props.query}
                onFilterChosen={this.onSearchScopeClicked}
                key={i}
                value={scope.value}
                name={scope.name}
            />
        ))}
</div>

=====================================output=====================================
const UsersList = ({ users }) => (
  <section>
    <h2>Users list</h2>
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  </section>
);

const TodoList = ({ todos }) => (
  <div className='TodoList'>
    <ul>
      {_.map(todos, (todo, i) => (
        <TodoItem key={i} {...todo} />
      ))}
    </ul>
  </div>
);

<div className='search-filter-chips'>
  {scopes
    .filter(scope => scope.value !== '')
    .map((scope, i) => (
      <FilterChip
        query={this.props.query}
        onFilterChosen={this.onSearchScopeClicked}
        key={i}
        value={scope.value}
        name={scope.name}
      />
    ))}
</div>;

================================================================================
`;

exports[`attr-comments.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

=====================================output=====================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

================================================================================
`;

exports[`attr-comments.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

=====================================output=====================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

================================================================================
`;

exports[`attr-comments.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

=====================================output=====================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

================================================================================
`;

exports[`attr-comments.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

=====================================output=====================================
<Component
  propFn={
    // comment
    function(arg) {
      fn(arg);
    }
  }
  propArrowFn={
    // comment
    arg => fn(arg)
  }
  propArrowWithBreak={
    // comment
    arg =>
      fn({
        makeItBreak
      })
  }
  propArray={
    // comment
    [el1, el2]
  }
  propObj={
    // comment
    { key: val }
  }
  propTemplate={
    // comment
    \`text\`
  }
/>;

================================================================================
`;

exports[`conditional-expression.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
</div>  ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>
  {a ? "a" : b ? "b" : "c"}
</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id="c" /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

=====================================output=====================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>
    thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
  </span>
</div> ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>{a ? "a" : b ? "b" : "c"}</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id="c" /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  "dunno"
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : (
  "dunno"
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

================================================================================
`;

exports[`conditional-expression.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
</div>  ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>
  {a ? "a" : b ? "b" : "c"}
</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id="c" /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

=====================================output=====================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>
    thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
  </span>
</div> ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>{a ? "a" : b ? "b" : "c"}</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id='c' /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  "dunno"
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : (
  "dunno"
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

================================================================================
`;

exports[`conditional-expression.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
</div>  ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>
  {a ? "a" : b ? "b" : "c"}
</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id="c" /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

=====================================output=====================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? 'a' : 'b';

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : 'c';

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : 'a';

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : 'a';

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? 'a' : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>
    thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
  </span>
</div> ? (
  'jsx mode from element breaking'
) : (
  'a'
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  'a'
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  'a'
) : (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>{a ? 'a' : b ? 'b' : 'c'}</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? 'satellite' : public ? 'affairs' : network ? <span id="c" /> : 'dunno';

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  'satellite'
) : public ? (
  'affairs'
) : network ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  'dunno'
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : sateline ? (
  'public'
) : affairs ? (
  'network'
) : (
  'dunno'
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

================================================================================
`;

exports[`conditional-expression.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? "a" : "b";

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : "c";

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : "a";

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : "a";

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? "a" : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
</div>  ? (
  "jsx mode from element breaking"
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : (
  "a"
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  "a"
) : (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>
  {a ? "a" : b ? "b" : "c"}
</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? "satellite" : public ? "affairs" : network ? <span id="c" /> : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  "satellite"
) : public ? (
  "affairs"
) : network ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo</span>
  </div>
) : sateline ? (
  "public"
) : affairs ? (
  "network"
) : "dunno";

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

=====================================output=====================================
// There are two ways to print ConditionalExpressions: "normal mode" and
// "JSX mode". This is normal mode (when breaking):
//
//   test
//     ? consequent
//     : alternate;
//
// And this is JSX mode (when breaking):
//
//   test ? (
//     consequent
//   ) : (
//     alternate
//   );
//
// When non-breaking, they look the same:
//
//  test ? consequent : alternate;
//
// We only print a conditional expression in JSX mode if its test,
// consequent, or alternate are JSXElements.
// Otherwise, we print in normal mode.

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// The line does not break.
normalModeNonBreaking ? 'a' : 'b';

// This ConditionalExpression has no JSXElements so it prints in normal mode.
// Its consequent is very long, so it breaks out to multiple lines.
normalModeBreaking
  ? johnJacobJingleHeimerSchmidtHisNameIsMyNameTooWheneverWeGoOutThePeopleAlwaysShoutThereGoesJohnJacobJingleHeimerSchmidtYaDaDaDaDaDaDa
  : 'c';

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is non-breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div /> ? jsxModeFromElementNonBreaking : 'a';

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? <div /> : 'a';

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is non-breaking.
jsxModeFromElementNonBreaking ? 'a' : <div />;

// This ConditionalExpression prints in JSX mode because its test is a
// JSXElement. It is breaking.
// Note: I have never, ever seen someone use a JSXElement as the test in a
// ConditionalExpression. But this test is included for completeness.
<div>
  <span>
    thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
  </span>
</div> ? (
  'jsx mode from element breaking'
) : (
  'a'
);

// This ConditionalExpression prints in JSX mode because its consequent is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  'a'
);

// This ConditionalExpression prints in JSX mode because its alternate is a
// JSXElement. It is breaking.
jsxModeFromElementBreaking ? (
  'a'
) : (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
);

// This chain of ConditionalExpressions prints in JSX mode because the parent of
// the outermost ConditionalExpression is a JSXExpressionContainer. It is
// non-breaking.
<div>{a ? 'a' : b ? 'b' : 'c'}</div>;

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is non-breaking.
cable ? 'satellite' : public ? 'affairs' : network ? <span id='c' /> : 'dunno';

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the end). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  'satellite'
) : public ? (
  'affairs'
) : network ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : (
  'dunno'
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain (in this case, at the beginning). It is
// breaking; notice the consequents and alternates in the entire chain get
// wrapped in parens.
cable ? (
  <div>
    <span>
      thisIsASongAboutYourPoorSickPenguinHeHasAFeverAndHisToesAreBlueButIfISingToYourPoorSickPenguinHeWillFeelBetterInADayOrTwo
    </span>
  </div>
) : sateline ? (
  'public'
) : affairs ? (
  'network'
) : (
  'dunno'
);

// This chain of ConditionalExpressions prints in JSX mode because there is a
// JSX element somewhere in the chain. It is breaking; notice the consequents
// and alternates in the entire chain get wrapped in parens.
<div>
  {properties.length > 1 ||
  (properties.length === 1 && properties[0].apps.size > 1) ? (
    draggingApp == null || newPropertyName == null ? (
      <MigrationPropertyListItem />
    ) : (
      <MigrationPropertyListItem apps={Immutable.List()} />
    )
  ) : null}
</div>;

================================================================================
`;

exports[`expression.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<View
  style={
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  }
/>;

<View
  style={
    [
      {
        someVeryLongStyle1: "true",
        someVeryLongStyle2: "true",
        someVeryLongStyle3: "true",
        someVeryLongStyle4: "true"
      }
    ]
  }
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)}
  imageSize={this.props.veryBigItemImageSize}
  imageView={this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)}
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={
  <Child>
    test
  </Child>
}/>;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

=====================================output=====================================
<View
  style={{
    someVeryLongStyle1: "true",
    someVeryLongStyle2: "true",
    someVeryLongStyle3: "true",
    someVeryLongStyle4: "true"
  }}
/>;

<View
  style={[
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  ]}
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={
    this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)
  }
  imageSize={this.props.veryBigItemImageSize}
  imageView={
    this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)
  }
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={<Child>test</Child>} />;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    )
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    );
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    )
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    );
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

================================================================================
`;

exports[`expression.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<View
  style={
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  }
/>;

<View
  style={
    [
      {
        someVeryLongStyle1: "true",
        someVeryLongStyle2: "true",
        someVeryLongStyle3: "true",
        someVeryLongStyle4: "true"
      }
    ]
  }
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)}
  imageSize={this.props.veryBigItemImageSize}
  imageView={this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)}
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={
  <Child>
    test
  </Child>
}/>;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

=====================================output=====================================
<View
  style={{
    someVeryLongStyle1: "true",
    someVeryLongStyle2: "true",
    someVeryLongStyle3: "true",
    someVeryLongStyle4: "true"
  }}
/>;

<View
  style={[
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  ]}
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={
    this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)
  }
  imageSize={this.props.veryBigItemImageSize}
  imageView={
    this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)
  }
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={<Child>test</Child>} />;

<BookingIntroPanel
  prop='long_string_make_to_force_break'
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    )
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    );
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    )
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick(
      "long_name_long_name_long_name",
      "long_name_long_name_long_name",
      data
    );
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

================================================================================
`;

exports[`expression.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<View
  style={
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  }
/>;

<View
  style={
    [
      {
        someVeryLongStyle1: "true",
        someVeryLongStyle2: "true",
        someVeryLongStyle3: "true",
        someVeryLongStyle4: "true"
      }
    ]
  }
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)}
  imageSize={this.props.veryBigItemImageSize}
  imageView={this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)}
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={
  <Child>
    test
  </Child>
}/>;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

=====================================output=====================================
<View
  style={{
    someVeryLongStyle1: 'true',
    someVeryLongStyle2: 'true',
    someVeryLongStyle3: 'true',
    someVeryLongStyle4: 'true'
  }}
/>;

<View
  style={[
    {
      someVeryLongStyle1: 'true',
      someVeryLongStyle2: 'true',
      someVeryLongStyle3: 'true',
      someVeryLongStyle4: 'true'
    }
  ]}
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={
    this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)
  }
  imageSize={this.props.veryBigItemImageSize}
  imageView={
    this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)
  }
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={<Child>test</Child>} />;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick('short', 'short', data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    )
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    );
  }}
/>;

<Component
  onChange={(
    key: 'possible_key_1' | 'possible_key_2' | 'possible_key_3',
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick('short', 'short', data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    )
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    );
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: 'possible_key_1' | 'possible_key_2' | 'possible_key_3',
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: 'scroll' }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

================================================================================
`;

exports[`expression.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<View
  style={
    {
      someVeryLongStyle1: "true",
      someVeryLongStyle2: "true",
      someVeryLongStyle3: "true",
      someVeryLongStyle4: "true"
    }
  }
/>;

<View
  style={
    [
      {
        someVeryLongStyle1: "true",
        someVeryLongStyle2: "true",
        someVeryLongStyle3: "true",
        someVeryLongStyle4: "true"
      }
    ]
  }
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)}
  imageSize={this.props.veryBigItemImageSize}
  imageView={this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)}
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={
  <Child>
    test
  </Child>
}/>;

<BookingIntroPanel
  prop="long_string_make_to_force_break"
  logClick={data => doLogClick("short", "short", data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
/>;

<Component
  onChange={(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick("short", "short", data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick("long_name_long_name_long_name", "long_name_long_name_long_name", data)
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: "possible_key_1" | "possible_key_2" | "possible_key_3",
    value: string | Immutable.List<string>,
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: "scroll" }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

=====================================output=====================================
<View
  style={{
    someVeryLongStyle1: 'true',
    someVeryLongStyle2: 'true',
    someVeryLongStyle3: 'true',
    someVeryLongStyle4: 'true'
  }}
/>;

<View
  style={[
    {
      someVeryLongStyle1: 'true',
      someVeryLongStyle2: 'true',
      someVeryLongStyle3: 'true',
      someVeryLongStyle4: 'true'
    }
  ]}
/>;

<Something>
  {() => (
    <SomethingElse>
      <span />
    </SomethingElse>
  )}
</Something>;

<Something>
  {items.map(item => (
    <SomethingElse>
      <span />
    </SomethingElse>
  ))}
</Something>;

<Something>
  {function() {
    return (
      <SomethingElse>
        <span />
      </SomethingElse>
    );
  }}
</Something>;

<RadioListItem
  key={option}
  imageSource={
    this.props.veryBigItemImageSourceFunc &&
    this.props.veryBigItemImageSourceFunc(option)
  }
  imageSize={this.props.veryBigItemImageSize}
  imageView={
    this.props.veryBigItemImageViewFunc &&
    this.props.veryBigItemImageViewFunc(option)
  }
  heading={this.props.displayTextFunc(option)}
  value={option}
/>;

<ParentComponent prop={<Child>test</Child>} />;

<BookingIntroPanel
  prop='long_string_make_to_force_break'
  logClick={data => doLogClick('short', 'short', data)}
/>;

<BookingIntroPanel
  logClick={data =>
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    )
  }
/>;

<BookingIntroPanel
  logClick={data => {
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    );
  }}
/>;

<Component
  onChange={(
    key: 'possible_key_1' | 'possible_key_2' | 'possible_key_3',
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
/>;

<BookingIntroPanel>
  {data => doLogClick('short', 'short', data)}
</BookingIntroPanel>;

<BookingIntroPanel>
  {data =>
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    )
  }
</BookingIntroPanel>;

<BookingIntroPanel>
  {data => {
    doLogClick(
      'long_name_long_name_long_name',
      'long_name_long_name_long_name',
      data
    );
  }}
</BookingIntroPanel>;

<Component>
  {(
    key: 'possible_key_1' | 'possible_key_2' | 'possible_key_3',
    value: string | Immutable.List<string>
  ) => {
    this.setState({
      updatedTask: this.state.updatedTask.set(key, value)
    });
  }}
</Component>;

<SuspendyTree>
  <div style={{ height: 200, overflow: 'scroll' }}>
    {Array(20)
      .fill()
      .map((_, i) => (
        <h2 key={i}>{i + 1}</h2>
      ))}
  </div>
</SuspendyTree>;

================================================================================
`;

exports[`flow_fix_me.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">
    Foo bar
  </div>
);

=====================================output=====================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">Foo bar</div>
);

================================================================================
`;

exports[`flow_fix_me.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">
    Foo bar
  </div>
);

=====================================output=====================================
const aDiv = (
  /* $FlowFixMe */
  <div className='foo'>Foo bar</div>
);

================================================================================
`;

exports[`flow_fix_me.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">
    Foo bar
  </div>
);

=====================================output=====================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">Foo bar</div>
);

================================================================================
`;

exports[`flow_fix_me.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const aDiv = (
  /* $FlowFixMe */
  <div className="foo">
    Foo bar
  </div>
);

=====================================output=====================================
const aDiv = (
  /* $FlowFixMe */
  <div className='foo'>Foo bar</div>
);

================================================================================
`;

exports[`html_escape.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

=====================================output=====================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

================================================================================
`;

exports[`html_escape.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

=====================================output=====================================
export default () => <a href='https://foo.bar?q1=foo&q2=bar' />;

() => <img src='https://bar.foo?param1=1&param2=2' />;

================================================================================
`;

exports[`html_escape.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

=====================================output=====================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

================================================================================
`;

exports[`html_escape.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
export default () => <a href="https://foo.bar?q1=foo&q2=bar" />;

() => <img src="https://bar.foo?param1=1&param2=2" />;

=====================================output=====================================
export default () => <a href='https://foo.bar?q1=foo&q2=bar' />;

() => <img src='https://bar.foo?param1=1&param2=2' />;

================================================================================
`;

exports[`hug.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div>
  {__DEV__
    ? this.renderDevApp()
    : <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>}
</div>;

<div>
  {__DEV__ && <div>
    {routes.map(route => (
      <MatchAsync
        key={\`\${route.to}-async\`}
        pattern={route.to}
        exactly={route.to === "/"}
        getComponent={routeES6Modules[route.value]}
      />
    ))}
    </div>}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>

=====================================output=====================================
<div>
  {__DEV__ ? (
    this.renderDevApp()
  ) : (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {__DEV__ && (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? "()" : "")}
</div>;

================================================================================
`;

exports[`hug.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div>
  {__DEV__
    ? this.renderDevApp()
    : <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>}
</div>;

<div>
  {__DEV__ && <div>
    {routes.map(route => (
      <MatchAsync
        key={\`\${route.to}-async\`}
        pattern={route.to}
        exactly={route.to === "/"}
        getComponent={routeES6Modules[route.value]}
      />
    ))}
    </div>}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>

=====================================output=====================================
<div>
  {__DEV__ ? (
    this.renderDevApp()
  ) : (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {__DEV__ && (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? "()" : "")}
</div>;

================================================================================
`;

exports[`hug.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div>
  {__DEV__
    ? this.renderDevApp()
    : <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>}
</div>;

<div>
  {__DEV__ && <div>
    {routes.map(route => (
      <MatchAsync
        key={\`\${route.to}-async\`}
        pattern={route.to}
        exactly={route.to === "/"}
        getComponent={routeES6Modules[route.value]}
      />
    ))}
    </div>}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>

=====================================output=====================================
<div>
  {__DEV__ ? (
    this.renderDevApp()
  ) : (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === '/'}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {__DEV__ && (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === '/'}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>;

================================================================================
`;

exports[`hug.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div>
  {__DEV__
    ? this.renderDevApp()
    : <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === "/"}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>}
</div>;

<div>
  {__DEV__ && <div>
    {routes.map(route => (
      <MatchAsync
        key={\`\${route.to}-async\`}
        pattern={route.to}
        exactly={route.to === "/"}
        getComponent={routeES6Modules[route.value]}
      />
    ))}
    </div>}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>

=====================================output=====================================
<div>
  {__DEV__ ? (
    this.renderDevApp()
  ) : (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === '/'}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {__DEV__ && (
    <div>
      {routes.map(route => (
        <MatchAsync
          key={\`\${route.to}-async\`}
          pattern={route.to}
          exactly={route.to === '/'}
          getComponent={routeES6Modules[route.value]}
        />
      ))}
    </div>
  )}
</div>;

<div>
  {member.memberName.memberSomething +
    (member.memberDef.memberSomething.signatures ? '()' : '')}
</div>;

================================================================================
`;

exports[`logical-expression.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div>
  {a || "b"}
</div>;

<div>
  {a && "b"}
</div>;

<div>
  {a || <span></span>}
</div>;

<div>
  {a && <span></span>}
</div>;

<div>
  {a && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && b && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && <span>
    <div>
      <div></div>
    </div>
  </span>}
</div>;

=====================================output=====================================
<div>{a || "b"}</div>;

<div>{a && "b"}</div>;

<div>{a || <span />}</div>;

<div>{a && <span />}</div>;

<div>
  {a && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && b && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && (
    <span>
      <div>
        <div />
      </div>
    </span>
  )}
</div>;

================================================================================
`;

exports[`logical-expression.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div>
  {a || "b"}
</div>;

<div>
  {a && "b"}
</div>;

<div>
  {a || <span></span>}
</div>;

<div>
  {a && <span></span>}
</div>;

<div>
  {a && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && b && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && <span>
    <div>
      <div></div>
    </div>
  </span>}
</div>;

=====================================output=====================================
<div>{a || "b"}</div>;

<div>{a && "b"}</div>;

<div>{a || <span />}</div>;

<div>{a && <span />}</div>;

<div>
  {a && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && b && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && (
    <span>
      <div>
        <div />
      </div>
    </span>
  )}
</div>;

================================================================================
`;

exports[`logical-expression.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div>
  {a || "b"}
</div>;

<div>
  {a && "b"}
</div>;

<div>
  {a || <span></span>}
</div>;

<div>
  {a && <span></span>}
</div>;

<div>
  {a && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && b && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && <span>
    <div>
      <div></div>
    </div>
  </span>}
</div>;

=====================================output=====================================
<div>{a || 'b'}</div>;

<div>{a && 'b'}</div>;

<div>{a || <span />}</div>;

<div>{a && <span />}</div>;

<div>
  {a && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && b && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && (
    <span>
      <div>
        <div />
      </div>
    </span>
  )}
</div>;

================================================================================
`;

exports[`logical-expression.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div>
  {a || "b"}
</div>;

<div>
  {a && "b"}
</div>;

<div>
  {a || <span></span>}
</div>;

<div>
  {a && <span></span>}
</div>;

<div>
  {a && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && b && <span>make this text just so long enough to break this to the next line</span>}
</div>;

<div>
  {a && <span>
    <div>
      <div></div>
    </div>
  </span>}
</div>;

=====================================output=====================================
<div>{a || 'b'}</div>;

<div>{a && 'b'}</div>;

<div>{a || <span />}</div>;

<div>{a && <span />}</div>;

<div>
  {a && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && b && (
    <span>
      make this text just so long enough to break this to the next line
    </span>
  )}
</div>;

<div>
  {a && (
    <span>
      <div>
        <div />
      </div>
    </span>
  )}
</div>;

================================================================================
`;

exports[`object-property.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={ onSave }
        onCancel={ onCancel }
        countries={ countries }
      />
    )
  }
];

=====================================output=====================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={onSave}
        onCancel={onCancel}
        countries={countries}
      />
    )
  }
];

================================================================================
`;

exports[`object-property.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={ onSave }
        onCancel={ onCancel }
        countries={ countries }
      />
    )
  }
];

=====================================output=====================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute='i-need-long-value-here'
        onSave={onSave}
        onCancel={onCancel}
        countries={countries}
      />
    )
  }
];

================================================================================
`;

exports[`object-property.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={ onSave }
        onCancel={ onCancel }
        countries={ countries }
      />
    )
  }
];

=====================================output=====================================
const tabs = [
  {
    title: 'General Info',
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={onSave}
        onCancel={onCancel}
        countries={countries}
      />
    )
  }
];

================================================================================
`;

exports[`object-property.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const tabs = [
  {
    title: "General Info",
    content: (
      <GeneralForm
        long-attribute="i-need-long-value-here"
        onSave={ onSave }
        onCancel={ onCancel }
        countries={ countries }
      />
    )
  }
];

=====================================output=====================================
const tabs = [
  {
    title: 'General Info',
    content: (
      <GeneralForm
        long-attribute='i-need-long-value-here'
        onSave={onSave}
        onCancel={onCancel}
        countries={countries}
      />
    )
  }
];

================================================================================
`;

exports[`open-break.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<td
onClick={() => {
  a
}}>{header}{showSort}</td>;

<td
onClick={() => {
  a
}}>{header}<showSort attr="long long long long long long long long long long long"/></td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

=====================================output=====================================
<td
  onClick={() => {
    a;
  }}
>
  {header}
  {showSort}
</td>;

<td
  onClick={() => {
    a;
  }}
>
  {header}
  <showSort attr="long long long long long long long long long long long" />
</td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

================================================================================
`;

exports[`open-break.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<td
onClick={() => {
  a
}}>{header}{showSort}</td>;

<td
onClick={() => {
  a
}}>{header}<showSort attr="long long long long long long long long long long long"/></td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

=====================================output=====================================
<td
  onClick={() => {
    a;
  }}
>
  {header}
  {showSort}
</td>;

<td
  onClick={() => {
    a;
  }}
>
  {header}
  <showSort attr='long long long long long long long long long long long' />
</td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

================================================================================
`;

exports[`open-break.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<td
onClick={() => {
  a
}}>{header}{showSort}</td>;

<td
onClick={() => {
  a
}}>{header}<showSort attr="long long long long long long long long long long long"/></td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

=====================================output=====================================
<td
  onClick={() => {
    a;
  }}
>
  {header}
  {showSort}
</td>;

<td
  onClick={() => {
    a;
  }}
>
  {header}
  <showSort attr="long long long long long long long long long long long" />
</td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

================================================================================
`;

exports[`open-break.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<td
onClick={() => {
  a
}}>{header}{showSort}</td>;

<td
onClick={() => {
  a
}}>{header}<showSort attr="long long long long long long long long long long long"/></td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

=====================================output=====================================
<td
  onClick={() => {
    a;
  }}
>
  {header}
  {showSort}
</td>;

<td
  onClick={() => {
    a;
  }}
>
  {header}
  <showSort attr='long long long long long long long long long long long' />
</td>;

<Foo>{\`    a    very    long    text    that    does    not    break    \`}</Foo>;

================================================================================
`;

exports[`parens.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
];

<div {...((foo || foo === null) ? {foo} : null)} />

=====================================output=====================================
a = [
  <path
    key="0"
    d="M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,"
  />,
  <path
    key="1"
    d="M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,"
  />
];

<div {...(foo || foo === null ? { foo } : null)} />;

================================================================================
`;

exports[`parens.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
];

<div {...((foo || foo === null) ? {foo} : null)} />

=====================================output=====================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />
];

<div {...(foo || foo === null ? { foo } : null)} />;

================================================================================
`;

exports[`parens.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
];

<div {...((foo || foo === null) ? {foo} : null)} />

=====================================output=====================================
a = [
  <path
    key="0"
    d="M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,"
  />,
  <path
    key="1"
    d="M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,"
  />
];

<div {...(foo || foo === null ? { foo } : null)} />;

================================================================================
`;

exports[`parens.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
];

<div {...((foo || foo === null) ? {foo} : null)} />

=====================================output=====================================
a = [
  <path
    key='0'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />,
  <path
    key='1'
    d='M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,M13.6,10.6l,4-2.8L9.5,'
  />
];

<div {...(foo || foo === null ? { foo } : null)} />;

================================================================================
`;

exports[`quotes.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id='123' />;
<div id='&#39;&quot;' />;
<div id={'\\'\\"\\\\\\''} />;
<div
  single='foo'
  single2={'foo'}

  double="bar"
  double2={"bar"}

  singleDouble='"'
  singleDouble2={'"'}

  doubleSingle="'"
  doubleSingle2={"'"}

  singleEscaped={'\\''}
  singleEscaped2='&apos;'

  doubleEscaped={"\\""}
  doubleEscaped2="&quot;"

  singleBothEscaped={'\\'"'}
  singleBothEscaped2='&apos;"'

  singleBoth='&apos; "'
  singleBoth2={'\\' "'}
  singleBoth3='&apos; &apos; "'

  doubleBoth="&quot; '"
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; &apos; '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>

=====================================output=====================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={"'\\"&quot;<>&amp;quot;"} />;
<div id="123" />;
<div id='&#39;"' />;
<div id={"'\\"\\\\'"} />;
<div
  single="foo"
  single2={"foo"}
  double="bar"
  double2={"bar"}
  singleDouble='"'
  singleDouble2={'"'}
  doubleSingle="'"
  doubleSingle2={"'"}
  singleEscaped={"'"}
  singleEscaped2="'"
  doubleEscaped={'"'}
  doubleEscaped2='"'
  singleBothEscaped={"'\\""}
  singleBothEscaped2="'&quot;"
  singleBoth="' &quot;"
  singleBoth2={"' \\""}
  singleBoth3="' ' &quot;"
  doubleBoth="&quot; '"
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; ' '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{"  "}{" "}
</p>;

================================================================================
`;

exports[`quotes.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id='123' />;
<div id='&#39;&quot;' />;
<div id={'\\'\\"\\\\\\''} />;
<div
  single='foo'
  single2={'foo'}

  double="bar"
  double2={"bar"}

  singleDouble='"'
  singleDouble2={'"'}

  doubleSingle="'"
  doubleSingle2={"'"}

  singleEscaped={'\\''}
  singleEscaped2='&apos;'

  doubleEscaped={"\\""}
  doubleEscaped2="&quot;"

  singleBothEscaped={'\\'"'}
  singleBothEscaped2='&apos;"'

  singleBoth='&apos; "'
  singleBoth2={'\\' "'}
  singleBoth3='&apos; &apos; "'

  doubleBoth="&quot; '"
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; &apos; '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>

=====================================output=====================================
<div id='"&apos;<>&amp;quot;' />;
<div id='"&#39;<>&amp;quot;' />;
<div id={"'\\"&quot;<>&amp;quot;"} />;
<div id='123' />;
<div id='&#39;"' />;
<div id={"'\\"\\\\'"} />;
<div
  single='foo'
  single2={"foo"}
  double='bar'
  double2={"bar"}
  singleDouble='"'
  singleDouble2={'"'}
  doubleSingle="'"
  doubleSingle2={"'"}
  singleEscaped={"'"}
  singleEscaped2="'"
  doubleEscaped={'"'}
  doubleEscaped2='"'
  singleBothEscaped={"'\\""}
  singleBothEscaped2='&apos;"'
  singleBoth='&apos; "'
  singleBoth2={"' \\""}
  singleBoth3="' ' &quot;"
  doubleBoth='" &apos;'
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; ' '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{"  "}{" "}
</p>;

================================================================================
`;

exports[`quotes.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id='123' />;
<div id='&#39;&quot;' />;
<div id={'\\'\\"\\\\\\''} />;
<div
  single='foo'
  single2={'foo'}

  double="bar"
  double2={"bar"}

  singleDouble='"'
  singleDouble2={'"'}

  doubleSingle="'"
  doubleSingle2={"'"}

  singleEscaped={'\\''}
  singleEscaped2='&apos;'

  doubleEscaped={"\\""}
  doubleEscaped2="&quot;"

  singleBothEscaped={'\\'"'}
  singleBothEscaped2='&apos;"'

  singleBoth='&apos; "'
  singleBoth2={'\\' "'}
  singleBoth3='&apos; &apos; "'

  doubleBoth="&quot; '"
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; &apos; '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>

=====================================output=====================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id="123" />;
<div id='&#39;"' />;
<div id={"'\\"\\\\'"} />;
<div
  single="foo"
  single2={'foo'}
  double="bar"
  double2={'bar'}
  singleDouble='"'
  singleDouble2={'"'}
  doubleSingle="'"
  doubleSingle2={"'"}
  singleEscaped={"'"}
  singleEscaped2="'"
  doubleEscaped={'"'}
  doubleEscaped2='"'
  singleBothEscaped={'\\'"'}
  singleBothEscaped2="'&quot;"
  singleBoth="' &quot;"
  singleBoth2={'\\' "'}
  singleBoth3="' ' &quot;"
  doubleBoth="&quot; '"
  doubleBoth2={'" \\''}
  doubleBoth3="&quot; ' '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>;

================================================================================
`;

exports[`quotes.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
<div id="&quot;'<>&amp;quot;" />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id='123' />;
<div id='&#39;&quot;' />;
<div id={'\\'\\"\\\\\\''} />;
<div
  single='foo'
  single2={'foo'}

  double="bar"
  double2={"bar"}

  singleDouble='"'
  singleDouble2={'"'}

  doubleSingle="'"
  doubleSingle2={"'"}

  singleEscaped={'\\''}
  singleEscaped2='&apos;'

  doubleEscaped={"\\""}
  doubleEscaped2="&quot;"

  singleBothEscaped={'\\'"'}
  singleBothEscaped2='&apos;"'

  singleBoth='&apos; "'
  singleBoth2={'\\' "'}
  singleBoth3='&apos; &apos; "'

  doubleBoth="&quot; '"
  doubleBoth2={"\\" '"}
  doubleBoth3="&quot; &apos; '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>

=====================================output=====================================
<div id='"&apos;<>&amp;quot;' />;
<div id='"&#39;<>&amp;quot;' />;
<div id={'\\'"&quot;<>&amp;quot;'} />;
<div id='123' />;
<div id='&#39;"' />;
<div id={"'\\"\\\\'"} />;
<div
  single='foo'
  single2={'foo'}
  double='bar'
  double2={'bar'}
  singleDouble='"'
  singleDouble2={'"'}
  doubleSingle="'"
  doubleSingle2={"'"}
  singleEscaped={"'"}
  singleEscaped2="'"
  doubleEscaped={'"'}
  doubleEscaped2='"'
  singleBothEscaped={'\\'"'}
  singleBothEscaped2='&apos;"'
  singleBoth='&apos; "'
  singleBoth2={'\\' "'}
  singleBoth3="' ' &quot;"
  doubleBoth='" &apos;'
  doubleBoth2={'" \\''}
  doubleBoth3="&quot; ' '"
/>;

<p>
  GitHub Desktop has encountered an unrecoverable error and will need to 1231231
  restart. This has been reported to the team, but if youencounter this121312331
  repeatedly please report this issue to the GitHub 12312312312312313{'  '}{' '}
</p>;

================================================================================
`;

exports[`return-statement.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => <div>
  <div>
    bla bla bla
  </div>
</div>;

const NonBreakingArrowExpressionWBody = () => {
  return (
    <div />
  );
};

const BreakingArrowExpressionWBody = () => {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

const NonBreakingFunction = function() {
  return (
    <div />
  );
};

const BreakingFunction = function() {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

class NonBreakingClass extends React.component {
  render() {
    return (
      <div />
    );
  }
}

class BreakingClass extends React.component {
  render() {
    return <div>
      <div>
        bla bla bla
      </div>
    </div>;
  }
}

=====================================output=====================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => (
  <div>
    <div>bla bla bla</div>
  </div>
);

const NonBreakingArrowExpressionWBody = () => {
  return <div />;
};

const BreakingArrowExpressionWBody = () => {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

const NonBreakingFunction = function() {
  return <div />;
};

const BreakingFunction = function() {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

class NonBreakingClass extends React.component {
  render() {
    return <div />;
  }
}

class BreakingClass extends React.component {
  render() {
    return (
      <div>
        <div>bla bla bla</div>
      </div>
    );
  }
}

================================================================================
`;

exports[`return-statement.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => <div>
  <div>
    bla bla bla
  </div>
</div>;

const NonBreakingArrowExpressionWBody = () => {
  return (
    <div />
  );
};

const BreakingArrowExpressionWBody = () => {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

const NonBreakingFunction = function() {
  return (
    <div />
  );
};

const BreakingFunction = function() {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

class NonBreakingClass extends React.component {
  render() {
    return (
      <div />
    );
  }
}

class BreakingClass extends React.component {
  render() {
    return <div>
      <div>
        bla bla bla
      </div>
    </div>;
  }
}

=====================================output=====================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => (
  <div>
    <div>bla bla bla</div>
  </div>
);

const NonBreakingArrowExpressionWBody = () => {
  return <div />;
};

const BreakingArrowExpressionWBody = () => {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

const NonBreakingFunction = function() {
  return <div />;
};

const BreakingFunction = function() {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

class NonBreakingClass extends React.component {
  render() {
    return <div />;
  }
}

class BreakingClass extends React.component {
  render() {
    return (
      <div>
        <div>bla bla bla</div>
      </div>
    );
  }
}

================================================================================
`;

exports[`return-statement.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => <div>
  <div>
    bla bla bla
  </div>
</div>;

const NonBreakingArrowExpressionWBody = () => {
  return (
    <div />
  );
};

const BreakingArrowExpressionWBody = () => {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

const NonBreakingFunction = function() {
  return (
    <div />
  );
};

const BreakingFunction = function() {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

class NonBreakingClass extends React.component {
  render() {
    return (
      <div />
    );
  }
}

class BreakingClass extends React.component {
  render() {
    return <div>
      <div>
        bla bla bla
      </div>
    </div>;
  }
}

=====================================output=====================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => (
  <div>
    <div>bla bla bla</div>
  </div>
);

const NonBreakingArrowExpressionWBody = () => {
  return <div />;
};

const BreakingArrowExpressionWBody = () => {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

const NonBreakingFunction = function() {
  return <div />;
};

const BreakingFunction = function() {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

class NonBreakingClass extends React.component {
  render() {
    return <div />;
  }
}

class BreakingClass extends React.component {
  render() {
    return (
      <div>
        <div>bla bla bla</div>
      </div>
    );
  }
}

================================================================================
`;

exports[`return-statement.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => <div>
  <div>
    bla bla bla
  </div>
</div>;

const NonBreakingArrowExpressionWBody = () => {
  return (
    <div />
  );
};

const BreakingArrowExpressionWBody = () => {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

const NonBreakingFunction = function() {
  return (
    <div />
  );
};

const BreakingFunction = function() {
  return <div>
    <div>
      bla bla bla
    </div>
  </div>
};

class NonBreakingClass extends React.component {
  render() {
    return (
      <div />
    );
  }
}

class BreakingClass extends React.component {
  render() {
    return <div>
      <div>
        bla bla bla
      </div>
    </div>;
  }
}

=====================================output=====================================
const NonBreakingArrowExpression = () => <div />;

const BreakingArrowExpression = () => (
  <div>
    <div>bla bla bla</div>
  </div>
);

const NonBreakingArrowExpressionWBody = () => {
  return <div />;
};

const BreakingArrowExpressionWBody = () => {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

const NonBreakingFunction = function() {
  return <div />;
};

const BreakingFunction = function() {
  return (
    <div>
      <div>bla bla bla</div>
    </div>
  );
};

class NonBreakingClass extends React.component {
  render() {
    return <div />;
  }
}

class BreakingClass extends React.component {
  render() {
    return (
      <div>
        <div>bla bla bla</div>
      </div>
    );
  }
}

================================================================================
`;

exports[`spacing.js 1`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const Labels = {
  label1: (
    <fbt>
      Label 1
    </fbt>
  ),

  label2: (
    <fbt>
      Label 2
    </fbt>
  ),

  label3: (
    <fbt>
      Label 3
    </fbt>
  ),
};

=====================================output=====================================
const Labels = {
  label1: <fbt>Label 1</fbt>,

  label2: <fbt>Label 2</fbt>,

  label3: <fbt>Label 3</fbt>
};

================================================================================
`;

exports[`spacing.js 2`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: false
                                                                                | printWidth
=====================================input======================================
const Labels = {
  label1: (
    <fbt>
      Label 1
    </fbt>
  ),

  label2: (
    <fbt>
      Label 2
    </fbt>
  ),

  label3: (
    <fbt>
      Label 3
    </fbt>
  ),
};

=====================================output=====================================
const Labels = {
  label1: <fbt>Label 1</fbt>,

  label2: <fbt>Label 2</fbt>,

  label3: <fbt>Label 3</fbt>
};

================================================================================
`;

exports[`spacing.js 3`] = `
====================================options=====================================
jsxSingleQuote: false
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const Labels = {
  label1: (
    <fbt>
      Label 1
    </fbt>
  ),

  label2: (
    <fbt>
      Label 2
    </fbt>
  ),

  label3: (
    <fbt>
      Label 3
    </fbt>
  ),
};

=====================================output=====================================
const Labels = {
  label1: <fbt>Label 1</fbt>,

  label2: <fbt>Label 2</fbt>,

  label3: <fbt>Label 3</fbt>
};

================================================================================
`;

exports[`spacing.js 4`] = `
====================================options=====================================
jsxSingleQuote: true
parsers: ["flow", "babylon", "typescript"]
printWidth: 80
singleQuote: true
                                                                                | printWidth
=====================================input======================================
const Labels = {
  label1: (
    <fbt>
      Label 1
    </fbt>
  ),

  label2: (
    <fbt>
      Label 2
    </fbt>
  ),

  label3: (
    <fbt>
      Label 3
    </fbt>
  ),
};

=====================================output=====================================
const Labels = {
  label1: <fbt>Label 1</fbt>,

  label2: <fbt>Label 2</fbt>,

  label3: <fbt>Label 3</fbt>
};

================================================================================
`;
