Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -256,6 +256,7 @@ rules in templates can be disabled with eslint directives with mustache or html
| [template-no-obsolete-elements](docs/rules/template-no-obsolete-elements.md) | disallow obsolete HTML elements | | | |
| [template-no-outlet-outside-routes](docs/rules/template-no-outlet-outside-routes.md) | disallow {{outlet}} outside of route templates | | | |
| [template-no-page-title-component](docs/rules/template-no-page-title-component.md) | disallow usage of ember-page-title component | | | |
| [template-no-unnecessary-curly-parens](docs/rules/template-no-unnecessary-curly-parens.md) | disallow unnecessary parentheses enclosing statements in curlies | | 🔧 | |
| [template-no-unused-block-params](docs/rules/template-no-unused-block-params.md) | disallow unused block parameters in templates | | | |
| [template-no-valueless-arguments](docs/rules/template-no-valueless-arguments.md) | disallow valueless named arguments | | | |
| [template-no-whitespace-for-layout](docs/rules/template-no-whitespace-for-layout.md) | disallow using whitespace for layout purposes | | | |
Expand Down
38 changes: 38 additions & 0 deletions docs/rules/template-no-unnecessary-curly-parens.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
# ember/template-no-unnecessary-curly-parens

🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).

<!-- end auto-generated rule header -->

Disallow unnecessary parentheses enclosing statements in curlies. When invoking a helper with arguments, the outer parentheses around the entire expression are unnecessary.

## Examples

This rule **forbids** the following:

```gjs
<template>
{{(concat "a" "b")}}
</template>
```

```gjs
<template>
{{(helper a="b")}}
</template>
```

This rule **allows** the following:

```gjs
<template>
{{foo}}
{{(foo)}}
{{concat "a" "b"}}
{{concat (capitalize "foo") "-bar"}}
</template>
```

## References

- Ember's [Helper Functions](https://guides.emberjs.com/release/components/helper-functions/) guide
64 changes: 64 additions & 0 deletions lib/rules/template-no-unnecessary-curly-parens.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
function isFixableMustache(node) {
// Check if the mustache's "path" is actually a SubExpression with params or hash
// e.g., {{(helper arg)}} where the path is (helper arg)
return (
node.path?.type === 'GlimmerSubExpression' &&
((node.path.params && node.path.params.length > 0) ||
(node.path.hash?.pairs && node.path.hash.pairs.length > 0))
);
}

/** @type {import('eslint').Rule.RuleModule} */
module.exports = {
meta: {
type: 'suggestion',
docs: {
description: 'disallow unnecessary parentheses enclosing statements in curlies',
category: 'Best Practices',
url: 'https://github.com/ember-cli/eslint-plugin-ember/tree/master/docs/rules/template-no-unnecessary-curly-parens.md',
templateMode: 'both',
},
fixable: 'code',
schema: [],
messages: {
noUnnecessaryCurlyParens: 'Unnecessary parentheses enclosing statement',
},
originallyFrom: {
name: 'ember-template-lint',
rule: 'lib/rules/no-unnecessary-curly-parens.js',
docs: 'docs/rule/no-unnecessary-curly-parens.md',
tests: 'test/unit/rules/no-unnecessary-curly-parens-test.js',
},
},

create(context) {
const sourceCode = context.sourceCode || context.getSourceCode();

return {
GlimmerMustacheStatement(node) {
if (isFixableMustache(node)) {
const subExpr = node.path;
context.report({
node,
messageId: 'noUnnecessaryCurlyParens',
fix(fixer) {
// Replace {{(helper params hash)}} with {{helper params hash}}
const helperName = subExpr.path?.original || '';
let replacement = `{{${helperName}`;

for (const param of subExpr.params || []) {
replacement += ` ${sourceCode.getText(param)}`;
}
for (const pair of subExpr.hash?.pairs || []) {
replacement += ` ${sourceCode.getText(pair)}`;
}
replacement += '}}';

return fixer.replaceText(node, replacement);
},
});
}
},
};
},
};
78 changes: 78 additions & 0 deletions tests/lib/rules/template-no-unnecessary-curly-parens.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
//------------------------------------------------------------------------------
// Requirements
//------------------------------------------------------------------------------

const rule = require('../../../lib/rules/template-no-unnecessary-curly-parens');
const RuleTester = require('eslint').RuleTester;

const validHbs = [
'{{foo}}',
'{{this.foo}}',
'{{(helper)}}',
'{{(this.helper)}}',
'{{concat "a" "b"}}',
'{{concat (capitalize "foo") "-bar"}}',
];

const invalidHbs = [
{
code: '<FooBar @x="{{index}}X{{(someHelper foo)}}" />',
output: '<FooBar @x="{{index}}X{{someHelper foo}}" />',
errors: [{ messageId: 'noUnnecessaryCurlyParens' }],
},
{
code: '<FooBar @x="{{index}}XY{{(someHelper foo)}}" />',
output: '<FooBar @x="{{index}}XY{{someHelper foo}}" />',
errors: [{ messageId: 'noUnnecessaryCurlyParens' }],
},
{
code: '<FooBar @x="{{index}}--{{(someHelper foo)}}" />',
output: '<FooBar @x="{{index}}--{{someHelper foo}}" />',
errors: [{ messageId: 'noUnnecessaryCurlyParens' }],
},
{
code: '{{(concat "a" "b")}}',
output: '{{concat "a" "b"}}',
errors: [{ messageId: 'noUnnecessaryCurlyParens' }],
},
{
code: '{{(helper a="b")}}',
output: '{{helper a="b"}}',
errors: [{ messageId: 'noUnnecessaryCurlyParens' }],
},
];

function wrapTemplate(entry) {
if (typeof entry === 'string') {
return `<template>${entry}</template>`;
}

return {
...entry,
code: `<template>${entry.code}</template>`,
output: entry.output ? `<template>${entry.output}</template>` : entry.output,
};
}

const gjsRuleTester = new RuleTester({
parser: require.resolve('ember-eslint-parser'),
parserOptions: { ecmaVersion: 2022, sourceType: 'module' },
});

gjsRuleTester.run('template-no-unnecessary-curly-parens', rule, {
valid: validHbs.map(wrapTemplate),
invalid: invalidHbs.map(wrapTemplate),
});

const hbsRuleTester = new RuleTester({
parser: require.resolve('ember-eslint-parser/hbs'),
parserOptions: {
ecmaVersion: 2022,
sourceType: 'module',
},
});

hbsRuleTester.run('template-no-unnecessary-curly-parens', rule, {
valid: validHbs,
invalid: invalidHbs,
});
Loading