Update Glimmer

package.json

@@ -35,12 +35,12 @@
     "link:glimmer": "node bin/yarn-link-glimmer.js"
   },
   "dependencies": {
-    "@glimmer/compiler": "^0.21.1",
-    "@glimmer/di": "^0.1.6",
-    "@glimmer/node": "^0.21.1",
-    "@glimmer/reference": "^0.21.0",
-    "@glimmer/runtime": "^0.21.1",
-    "@glimmer/util": "^0.21.0",
+    "@glimmer/compiler": "^0.22.0",
+    "@glimmer/di": "^0.1.8",
+    "@glimmer/node": "^0.22.0",
+    "@glimmer/reference": "^0.22.0",
+    "@glimmer/runtime": "^0.22.0",
+    "@glimmer/util": "^0.22.0",
     "broccoli-funnel": "^1.0.6",
     "broccoli-merge-trees": "^1.1.4",
     "ember-cli-get-component-path-option": "^1.0.0",
@@ -58,7 +58,7 @@
     "simple-html-tokenizer": "^0.3.0"
   },
   "devDependencies": {
-    "@glimmer/test-helpers": "^0.21.1",
+    "@glimmer/test-helpers": "^0.22.0",
     "aws-sdk": "~2.2.43",
     "babel-plugin-feature-flags": "^0.2.3",
     "babel-plugin-filter-imports": "~0.2.0",

packages/ember-glimmer/lib/environment.js

@@ -180,16 +180,7 @@ export default class Environment extends GlimmerEnvironment {
     }
   }
 
