Fixed: not to indentation the contents on the <textarea> in html-indent (#681)

Author: ota-meshi

lib/utils/indent-common.js

@@ -19,6 +19,7 @@ const LT_CHAR = /[\r\n\u2028\u2029]/
 const LINES = /[^\r\n\u2028\u2029]+(?:$|\r\n|[\r\n\u2028\u2029])/g
 const BLOCK_COMMENT_PREFIX = /^\s*\*/
 const ITERATION_OPTS = Object.freeze({ includeComments: true, filter: isNotWhitespace })
+const PREFORMATTED_ELEMENT_NAMES = ['pre', 'textarea']
 
 /**
  * Normalize options.
@@ -324,6 +325,7 @@ module.exports.defineVisitor = function create (context, tokenStore, defaultOpti
       includeComments: true,
       filter: token => token != null && (
         token.type === 'HTMLText' ||
+        token.type === 'HTMLRCDataText' ||
         token.type === 'HTMLTagOpen' ||
         token.type === 'HTMLEndTagOpen' ||
         token.type === 'HTMLComment'
@@ -881,7 +883,7 @@ module.exports.defineVisitor = function create (context, tokenStore, defaultOpti
     },
 
     VElement (node) {
-      if (node.name !== 'pre') {
+      if (!PREFORMATTED_ELEMENT_NAMES.includes(node.name)) {
         const isTopLevel = node.parent.type !== 'VElement'
         const offset = isTopLevel ? options.baseIndent : 1
         processNodeList(node.children.filter(isNotEmptyTextNode), node.startTag, node.endTag, offset)

tests/lib/rules/html-indent.js

@@ -269,7 +269,7 @@ tester.run('html-indent', rule, loadPatterns(
       }]
     },
 
-    // Pre
+    // Pre, Textarea
     {
       filename: 'test.vue',
       code: unIndent`
@@ -282,6 +282,18 @@ tester.run('html-indent', rule, loadPatterns(
         </template>
       `
     },
+    {
+      filename: 'test.vue',
+      code: unIndent`
+        <template>
+          <textarea>
+        aaa
+          bbb
+            ccc
+          </textarea>
+        </template>
+      `
+    },
     {
       filename: 'test.vue',
       code: unIndent`
@@ -327,6 +339,17 @@ tester.run('html-indent', rule, loadPatterns(
         </template>
       `
     },
+    {
+      filename: 'test.vue',
+      code: unIndent`
+        <template>
+          <div><textarea>aaa
+        bbb ccc
+        ddd
+        fff</textarea></div>
+        </template>
+      `
+    },
     {
       filename: 'test.vue',
       code: unIndent`
@@ -619,7 +642,7 @@ tester.run('html-indent', rule, loadPatterns(
       ]
     },
 
-    // Pre
+    // Pre, Textarea
     {
       filename: 'test.vue',
       code: unIndent`
@@ -668,19 +691,61 @@ tester.run('html-indent', rule, loadPatterns(
         </template>
       `,
       output: unIndent`
-      <template>
-        <pre
-          :class="[
-            'a',
-            'b',
-            'c'
-          ]"
+        <template>
+          <pre
+            :class="[
+              'a',
+              'b',
+              'c'
+            ]"
+          >
+        aaa
+        bbb
+        ccc
+        </pre>
+        </template>
+      `,
+      errors: [
+        { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 2 },
+        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 3 },
+        { message: 'Expected indentation of 6 spaces but found 0 spaces.', line: 4 },
+        { message: 'Expected indentation of 6 spaces but found 0 spaces.', line: 5 },
+        { message: 'Expected indentation of 6 spaces but found 0 spaces.', line: 6 },
+        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 7 },
+        { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 8 }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: unIndent`
+        <template>
+        <textarea
+        :class="[
+        'a',
+        'b',
+        'c'
+        ]"
         >
-      aaa
-      bbb
-      ccc
-      </pre>
-      </template>
+        aaa
+        bbb
+        ccc
+        </textarea>
+        </template>
+      `,
+      output: unIndent`
+        <template>
+          <textarea
+            :class="[
+              'a',
+              'b',
+              'c'
+            ]"
+          >
+        aaa
+        bbb
+        ccc
+        </textarea>
+        </template>
       `,
       errors: [
         { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 2 },