Atom-beautify: Beautification in progress keeps circling indefinitely

[blacelle]

Description

Failure to format leads to infinite "Beautification in progress"
Atom 1.34.0
atom-beautify 0.33.4

I consider a .vue file with Prettier as Default Beautifier

Input Before Beautification

<a :href="method()" >Text<a/>

Expected Output

I did not expected beautify to fix my broken html

Actual Output

The beautified code actually looked like this:

<a :href="method()" >Text<a/>

Steps to Reproduce

1. Add code to Atom editor
2. Write invalid html: ''
3. Save the file with auto-beatuify on save
4. 'Beatufication in progress' keeps utrning indefinitely
   

Debug

Stack:

SyntaxError: Unexpected closing tag "b-col". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags (58:7)
  56 |         </button>
  57 |         <a :href="method()" >Text<a/>
> 58 |       </b-col>
     |       ^
  59 |     </b-row>
  60 |   </div>
  61 | </template>
    at Vt (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/parser-html.js:1)
    at gn (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/parser-html.js:1)
    at e (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/parser-html.js:1)
    at Object.parse (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/parser-html.js:1)
    at Object.parse$2 [as parse] (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:10600)
    at coreFormat (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:13763)
    at format (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:13939)
    at formatWithCursor (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:13951)
    at /Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:41967
    at Object.format (/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/index.js:41986)
    at prettier.coffee? [sm]:10
    at <anonymous>

[prettydiff]

Looks like an endless loop in Prettier's HTML parser. I cannot reproduce this issue in the prettier demo tool. What version of prettier is it? You can find the version at

/Users/benoit/.atom/packages/atom-beautify/node_modules/prettier/package.json

[blacelle]

  "_from": "prettier@^1.11.1",
  "_id": "[email protected]",

  "_requested": {
    "type": "range",
    "registry": true,
    "raw": "prettier@^1.11.1",
    "name": "prettier",
    "escapedName": "prettier",
    "rawSpec": "^1.11.1",
    "saveSpec": null,
    "fetchSpec": "^1.11.1"
  },

  "_resolved": "https://registry.npmjs.org/prettier/-/prettier-1.15.3.tgz",
  "_shasum": "1feaac5bdd181237b54dbe65d874e02a1472786a",
  "_spec": "prettier@^1.11.1",

  "version": "1.15.3"

[thorn0]

Looks like an unhandled exception, not an infinite loop.

[prettydiff]

@blacelle what is the complete code sample that produced this error?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. If this is still an issue, please add a comment. It will be closed if no further activity occurs. Thank you for your contributions.

[MKeiNll]

Same problem with .tsx and Prettier as default beautifier.

atom-beautify 0.33.4
atom 1.35.1

Sample code:

import * as React from "react";
import { Component } from "react";
import Entry from "./Entry";

class EntryList extends Component<any, any> {
  render() {
    return (
      <ul className= "entry-list" >
      <div className="title-container" >
        <span className="title" > BUCKET LIST < /span>
          < form action = "report" >
            <input type="submit" className = "report-button" value = "REPORT" />
              </form>
              < /div>
    {
      this.props.entries.map(entry => (
        <Entry
            key= { entry.id }
            { ...entry }
            onDeleteButtonClick = {() => {
          this.props.onDeleteButtonClick(entry.id);
        }}
    onEntryClick = {() => {
      this.props.onEntryClick(entry);
    }
  }
          />
        ))}
</ul>
    );
  }
}

export default EntryList;