-  hasHelper(nameParts, symbolTable) {
-    assert('The first argument passed into `hasHelper` should be an array', Array.isArray(nameParts));
-
-    // helpers are not allowed to include a dot in their invocation
-    if (nameParts.length > 1) {
-      return false;
-    }
-
-    let name = nameParts[0];
-
+  hasHelper(name, symbolTable) {
     if (this.builtInHelpers[name]) {
       return true;
     }
@@ -202,10 +193,7 @@ export default class Environment extends GlimmerEnvironment {
       owner.hasRegistration(`helper:${name}`);
   }
 
-  lookupHelper(nameParts, symbolTable) {
-    assert('The first argument passed into `lookupHelper` should be an array', Array.isArray(nameParts));
-
-    let name = nameParts[0];
+  lookupHelper(name, symbolTable) {
     let helper = this.builtInHelpers[name];
 
     if (helper) {
@@ -228,7 +216,7 @@ export default class Environment extends GlimmerEnvironment {
         }
         return (vm, args) => ClassBasedHelperReference.create(helperFactory, vm, args);
       } else {
-        throw new Error(`${nameParts} is not a helper`);
+        throw new Error(`${name} is not a helper`);
       }
     } else {
       let helperFactory = owner.lookup(`helper:${name}`, options) || owner.lookup(`helper:${name}`);
@@ -239,31 +227,22 @@ export default class Environment extends GlimmerEnvironment {
       } else if (helperFactory.isHelperFactory) {
         return (vm, args) => ClassBasedHelperReference.create(helperFactory, vm, args);
       } else {
-        throw new Error(`${nameParts} is not a helper`);
+        throw new Error(`${name} is not a helper`);
       }
     }
   }
 
-  hasModifier(nameParts) {
-    assert('The first argument passed into `hasModifier` should be an array', Array.isArray(nameParts));
-
-    // modifiers are not allowed to include a dot in their invocation
-    if (nameParts.length > 1) {
-      return false;
-    }
-
-    return !!this.builtInModifiers[nameParts[0]];
+  hasModifier(name) {
+    return !!this.builtInModifiers[name];
   }
 
-  lookupModifier(nameParts) {
-    assert('The first argument passed into `lookupModifier` should be an array', Array.isArray(nameParts));
-
-    let modifier = this.builtInModifiers[nameParts[0]];
+  lookupModifier(name) {
+    let modifier = this.builtInModifiers[name];
 
     if (modifier) {
       return modifier;
     } else {
-      throw new Error(`${nameParts} is not a modifier`);
+      throw new Error(`${name} is not a modifier`);
     }
   }
 

packages/ember-glimmer/lib/renderer.js

@@ -60,7 +60,14 @@ class RootState {
     };
 
     this.render = () => {
-      let result = this.result = template.render(self, parentElement, dynamicScope);
+      let iterator = template.render(self, parentElement, dynamicScope);
+      let iteratorResult;
+
+      do {
+        iteratorResult = iterator.next();
+      } while (!iteratorResult.done);
+
+      let result = this.result = iteratorResult.value;
 
       // override .render function after initial render
       this.render = () => {

packages/ember-glimmer/lib/utils/bindings.js

@@ -4,6 +4,9 @@ import {
   map,
   referenceFromParts
 } from '@glimmer/reference';
+import {
+  Ops
+} from '@glimmer/wire-format';
 import { get, assert } from 'ember-metal';
 import { String as StringUtils } from 'ember-runtime';
 import { ROOT_REF } from '../component';
@@ -40,11 +43,11 @@ export function wrapComponentClassAttribute(hash) {
   if (index !== -1) {
     let [ type ] = values[index];
 
-    if (type === 'get') {
+    if (type === Ops.Get) {
       let getExp = values[index];
       let path = getExp[1];
       let propName = path[path.length - 1];
-      hash[1][index] = ['helper', ['-class'], [getExp, propName]];
+      hash[1][index] = [Ops.Helper, ['-class'], [getExp, propName]];
     }
   }
 

packages/ember-template-compiler/lib/plugins/index.js

@@ -14,8 +14,10 @@ import TransformInputTypeSyntax from './transform-input-type-syntax';
 import TransformAttrsIntoArgs from './transform-attrs-into-args';
 import TransformEachInIntoEach from './transform-each-in-into-each';
 import TransformHasBlockSyntax from './transform-has-block-syntax';
+import TransformDotComponentInvocation from './transform-dot-component-invocation';
 
 export default Object.freeze([
+  TransformDotComponentInvocation,
   TransformOldBindingSyntax,
   TransformItemClass,
   TransformAngleBracketComponents,

packages/ember-template-compiler/lib/plugins/transform-dot-component-invocation.js

@@ -0,0 +1,101 @@
+
+/**
+  Transforms dot invocation of closure components to be wrapped
+  with the component helper. This allows for a more static invocation
+  of the component.
+
+  ```handlebars
+ {{#my-component as |comps|}}
+  {{comp.dropdown isOpen=false}}
+ {{/my-component}}
+  ```
+
+  with
+
+  ```handlebars
+  {{#my-component as |comps|}}
+    {{component comp.dropdown isOpen=false}}
+  {{/my-component}}
+  ```
+  and
+
+  ```handlebars
+ {{#my-component as |comps|}}
+  {{comp.dropdown isOpen}}
+ {{/my-component}}
+  ```
+
+  with
+
+  ```handlebars
+  {{#my-component as |comps|}}
+    {{component comp.dropdown isOpen}}
+  {{/my-component}}
+  ```
+
+  and
+
+  ```handlebars
+  {{#my-component as |comps|}}
+    {{#comp.dropdown}}Open{{/comp.dropdown}}
+  {{/my-component}}
+  ```
+
+  with
+
+  ```handlebars
+  {{#my-component as |comps|}}
+    {{#component comp.dropdown}}Open{{/component}}
+  {{/my-component}}
+  ```
+
+  @private
+  @class TransFormDotComponentInvocation
+*/
+export default function TransFormDotComponentInvocation() {
+  // set later within Glimmer2 to the syntax package
+  this.syntax = null;
+}
+
+TransFormDotComponentInvocation.prototype = {
+  _isMulipartPath(path)  {
+    return path.parts.length > 1;
+  },
+
+  _isInlineInvocation(path, params, hash) {
+    if (this._isMulipartPath(path)) {
+      if (params.length > 0 || hash.pairs.length > 0) {
+        return true;
+      }
+    }
+
+    return false;
+  },
+
+  _wrapInComponent(node, builder) {
+    let component = node.path;
+    let componentHelper = builder.path('component');
+    node.path = componentHelper;
+    node.params.unshift(component);
+  },
+
+  transform(ast) {
+    let { traverse, builders: b } = this.syntax;
+
+    traverse(ast, {
+      MustacheStatement: (node) => {
+        if (this._isInlineInvocation(node.path, node.params, node.hash)) {
+          this._wrapInComponent(node, b);
+        }
+      },
+      BlockStatement: (node) => {
+        if (this._isMulipartPath(node.path)) {
+          this._wrapInComponent(node, b)
+        }
+      }
+    });
+
+    return ast;
+  }
+};
+

packages/ember-template-compiler/tests/plugins/transform-dot-component-invocation-test.js

@@ -0,0 +1,23 @@
+import { compile } from '../../index';
+
+QUnit.module('ember-template-compiler: transforms dot component invocation');
+
+QUnit.test('Does not throw a compiler error for path components', function(assert) {
+  assert.expect(1);
+
+  [
+    '{{this.modal open}}',
+    '{{this.modal isOpen=true}}',
+    '{{#this.modal}}Woot{{/this.modal}}',
+    '{{c.modal open}}',
+    '{{c.modal isOpen=true}}',
+    '{{#c.modal}}Woot{{/c.modal}}',
+    '{{#my-component as |c|}}{{c.a name="Chad"}}{{/my-component}}',
+    '{{#my-component as |c|}}{{c.a "Chad"}}{{/my-component}}',
+    '{{#my-component as |c|}}{{#c.a}}{{/c.a}}{{/my-component}}'
+  ].forEach((layout, i) => {
+    compile(layout, { moduleName: `example-${i}` });
+  });
+
+  assert.ok(true);
+});