diff --git a/changelog_unreleased/javascript/12860.md b/changelog_unreleased/javascript/12860.md new file mode 100644 index 000000000..22497b9e0 --- /dev/null +++ b/changelog_unreleased/javascript/12860.md @@ -0,0 +1,49 @@ +#### Fix comment formats in (#12860 by @HosokawaR) + +This change fixes comments format in `exports` to algin with the comment format in `import` + +Although this change does not affect the comments format in `import`, follows change log contains examples of comments in `import` for reference. + + +```jsx +// Input +export { + foo, + + bar as // comment + baz, +} + +import { + foo, + + bar as // comment + baz, +} from 'foo' + +// Prettier stable +export { + foo, + bar as baz, // comment +}; + +import { + foo, + // comment + bar as baz, +} from "foo"; + +// Prettier main +export { + foo, + // comment + bar as baz, +}; + +import { + foo, + // comment + bar as baz, +} from "foo"; + +``` diff --git a/src/language-js/comments.js b/src/language-js/comments.js index 67dba0700..cb32c25a1 100644 --- a/src/language-js/comments.js +++ b/src/language-js/comments.js @@ -61,7 +61,6 @@ function handleOwnLineComment(context) { handleWhileComments, handleTryStatementComments, handleClassComments, - handleImportSpecifierComments, handleForComments, handleUnionTypeComments, handleOnlyComments, @@ -82,7 +81,7 @@ function handleEndOfLineComment(context) { handleClosureTypeCastComments, handleLastFunctionArgComments, handleConditionalExpressionComments, - handleImportSpecifierComments, + handleModuleSpecifiersComments, handleIfStatementComments, handleWhileComments, handleTryStatementComments, @@ -623,14 +622,6 @@ function handleLastFunctionArgComments({ return false; } -function handleImportSpecifierComments({ comment, enclosingNode }) { - if (enclosingNode?.type === "ImportSpecifier") { - addLeadingComment(enclosingNode, comment); - return true; - } - return false; -} - function handleLabeledStatementComments({ comment, enclosingNode }) { if (enclosingNode?.type === "LabeledStatement") { addLeadingComment(enclosingNode, comment); @@ -768,6 +759,14 @@ function handleModuleSpecifiersComments({ enclosingNode, text, }) { + if ( + enclosingNode?.type === "ImportSpecifier" || + enclosingNode?.type === "ExportSpecifier" + ) { + addLeadingComment(enclosingNode, comment); + return true; + } + const isImportDeclaration = precedingNode?.type === "ImportSpecifier" && enclosingNode?.type === "ImportDeclaration"; diff --git a/tests/format/js/comments/__snapshots__/jsfmt.spec.js.snap b/tests/format/js/comments/__snapshots__/jsfmt.spec.js.snap index 6d67a9eef..7078a9076 100644 --- a/tests/format/js/comments/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/js/comments/__snapshots__/jsfmt.spec.js.snap @@ -1474,6 +1474,24 @@ export { barr, // comment } +const foooo = '' +const barrr = '' +export { + foooo, + + barrr as // comment + baz, +} from 'foo' + +const fooooo = '' +const barrrr = '' +export { + fooooo, + + barrrr as // comment + bazz, +} + =====================================output===================================== export //comment {} @@ -1498,6 +1516,22 @@ export { barr, // comment } +const foooo = "" +const barrr = "" +export { + foooo, + // comment + barrr as baz, +} from "foo" + +const fooooo = "" +const barrrr = "" +export { + fooooo, + // comment + barrrr as bazz, +} + ================================================================================ `; @@ -1530,6 +1564,24 @@ export { barr, // comment } +const foooo = '' +const barrr = '' +export { + foooo, + + barrr as // comment + baz, +} from 'foo' + +const fooooo = '' +const barrrr = '' +export { + fooooo, + + barrrr as // comment + bazz, +} + =====================================output===================================== export //comment {}; @@ -1554,6 +1606,141 @@ export { barr, // comment }; +const foooo = ""; +const barrr = ""; +export { + foooo, + // comment + barrr as baz, +} from "foo"; + +const fooooo = ""; +const barrrr = ""; +export { + fooooo, + // comment + barrrr as bazz, +}; + +================================================================================ +`; + +exports[`export-and-import.js - {"semi":false} format 1`] = ` +====================================options===================================== +parsers: ["babel", "flow", "typescript"] +printWidth: 80 +semi: false + | printWidth +=====================================input====================================== +// These are tests to compare comment formats in \`export\` and \`import\`. + +export { + foo, + + bar as // comment + baz, +} from 'foo' + +const fooo = "" +const barr = "" + +export { + fooo, + + barr as // comment + bazz, +} + +import { + foo, + + bar as // comment + baz, +} from 'foo' + +=====================================output===================================== +// These are tests to compare comment formats in \`export\` and \`import\`. + +export { + foo, + // comment + bar as baz, +} from "foo" + +const fooo = "" +const barr = "" + +export { + fooo, + // comment + barr as bazz, +} + +import { + foo, + // comment + bar as baz, +} from "foo" + +================================================================================ +`; + +exports[`export-and-import.js format 1`] = ` +====================================options===================================== +parsers: ["babel", "flow", "typescript"] +printWidth: 80 + | printWidth +=====================================input====================================== +// These are tests to compare comment formats in \`export\` and \`import\`. + +export { + foo, + + bar as // comment + baz, +} from 'foo' + +const fooo = "" +const barr = "" + +export { + fooo, + + barr as // comment + bazz, +} + +import { + foo, + + bar as // comment + baz, +} from 'foo' + +=====================================output===================================== +// These are tests to compare comment formats in \`export\` and \`import\`. + +export { + foo, + // comment + bar as baz, +} from "foo"; + +const fooo = ""; +const barr = ""; + +export { + fooo, + // comment + barr as bazz, +}; + +import { + foo, + // comment + bar as baz, +} from "foo"; + ================================================================================ `; diff --git a/tests/format/js/comments/export-and-import.js b/tests/format/js/comments/export-and-import.js new file mode 100644 index 000000000..440ddc67f --- /dev/null +++ b/tests/format/js/comments/export-and-import.js @@ -0,0 +1,25 @@ +// These are tests to compare comment formats in `export` and `import`. + +export { + foo, + + bar as // comment + baz, +} from 'foo' + +const fooo = "" +const barr = "" + +export { + fooo, + + barr as // comment + bazz, +} + +import { + foo, + + bar as // comment + baz, +} from 'foo' diff --git a/tests/format/js/comments/export.js b/tests/format/js/comments/export.js index 172505bca..bac1f3e88 100644 --- a/tests/format/js/comments/export.js +++ b/tests/format/js/comments/export.js @@ -20,3 +20,21 @@ export { fooo, // comment barr, // comment } + +const foooo = '' +const barrr = '' +export { + foooo, + + barrr as // comment + baz, +} from 'foo' + +const fooooo = '' +const barrrr = '' +export { + fooooo, + + barrrr as // comment + bazz, +}