[Feature Request] Limiting template condition complexity

[intellix]

We've got a payment process with conditions to reveal different steps of said process to push the user through it. An example of an *ngIf condition for revealing the Card entry step to the user:

<div *ngIf="step === 'amount' || (step === 'card' && transaction.action !== 'iframe-sent' && transaction.action !== 'html-provided' && transaction.action !== 'redirect-to-url')">
  Enter your card details
</div>

This amount of condition complexity is dangerous because it's breakage can only be detected via E2E or Manual QA. During refactor another developer can completely break payments.

I think one way Codelyzer can help here is allowing us to limit the complexity of an *ngIf condition allowed in the view. The above example would throw that it's too complex and the condition needs to be moved into the Component class, of which can be unit tested:

get canShowCardStep() {
  return this.step === 'amount' || (this.step === 'card' && this.transaction.action !== 'iframe-sent' && this.transaction.action !== 'html-provided' && this.transaction.action !== 'redirect-to-url;
}

<div *ngIf="canShowCardStep">
  Enter your card details
</div>

[mgechev]

Love this feature request. Probably we can apply some version of cyclomatic complexity estimation.

[wKoza]

Love this feature request

I'm not surprised

[mgechev]

Here's a simple estimation of cyclomatic complexity implemented in go https://github.com/fzipp/gocyclo/blob/master/gocyclo.go. It should be easy to port it to the Angular expression/template ASTs.

[wKoza]

If we want to test boolean expression complexity, this implementation seems to be fine: https://github.com/maddingo/checkstyle/blob/master/src/checkstyle/com/puppycrawl/tools/checkstyle/checks/metrics/BooleanExpressionComplexityCheck.java

Its class test:
https://github.com/maddingo/checkstyle/blob/master/src/tests/com/puppycrawl/tools/checkstyle/checks/metrics/BooleanExpressionComplexityCheckTest.java

https://github.com/maddingo/checkstyle/blob/ecdac6ea25dc164ba22659e388a7b6ed07a866db/src/testinputs/com/puppycrawl/tools/checkstyle/metrics/BooleanExpressionComplexityCheckTestInput.java