@{{ }} not working as expected

[cossssmin]

Noticed two issues with using @{{ }} for ignoring expressions.

Escaping fails inside attributes

This:

<a href="@{{ foo }}">Home</a>

Becomes this:

<a href="@{{ undefined }}">Home</a>

It still tries to evaluate the expression when inside an attribute.

Escaping in content is a bit glitchy

<p>This is some @{{ variable }}, and here is another: @{{ bar }}</p>

Becomes:

<p>This is some {{ variable }}, and here is another: @{{ bar }}</p>

Basically, since the node is returned right when @ is encountered, any subsequent escaped expressions will be returned as-is (including the @ symbol).

So it's actually enough to do:

<p>This is some @{{ variable }}, and here is another: {{ bar }}</p>

... and that will output:

<p>This is some {{ variable }}, and here is another: {{ bar }}</p>

However, this isn't expected behavior.

[cossssmin]

Found the issue with point 2)

This line doesn't do a global replace:

posthtml-expressions/lib/index.js

Line 185 in 3e2f583

node = node.replace(`@${before}`, before)

Should be rewritten to something like:

const toReplace = new RegExp(`@${before}`, 'g')
node = node.replace(toReplace, before)

[cossssmin]

Found the issue with 1) as well - we're not doing anything if we're inside an attribute 🤦‍♂️

posthtml-expressions/lib/index.js

Lines 199 to 204 in 3e2f583

	// if not, we have an object, so we need to run the attributes and contents
	if (node.attrs) {
	for (const key in node.attrs) {
	node.attrs[key] = placeholders(node.attrs[key], ctx, delimitersSettings)
	}
	}

... could be rewritten to:

// if not, we have an object, so we need to run the attributes and contents
if (node.attrs) {
  for (const key in node.attrs) {
    if (!ignoredDelimiter.test(node.attrs[key])) {
      node.attrs[key] = placeholders(node.attrs[key], ctx, delimitersSettings)
    } else {
      node.attrs[key] = node.attrs[key].replace(toReplace, before)
    }
  }
}

I'll prepare a PR for both these issues after we get #75 in 👍