diff --git a/src/printer.js b/src/printer.js index 0e023a271..1902f4f66 100644 --- a/src/printer.js +++ b/src/printer.js @@ -1091,8 +1091,13 @@ function genericPrintNoParens(path, options, print) { concat([ "<", path.call(print, "name"), - concat(path.map(attr => concat([" ", print(attr)]), "attributes")), - n.selfClosing ? " />" : ">" + multilineGroup(concat([ + indent(options.tabWidth, + concat(path.map(attr => concat([line, print(attr)]), "attributes")) + ), + n.selfClosing ? line : softline, + ])), + n.selfClosing ? "/>" : ">" ]) ); case "JSXClosingElement": diff --git a/tests/prettier/__snapshots__/jsfmt.spec.js.snap b/tests/prettier/__snapshots__/jsfmt.spec.js.snap index dfa2c53cb..a6beaecc0 100644 --- a/tests/prettier/__snapshots__/jsfmt.spec.js.snap +++ b/tests/prettier/__snapshots__/jsfmt.spec.js.snap @@ -70,15 +70,65 @@ const comp3 = ( ); const comp4 = ( -
Create wrapping parens and indentall the things.
+
Create wrapping parens and indentall the things.
); const comp5 =
Keep it on one line.
; " `; +exports[`test jsx-split-attrs.js 1`] = ` +"long_closed = + + +long_open = + + hello + + +short_closed = + + +short_open = + + hello + +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ +long_closed = ( + +); + +long_open = ( + + hello + +); + +short_closed = ; + +short_open = ( + + hello + +); +" +`; + exports[`test jsx-stateless-arrow-fn.js 1`] = ` "const render1 = ({ styles }) => (
@@ -115,9 +165,10 @@ const render3 = ({ styles }) => ( ); const render4 = ({ styles }) => ( -
Create wrapping parens and indentall the things.
+
Create wrapping parens and indentall the things.
); const render5 = ({ styles }) =>
Keep it on one line.
; diff --git a/tests/prettier/jsx-split-attrs.js b/tests/prettier/jsx-split-attrs.js new file mode 100644 index 000000000..8d725ccf5 --- /dev/null +++ b/tests/prettier/jsx-split-attrs.js @@ -0,0 +1,15 @@ +long_closed = + + +long_open = + + hello + + +short_closed = + + +short_open = + + hello +