Js-beautify: Javascript ++ Operator get wrong indent

Created on 29 Oct 2017  ·  10Comments  ·  Source: beautify-web/js-beautify

Description

When I use ++, the next line get wrong indent. If I use += 1, or end with ; , the next line is ok.

Input

The code looked like this before beautification:
before

Actual Output

The code actually looked like this after beautification:
after

Environment

OS:
macOS 10.13

Settings

Example:

"js": {
    "brace_style": "collapse-preserve-inline",
    "break_chained_methods": false,
    "comma_first": false,
    "e4x": false,
    "jslint_happy": false,
    "keep_array_indentation": false,
    "keep_function_indentation": false,
    "operator_position": "before-newline",
    "space_after_anon_function": false,
    "space_before_conditional": true,
    "space_in_empty_paren": false,
    "space_in_paren": false,
    "unescape_strings": false,
    "preserve_newlines": true,
    "max_preserve_newlines": 2
  }
good first issue javascript bug

Most helpful comment

@Gegoiuty
Interesting. Here's the minimal repro:

js

// happens
use(
  config => {
    window.store.loading++

      let extraParams = {}
  }
)

// does not happen.
use(
  config => {
    // loading
    loading++

    let extraParams = {}
  }
)

I don't know when I'll have time to look at this but at least we have a good repro vs non-repro example. Thanks!

All 10 comments

Duplicate of #203.

Thand U.

A little incomprehension: what should I do with this issue?

I mean, this is a old issue since 2013, but it still exists. So, Should I change "window.store.loading++" to "window.store.loading++;" or "++window.store.loading"?

When I change "window.store.loading--" to "--window.store.loading", I get this:
1509356408973

@Gegoiuty

Actually: this doesn't happen on http://jsbeautifier.org/ . Please try you code there. If it works (formats correctly), then your editor/plugin needs updating to use the latest js-beautifier.

I try code in http://jsbeautifier.org/ , and it doesn't format correctly :( .

1509421866160

And this is my code.

import Vue from 'vue'
import axios from 'axios'
import Qs from 'qs'
import moment from 'moment'
import api from 'src/common/api'
import _ from 'lodash'
import Cookies from 'js-cookie'
import router from '../router/index'
import {
    SELECTED_PRODUCT,
    LOGIN_STRING
} from './constant'
import {
    Notification,
    Loading,
    MessageBox
} from 'element-ui'

window.Vue = Vue
window._ = _
window.moment = moment
window.axios = axios
window.Cookies = Cookies
window.app = window.app || {}
window.store = {
    loading: 0
}

Object.assign(app, {
    api,
})

axios.defaults.transformRequest = [(data) => Qs.stringify(data)]
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
axios.defaults.headers.put['Content-Type'] = 'application/x-www-form-urlencoded'

axios.interceptors.request.use(
    config => {
        // loading
        window.store.loading++

            let extraParams = {}
        if (!config.params || !config.params.product) {
            const product = Cookies.get(SELECTED_PRODUCT) ? Cookies.get(SELECTED_PRODUCT) : null
            extraParams.product = product
        }
        const login_string = Cookies.get(LOGIN_STRING)
        if (login_string) {
            extraParams.login_string = login_string
        }
        const params = config.params || {}
        config.params = Object.assign(params, extraParams)
        return config
    },
    error => {
        return Promise.reject(error)
    }
)

let alerted = false

axios.interceptors.response.use(
    res => {
        window.store.loading--;
        if (res.data && res.data.code === 0) {
            return res.data.data
        }
        Notification.error({
            title: 'Fail',
            message: res.data.msg
        })
        return Promise.reject(res.data.msg)
    },
    error => {
        const err = error.response
        window.store.loading--

            if (err) {
                switch (err.status) {

                    case 401:
                        if (!alerted) {
                            alerted = true
                            MessageBox.alert('Please login again.', 'Logout!', {
                                confirmButtonText: 'confirm',
                                callback() {
                                    Cookies.remove(LOGIN_STRING)
                                    router.push({
                                        path: '/login',
                                        query: {
                                            redirectUrl: window.location.href
                                        }
                                    })
                                }
                            })
                        }
                        break
                    default:
                        Notification.error({
                            title: 'Fail',
                            message: err
                        })
                        return Promise.reject(error)
                }
            }
        return Promise.reject(error)
    }
)

By the way, I use HTML-CSS-JS Prettify in Sublime Text 3 Build 3143, macOS 10.13.

@Gegoiuty
Interesting. Here's the minimal repro:

js

// happens
use(
  config => {
    window.store.loading++

      let extraParams = {}
  }
)

// does not happen.
use(
  config => {
    // loading
    loading++

    let extraParams = {}
  }
)

I don't know when I'll have time to look at this but at least we have a good repro vs non-repro example. Thanks!

Hello, do you have any info on when and if you will adresse this issue ?

@Elrendio I have almost no time to work on this project currently, but I will make time to review any pull request submissions.

Hello, I'v done a commit to resolve this issue (handled python and node changes), all the tests pass (python and js). However I dont have the rights to push a new branch and create à PR.

Thanks!
Create a fork, push to a branch there, and PR from there.

On Fri, May 4, 2018, 6:41 AM Oscar Walter notifications@github.com wrote:

Hello, I'v done a commit to resolve this issue (handled python and node
changes), all the test pass (python and js). However I dont have the rights
to push a new branch and create à PR.


You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
https://github.com/beautify-web/js-beautify/issues/1283#issuecomment-386604905,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AB3kKc4ccX0ZVPB0WNl0gwbujerxzBTeks5tvFqcgaJpZM4QKVNL
.

Was this page helpful?
0 / 5 - 0 ratings