Fix formatting of form_for expressions in .leex files

lib/liveview.js

@@ -0,0 +1,17 @@
+const liveViewFormForPlaceholder = '<form>';
+
+const encodeFormForExpressions = (text) => {
+  const liveViewFormExpressions = [];
+  const textWithPlaceholders = text.replace(/(<%=?[^%>]*=\s+form_for[\s\S]*?%>|<form>)/gm, (match) => {
+    liveViewFormExpressions.push(match);
+
+    return liveViewFormForPlaceholder;
+  });
+
+  return { liveViewFormExpressions, textWithPlaceholders };
+};
+
+module.exports = {
+  encodeFormForExpressions,
+  liveViewFormForPlaceholder,
+};

lib/parser.js

@@ -1,8 +1,14 @@
 const { tokenizeHTML } = require('prettier-html-templates');
 const expressionTypeMatcher = require('./expression_type_matcher');
+const { encodeFormForExpressions } = require('./liveview');
 
 function parse(text, parsers, options) {
-  return tokenizeHTML(text, /<%[\s\S]*?%>/gm, expressionTypeMatcher);
+  const { liveViewFormExpressions, textWithPlaceholders } = encodeFormForExpressions(text);
+
+  return {
+    tokens: tokenizeHTML(textWithPlaceholders, /<%[\s\S]*?%>/gm, expressionTypeMatcher),
+    liveViewFormExpressions,
+  };
 }
 
 module.exports = {

lib/printers.js

@@ -2,10 +2,11 @@ const prettier = require('prettier');
 const { mapDoc } = require('prettier').doc.utils;
 const { encodeExpressions, decodeExpressions } = require('prettier-html-templates');
 const { formatEex } = require('./formatter');
+const { liveViewFormForPlaceholder } = require('./liveview');
 
 // args: path, print, textToDoc, options
 function embed(path, _print, textToDoc, options) {
-  const tokens = path.stack[0];
+  const { tokens, liveViewFormExpressions } = path.stack[0];
 
   const isTextWithExpressions = tokens.find((token) => token.type !== 'text');
 
@@ -14,13 +15,19 @@ function embed(path, _print, textToDoc, options) {
   }
 
   const formattedTokens = formatEex(tokens, options);
-  const [text, expressionMap] = encodeExpressions(formattedTokens);
+  const [textWithPlaceholders, expressionMap] = encodeExpressions(formattedTokens);
 
-  const htmlDoc = textToDoc(text, { parser: 'html' });
+  const htmlDoc = textToDoc(textWithPlaceholders, { parser: 'html' });
 
   const callback = decodeExpressions(expressionMap);
-
-  return mapDoc(htmlDoc, callback);
+  return mapDoc(htmlDoc, (doc) => {
+    let newDoc = doc;
+    if (doc === liveViewFormForPlaceholder) {
+      newDoc = liveViewFormExpressions.shift();
+    }
+
+    return callback(newDoc);
+  });
 }
 
 module.exports = {

tests/expressions/__snapshots__/jsfmt.spec.js.snap

@@ -1,5 +1,53 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`liveview_form_for.html.leex 1`] = `
+====================================options=====================================
+parsers: ["eex"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+<div>
+  <%= f = form_for a %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <form></form>
+  </div>
+  <%= f = form_for b %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <div>
+      <%= fs = form_for c %>
+        <%= text_input f, :name %>
+      </form>
+    </div>
+  </div>
+</div>
+
+=====================================output=====================================
+<div>
+  <%= f = form_for a %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <form></form>
+  </div>
+  <%= f = form_for b %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <div>
+      <%= fs = form_for c %>
+        <%= text_input f, :name %>
+      </form>
+    </div>
+  </div>
+</div>
+
+================================================================================
+`;
+
 exports[`multiline.html.eex 1`] = `
 ====================================options=====================================
 parsers: ["eex"]

tests/expressions/liveview_form_for.html.leex

@@ -0,0 +1,18 @@
+<div>
+  <%= f = form_for a %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <form></form>
+  </div>
+  <%= f = form_for b %>
+    <%= text_input f, :name %>
+  </form>
+  <div>
+    <div>
+      <%= fs = form_for c %>
+        <%= text_input f, :name %>
+      </form>
+    </div>
+  </div>
+</div>