feat(rome_js_formatter): Binary like object literal member expression #2688

denbezrukov · 2022-06-09T07:53:42Z

Summary

Rome adds an extra indent for a binary like object literal member expressions.

Added should_inline for JsAnyBinaryLikeExpression.

https://github.com/prettier/prettier/blob/aa1d536e29a55e4647452e87c2fa61c2b8c7d92d/src/language-js/print/binaryish.js#L317-L338

Added a new conditional branch which checks that binary like expression is a value of PROPERTY_OBJECT_MEMBER in should_not_indent_if_parent_indents for FlattenedBinaryExpressionPart.

https://github.com/prettier/prettier/blob/aa1d536e29a55e4647452e87c2fa61c2b8c7d92d/src/language-js/print/binaryish.js#L91-L128

Input

let a = {
    blablah:
      "aldkfkladfskladklsfkladklfkaldfadfkdaf" 
      +"adlfasdklfkldsklfakldsfkladsfkadsfladsfa" 
      +"dflkadfkladsfklkadlfkladlfkadklfjadlfdfdaf",

     loadNext: (stateIsOK && hasNext) || {
		skipNext: true,
	},
}

Prettier


let a = {
	blablah:
		"aldkfkladfskladklsfkladklfkaldfadfkdaf" +
		"adlfasdklfkldsklfakldsfkladsfkadsfladsfa" +
		"dflkadfkladsfklkadlfkladlfkadklfjadlfdfdaf",

	loadNext: (stateIsOK && hasNext) || {
		skipNext: true,
	},
};

Rome

let a = {
	blablah:
		"aldkfkladfskladklsfkladklfkaldfadfkdaf" +
			"adlfasdklfkldsklfakldsfkladsfkadsfladsfa" +
			"dflkadfkladsfklkadlfkladlfkadklfjadlfdfdaf",

	loadNext:
		(stateIsOK && hasNext) || {
			skipNext: true,
		},
};

Test Plan

New tests to cover the case.
Added new tests cases for crates/rome_js_formatter/tests/specs/js/module/object/property_object_member.js

{
      ...,
      blablah:
        "aldkfkladfskladklsfkladklfkaldfadfkdaf" +
        "adlfasdklfkldsklfakldsfkladsfkadsfladsfa" +
        "dflkadfkladsfklkadlfkladlfkadklfjadlfdfdaf",
}

and

{
   ..., 
  loadNext: (stateIsOK && hasNext) || {
      skipNext: true,
  },
}

denbezrukov · 2022-06-09T07:56:24Z

crates/rome_js_formatter/tests/specs/prettier/js/binary-expressions/inline-object-array.js.snap

+    stateIsOK &&
+    {
+      loadState: LOADED,
+      opened: false,


I haven't added this case to spec because it still has the wrong print.
Playground

denbezrukov · 2022-06-09T08:21:16Z

crates/rome_js_formatter/src/utils/binary_like_expression.rs

+    /// Determines if a binary like expression should be inline or not.
+    pub fn should_inline(&self) -> bool {
+        match self {
+            JsAnyBinaryLikeExpression::JsLogicalExpression(logical_expression) => {
+                match logical_expression.right() {
+                    Ok(JsAnyExpression::JsObjectExpression(object_expression)) => {
+                        object_expression.members().iter().count() > 0
+                    }
+                    Ok(JsAnyExpression::JsArrayExpression(array_expression)) => {
+                        array_expression.elements().iter().count() > 0
+                    }
+                    _ => false,
+                }
+            }
+            _ => false,
+        }
+    }


https://github.com/prettier/prettier/blob/aa1d536e29a55e4647452e87c2fa61c2b8c7d92d/src/language-js/print/binaryish.js#L317-L338

denbezrukov · 2022-06-09T08:26:03Z

crates/rome_js_formatter/src/utils/binary_like_expression.rs

+fn should_not_indent_if_parent_indents(current_node: &JsAnyBinaryLikeLeftExpression) -> bool {
+    let parent_kind = current_node.syntax().parent().map(|parent| parent.kind());
+
+    match parent_kind {
+        Some(JsSyntaxKind::JS_PROPERTY_OBJECT_MEMBER) => current_node
+            .as_expression()
+            .and_then(|expression| is_break_after_colon(expression).ok())
+            .unwrap_or(false),
+        Some(JsSyntaxKind::JS_RETURN_STATEMENT | JsSyntaxKind::JS_ARROW_FUNCTION_EXPRESSION) => {
+            true
+        }
+        _ => false,
+    }


I'm confused by prettier code, because it duplicates conditionals from assignment.

https://github.com/prettier/prettier/blob/aa1d536e29a55e4647452e87c2fa61c2b8c7d92d/src/language-js/print/binaryish.js#L91-L128

https://github.com/prettier/prettier/blob/aa1d536e29a55e4647452e87c2fa61c2b8c7d92d/src/language-js/print/assignment.js#L176-L181

Or maybe it's the other way around, assignments formatting logic that is borrowed from binary like formatting logic

ematipico · 2022-06-09T12:44:48Z

Thank you @Dominionys for you contribution! Could you restore the PR template and add the "Test Plan" section, please? This helps the reviewers to understand how you tested (or you plan to verify) your new changes and highlight possible known regressions.

…teral_member_expression # Conflicts: # crates/rome_js_formatter/src/utils/binary_like_expression.rs

feat(rome_js_formatter): Binary like object literal member expression

3a3d129

denbezrukov commented Jun 9, 2022

View reviewed changes

Merge remote-tracking branch 'origin/main' into binary_like_object_li…

6a90828

…teral_member_expression # Conflicts: # crates/rome_js_formatter/src/utils/binary_like_expression.rs

ematipico approved these changes Jun 10, 2022

View reviewed changes

ematipico merged commit 968ce36 into rome:main Jun 10, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(rome_js_formatter): Binary like object literal member expression #2688

feat(rome_js_formatter): Binary like object literal member expression #2688

denbezrukov commented Jun 9, 2022 •

edited

denbezrukov Jun 9, 2022 •

edited

denbezrukov Jun 9, 2022

denbezrukov Jun 9, 2022 •

edited

ematipico Jun 10, 2022

ematipico commented Jun 9, 2022 •

edited

feat(rome_js_formatter): Binary like object literal member expression #2688

feat(rome_js_formatter): Binary like object literal member expression #2688

Conversation

denbezrukov commented Jun 9, 2022 • edited

Summary

Input

Prettier

Rome

Test Plan

denbezrukov Jun 9, 2022 • edited

Choose a reason for hiding this comment

denbezrukov Jun 9, 2022

Choose a reason for hiding this comment

denbezrukov Jun 9, 2022 • edited

Choose a reason for hiding this comment

ematipico Jun 10, 2022

Choose a reason for hiding this comment

ematipico commented Jun 9, 2022 • edited

denbezrukov commented Jun 9, 2022 •

edited

denbezrukov Jun 9, 2022 •

edited

denbezrukov Jun 9, 2022 •

edited

ematipico commented Jun 9, 2022 •

edited