Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-98422

qmlformat incorrect formatting of several cases

    XMLWordPrintable

Details

    • macOS
    • c8f9cb050d (qt/qtdeclarative/dev) c8f9cb050d (qt/tqtc-qtdeclarative/dev)

    Description

      Hello there,

      I wanted to use qmlformat (from 6.2.1 version) to format qml files in entire project and also use it in CI as code style check. Unfortunately, there are several issues that blocks us from using it:

      1. qml can not format arrow js functions properly

      input:

       

      a.map(x => x * 2)
      

      output:

       

       

      a.map(x => x * 2;);
      

      semicolon inside arrow function makes it an invalid code - actual js error. There should not be semicolon after x*2 operation

       

      qmlformat also generates these errors:

      qt.qmldom.writeOut: writeOut of test.qml created invalid code
      [Dom][QmlFile][Parsing] Error: Unexpected token `;' for .currentItem
      

      As a workaround one can replace arrow functions with lambdas(see the next point's example).

      2. it removes all whitespace in js, making it unreadable

      input:

       

      onWidthChanged: {
        console.log(" 124 ")
        
        let a = [1, 2, 3, 4]  
        a.map( function (x) { return x*2 })  
      
        if (a.length === 4) // this is good!
        {
          console.log("good!")
        }
      }
      

      output (whitespace lines are removed and there is no flag to turn it off):

       

       

        onWidthChanged: {
          console.log(" 124 ");
          let a = [1, 2, 3, 4];
          a.map(function (x) {
              return x * 2;
            });
          if (a.length === 4 // this is good!
          ) {
            console.log("good!");
          }
        }
      

       

      3. line comment after `if` condition puts one bracket to a new line:

      example input:

       

       

      if (a.length === 4) // this is good!
      {
      console.log("good!")
      }
      

      is formatted to:

       

       

      if (a.length === 4 // this is good!
      ) {
        console.log("good!");
      }
      

       

      Look at the `)` bracket - it is moved to a new line

       

      I would also like to ask for two more options:

      • Could we have an option to disable placing of semicolons? They are now added automatically to the end of each js line.
      • Place a new line after `id` property - it would make components more readable

       

      I have used qmlformat like this: 

      qmlformat -w 2 -n test.qml

      Attachments

        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

        Activity

          People

            qtqmlteam Qt Qml Team User
            tomasmizera Tomas Mizera
            Votes:
            1 Vote for this issue
            Watchers:
            3 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved:

              Gerrit Reviews

                There are no open Gerrit changes