Formatter: unexpected indent for jsx element when format a selection

[hanzooo]

Bug Report

🔎 Search Terms

• jsx
• format
• indent
• BinaryExpression

🕗 Version & Regression Information

• version: 4.4.0-dev.20210620

Steps to Reproduce:

1. use vscode, choose the format on save mode modifications
2. for the below test code, when change the line type some text 1 and save(invoke the format), the indent is unexpected.

function TestWidget() {
    const test = true;
    return (
        <div>
            {test &&
                <div>
                    <div>type some text 1</div>
                    <div>some text 2</div>
                    <div>some text 3</div>
                </div>
            }
            <div>some text</div>
        </div>
    );
}

🙁 Actual behavior

function TestWidget() {
    const test = true;
    return (
        <div>
            {test &&
                <div>
                <div>type some text 1</div>
                    <div>some text 2</div>
                    <div>some text 3</div>
                </div>
            }
            <div>some text</div>
        </div>
    );
}

the indent of line type some text 1 did not fit for the parent element.

🙂 Expected behavior

function TestWidget() {
    const test = true;
    return (
        <div>
            {test &&
                <div>
                    <div>type some text 1</div>
                    <div>some text 2</div>
                    <div>some text 3</div>
                </div>
            }
            <div>some text</div>
        </div>
    );
}

the indent of line type some text 1 is expected, which fit for the parent element and behavior like formatting the whole file.