Glimmer2 inline {{unless}}

packages/ember-glimmer/lib/environment.js

@@ -13,11 +13,15 @@ import {
 } from './utils/references';
 
 import { default as concat } from './helpers/concat';
-import { default as inlineIf } from './helpers/inline-if';
+import {
+  inlineIf,
+  inlineUnless
+} from './helpers/if-unless';
 
 const builtInHelpers = {
   concat,
-  if: inlineIf
+  if: inlineIf,
+  unless: inlineUnless
 };
 
 export default class extends Environment {

packages/ember-glimmer/lib/helpers/if-unless.js

@@ -0,0 +1,82 @@
+/**
+@module ember
+@submodule ember-templates
+*/
+
+import { assert } from 'ember-metal/debug';
+import emberToBool from '../utils/to-bool';
+import { InternalHelperReference } from '../utils/references';
+
+function makeConditionalHelper(toBool) {
+  return {
+    isInternalHelper: true,
+    toReference(args) {
+      switch (args.positional.length) {
+        case 2: return new InternalHelperReference(conditionalWithoutAlternative, args);
+        case 3: return new InternalHelperReference(conditionalWithAlternative, args);
+        default:
+          assert(
+            'The inline form of the `if` and `unless` helpers expect two or ' +
+            'three arguments, e.g. `{{if trialExpired \'Expired\' expiryDate}}`'
+          );
+      }
+    }
+  };
+
+  function conditionalWithoutAlternative({ positional }) {
+    let condition = positional.at(0).value();
+
+    if (toBool(condition)) {
+      return positional.at(1).value();
+    } else {
+      // TODO: this should probably be `undefined`: https://github.com/emberjs/ember.js/pull/12920#discussion_r53213383
+      return '';
+    }
+  }
+
+  function conditionalWithAlternative({ positional }) {
+    let condition = positional.at(0).value();
+
+    if (toBool(condition)) {
+      return positional.at(1).value();
+    } else {
+      return positional.at(2).value();
+    }
+  }
+}
+
+/**
+  The inline `if` helper conditionally renders a single property or string.
+  This helper acts like a ternary operator. If the first property is truthy,
+  the second argument will be displayed, otherwise, the third argument will be
+  displayed
+  ```handlebars
+  {{if useLongGreeting "Hello" "Hi"}} Alex
+  ```
+  You can use the `if` helper inside another helper as a subexpression.
+  ```handlebars
+  {{some-component height=(if isBig "100" "10")}}
+  ```
+  @method if
+  @for Ember.Templates.helpers
+  @public
+*/
+export const inlineIf = makeConditionalHelper(emberToBool);
+
+/**
+  The inline `unless` helper conditionally renders a single property or string.
+  This helper acts like a ternary operator. If the first property is falsy,
+  the second argument will be displayed, otherwise, the third argument will be
+  displayed
+  ```handlebars
+  {{unless useLongGreeting "Hi" "Hello"}} Ben
+  ```
+  You can use the `unless` helper inside another helper as a subexpression.
+  ```handlebars
+  {{some-component height=(unless isBig "10" "100")}}
+  ```
+  @method unless
+  @for Ember.Templates.helpers
+  @public
+*/
+export const inlineUnless = makeConditionalHelper(val => !emberToBool(val));

packages/ember-glimmer/tests/integration/helpers/if-unless-test.js

@@ -1,6 +1,4 @@
 import { moduleFor } from '../../utils/test-case';
-import { set } from 'ember-metal/property_set';
-
 import { TogglingHelperConditionalsTest } from '../../utils/shared-conditional-tests';
 
 moduleFor('Helpers test: inline {{if}}', class extends TogglingHelperConditionalsTest {
@@ -9,84 +7,128 @@ moduleFor('Helpers test: inline {{if}}', class extends TogglingHelperConditional
     return `{{if ${cond} ${truthy} ${falsy}}}`;
   }
 
-  ['@test it can omit the falsy argument']() {
-    this.render(`{{if cond1 'T1'}}{{if cond2 'T2'}}`, { cond1: true, cond2: false });
+  ['@test it raises when there are more than three arguments']() {
+    expectAssertion(() => {
+      this.render(`{{if condition 'a' 'b' 'c'}}`, { condition: true });
+    }, /The inline form of the `if` and `unless` helpers expect two or three arguments/);
+  }
+
+  ['@test it raises when there are less than two arguments']() {
+    expectAssertion(() => {
+      this.render(`{{if condition}}`, { condition: true });
+    }, /The inline form of the `if` and `unless` helpers expect two or three arguments/);
+  }
+
+});
+
+moduleFor('@glimmer Helpers test: nested {{if}} helpers (returning truthy values)', class extends TogglingHelperConditionalsTest {
+
+  templateFor({ cond, truthy, falsy }) {
+    return `{{if (if ${cond} ${cond} false) ${truthy} ${falsy}}}`;
+  }
+
+});
+
+moduleFor('@glimmer Helpers test: nested {{if}} helpers (returning falsy values)', class extends TogglingHelperConditionalsTest {
+
+  templateFor({ cond, truthy, falsy }) {
+    return `{{if (if ${cond} true ${cond}) ${truthy} ${falsy}}}`;
+  }
+
+});
+
+moduleFor('@glimmer Helpers test: {{if}} used with another helper', class extends TogglingHelperConditionalsTest {
+
+  wrapperFor(templates) {
+    return `{{concat ${templates.join(' ')}}}`;
+  }
+
+  templateFor({ cond, truthy, falsy }) {
+    return `(if ${cond} ${truthy} ${falsy})`;
+  }
 
-    this.assertText('T1');
+});
 
-    this.runTask(() => this.rerender());
+moduleFor('@glimmer Helpers test: {{if}} used in attribute position', class extends TogglingHelperConditionalsTest {
 
-    this.assertText('T1');
+  wrapperFor(templates) {
+    return `<div data-foo="${templates.join('')}" />`;
+  }
+
+  templateFor({ cond, truthy, falsy }) {
+    return `{{if ${cond} ${truthy} ${falsy}}}`;
+  }
+
+  textValue() {
+    return this.$('div').attr('data-foo');
+  }
 
-    this.runTask(() => set(this.context, 'cond1', false));
+});
 
-    this.assertText('');
+moduleFor('Helpers test: inline {{if}} and {{unless}} without the inverse argument', class extends TogglingHelperConditionalsTest {
 
-    this.runTask(() => {
-      set(this.context, 'cond1', true);
-      set(this.context, 'cond2', true);
-    });
+  templateFor({ cond, truthy, falsy }) {
+    return `{{if ${cond} ${truthy}}}{{unless ${cond} ${falsy}}}`;
+  }
 
-    this.assertText('T1T2');
+});
 
-    this.runTask(() => {
-      set(this.context, 'cond1', true);
-      set(this.context, 'cond2', false);
-    });
+moduleFor('Helpers test: inline {{unless}}', class extends TogglingHelperConditionalsTest {
 
-    this.assertText('T1');
+  templateFor({ cond, truthy, falsy }) {
+    return `{{unless ${cond} ${falsy} ${truthy}}}`;
   }
 
   ['@test it raises when there are more than three arguments']() {
     expectAssertion(() => {
-      this.render(`{{if condition 'a' 'b' 'c'}}`, { condition: true });
+      this.render(`{{unless condition 'a' 'b' 'c'}}`, { condition: true });
     }, /The inline form of the `if` and `unless` helpers expect two or three arguments/);
   }
 
   ['@test it raises when there are less than two arguments']() {
     expectAssertion(() => {
-      this.render(`{{if condition}}`, { condition: true });
+      this.render(`{{unless condition}}`, { condition: true });
     }, /The inline form of the `if` and `unless` helpers expect two or three arguments/);
   }
 
 });
 
-moduleFor('@glimmer Helpers test: nested {{if}} helpers (returning truthy values)', class extends TogglingHelperConditionalsTest {
+moduleFor('@glimmer Helpers test: nested {{unless}} helpers (returning truthy values)', class extends TogglingHelperConditionalsTest {
 
   templateFor({ cond, truthy, falsy }) {
-    return `{{if (if ${cond} ${cond} false) ${truthy} ${falsy}}}`;
+    return `{{unless (unless ${cond} false ${cond}) ${falsy} ${truthy}}}`;
   }
 
 });
 
-moduleFor('@glimmer Helpers test: nested {{if}} helpers (returning falsy values)', class extends TogglingHelperConditionalsTest {
+moduleFor('@glimmer Helpers test: nested {{unless}} helpers (returning falsy values)', class extends TogglingHelperConditionalsTest {
 
   templateFor({ cond, truthy, falsy }) {
-    return `{{if (if ${cond} true ${cond}) ${truthy} ${falsy}}}`;
+    return `{{unless (unless ${cond} ${cond} true) ${falsy} ${truthy}}}`;
   }
 
 });
 
-moduleFor('@glimmer Helpers test: {{if}} used with another helper', class extends TogglingHelperConditionalsTest {
+moduleFor('@glimmer Helpers test: {{unless}} used with another helper', class extends TogglingHelperConditionalsTest {
 
   wrapperFor(templates) {
     return `{{concat ${templates.join(' ')}}}`;
   }
 
   templateFor({ cond, truthy, falsy }) {
-    return `(if ${cond} ${truthy} ${falsy})`;
+    return `(unless ${cond} ${falsy} ${truthy})`;
   }
 
 });
 
-moduleFor('@glimmer Helpers test: {{if}} used in attribute position', class extends TogglingHelperConditionalsTest {
+moduleFor('@glimmer Helpers test: {{unless}} used in attribute position', class extends TogglingHelperConditionalsTest {
 
   wrapperFor(templates) {
     return `<div data-foo="${templates.join('')}" />`;
   }
 
   templateFor({ cond, truthy, falsy }) {
-    return `{{if ${cond} ${truthy} ${falsy}}}`;
+    return `{{unless ${cond} ${falsy} ${truthy}}}`;
   }
 
   textValue() {