Merge remote-tracking branch 'origin/master' into upgrade-glimmer

FEATURES.md

@@ -32,16 +32,6 @@ for a detailed explanation.
   Add `{{@foo}}` syntax to access named arguments in component templates per
   [RFC](https://github.com/emberjs/rfcs/pull/276).
 
-* `ember-glimmer-remove-application-template-wrapper`
-
-  Remove the `<div>` wrapper around the application template per
-  [RFC](https://github.com/emberjs/rfcs/pull/280).
-
-* `ember-glimmer-template-only-components`
-
-  Use Glimmer Components semantics for template-only components per
-  [RFC](https://github.com/emberjs/rfcs/pull/278).
-
 * `ember-metal-es5-getters`
 
   Define ES5 getters for computed properties, eliminating the need to access them

features.json

@@ -4,8 +4,6 @@
     "ember-libraries-isregistered": null,
     "ember-improved-instrumentation": null,
     "ember-glimmer-named-arguments": true,
-    "ember-glimmer-remove-application-template-wrapper": null,
-    "ember-glimmer-template-only-components": null,
     "ember-metal-es5-getters": true,
     "ember-routing-router-service": true,
     "ember-engines-mount-params": true,

packages/ember-environment/lib/index.d.ts

@@ -9,5 +9,7 @@ export const environment: {
 }
 
 export const ENV: {
+  _APPLICATION_TEMPLATE_WRAPPER: boolean;
   _ENABLE_RENDER_SUPPORT: boolean;
+  _TEMPLATE_ONLY_GLIMMER_COMPONENTS: boolean;
 };

packages/ember-environment/lib/index.js

@@ -78,9 +78,38 @@ ENV.LOG_VERSION = defaultTrue(ENV.LOG_VERSION);
 */
 ENV.LOG_BINDINGS = defaultFalse(ENV.LOG_BINDINGS);
 
-
 ENV.RAISE_ON_DEPRECATION = defaultFalse(ENV.RAISE_ON_DEPRECATION);
 
+/**
+  Whether to insert a `<div class="ember-view" />` wrapper around the
+  application template. See RFC #280.
+
+  This is not intended to be set directly, as the implementation may change in
+  the future. Use `@ember/optional-features` instead.
+
+  @property _APPLICATION_TEMPLATE_WRAPPER
+  @for EmberENV
+  @type Boolean
+  @default true
+  @private
+*/
+ENV._APPLICATION_TEMPLATE_WRAPPER = defaultTrue(ENV._APPLICATION_TEMPLATE_WRAPPER);
+
+/**
+  Whether to use Glimmer Component semantics (as opposed to the classic "Curly"
+  components semantics) for template-only components. See RFC #278.
+
+  This is not intended to be set directly, as the implementation may change in
+  the future. Use `@ember/optional-features` instead.
+
+  @property _TEMPLATE_ONLY_GLIMMER_COMPONENTS
+  @for EmberENV
+  @type Boolean
+  @default false
+  @private
+*/
+ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS = defaultFalse(ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS);
+
 // check if window exists and actually is the global
 const hasDOM = typeof window !== 'undefined' && window === global &&
                window.document && window.document.createElement &&

packages/ember-glimmer/externs.d.ts

@@ -4,8 +4,6 @@ declare module 'ember/features' {
   export const GLIMMER_CUSTOM_COMPONENT_MANAGER: boolean | null;
   export const EMBER_ENGINES_MOUNT_PARAMS: boolean | null;
   export const EMBER_GLIMMER_DETECT_BACKTRACKING_RERENDER: boolean | null;
-  export const EMBER_GLIMMER_REMOVE_APPLICATION_TEMPLATE_WRAPPER: boolean | null;
-  export const EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS: boolean | null;
   export const MANDATORY_SETTER: boolean | null;
 }
 

packages/ember-glimmer/lib/component-managers/outlet.ts

@@ -14,12 +14,10 @@ import {
 } from '@glimmer/runtime';
 import { Destroyable } from '@glimmer/util';
 import { DEBUG } from 'ember-env-flags';
+import { ENV } from 'ember-environment';
 import { _instrumentStart } from 'ember-metal';
 import { assign, guidFor } from 'ember-utils';
 import { OwnedTemplateMeta } from 'ember-views';
-import {
-  EMBER_GLIMMER_REMOVE_APPLICATION_TEMPLATE_WRAPPER,
-} from 'ember/features';
 import { DynamicScope } from '../renderer';
 import RuntimeResolver from '../resolver';
 import {
@@ -127,49 +125,45 @@ export class OutletComponentDefinition implements ComponentDefinition<OutletDefi
   }
 }
 
-let createRootOutlet: (outletView: OutletView) => OutletComponentDefinition;
-
-if (EMBER_GLIMMER_REMOVE_APPLICATION_TEMPLATE_WRAPPER) {
-  createRootOutlet = (outletView: OutletView) => new OutletComponentDefinition(outletView.state);
-} else {
-  const WRAPPED_CAPABILITIES = assign({}, CAPABILITIES, {
-    dynamicTag: true,
-    elementHook: true,
-  });
+export function createRootOutlet(outletView: OutletView): OutletComponentDefinition {
+  if (ENV._APPLICATION_TEMPLATE_WRAPPER) {
+    const WRAPPED_CAPABILITIES = assign({}, CAPABILITIES, {
+      dynamicTag: true,
+      elementHook: true,
+    });
 
-  const WrappedOutletComponentManager = class extends OutletComponentManager
+    const WrappedOutletComponentManager = class extends OutletComponentManager
     implements WithDynamicTagName<OutletInstanceState> {
 
-    getTagName(_component: OutletInstanceState) {
-      return 'div';
-    }
-
-    getLayout(state: OutletDefinitionState, resolver: RuntimeResolver): Invocation {
-      // The router has already resolved the template
-      const template = state.template;
-      const layout = resolver.getWrappedLayout(template, WRAPPED_CAPABILITIES);
-      return {
-        handle: layout.compile(),
-        symbolTable: layout.symbolTable
-      };
-    }
-
-    getCapabilities(): ComponentCapabilities {
-      return WRAPPED_CAPABILITIES;
-    }
-
-    didCreateElement(component: OutletInstanceState, element: Element, _operations: ElementOperations): void {
-      // to add GUID id and class
-      element.setAttribute('class', 'ember-view');
-      element.setAttribute('id', guidFor(component));
-    }
-  };
+      getTagName(_component: OutletInstanceState) {
+        return 'div';
+      }
+
+      getLayout(state: OutletDefinitionState, resolver: RuntimeResolver): Invocation {
+        // The router has already resolved the template
+        const template = state.template;
+        const layout = resolver.getWrappedLayout(template, WRAPPED_CAPABILITIES);
+        return {
+          handle: layout.compile(),
+          symbolTable: layout.symbolTable
+        };
+      }
+
+      getCapabilities(): ComponentCapabilities {
+        return WRAPPED_CAPABILITIES;
+      }
+
+      didCreateElement(component: OutletInstanceState, element: Element, _operations: ElementOperations): void {
+        // to add GUID id and class
+        element.setAttribute('class', 'ember-view');
+        element.setAttribute('id', guidFor(component));
+      }
+    };
 
-  const WRAPPED_OUTLET_MANAGER = new WrappedOutletComponentManager();
+    const WRAPPED_OUTLET_MANAGER = new WrappedOutletComponentManager();
 
-  createRootOutlet = (outletView: OutletView) => {
     return new OutletComponentDefinition(outletView.state, WRAPPED_OUTLET_MANAGER);
-  };
+  } else {
+    return new OutletComponentDefinition(outletView.state);
+  }
 }
-
-export { createRootOutlet };

packages/ember-glimmer/lib/environment.ts

@@ -30,7 +30,6 @@ import installPlatformSpecificProtocolForURL from './protocol-for-url';
 
 import {
   EMBER_MODULE_UNIFICATION,
-  // EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS,
   // GLIMMER_CUSTOM_COMPONENT_MANAGER,
 } from 'ember/features';
 import { OwnedTemplate } from './template';
@@ -75,7 +74,7 @@ export default class Environment extends GlimmerEnvironment {
     // this._definitionCache = new Cache(2000, ({ name, source, owner }) => {
     //   let { component: componentFactory, layout } = lookupComponent(owner, name, { source });
     //   let customManager: any;
-    //   if (EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS && layout && !componentFactory) {
+    //   if (ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS && layout && !componentFactory) {
     //     return new TemplateOnlyComponentDefinition(name, layout);
     //   } else if (componentFactory || layout) {
     //     if (GLIMMER_CUSTOM_COMPONENT_MANAGER) {

packages/ember-glimmer/lib/renderer.ts

@@ -444,6 +444,9 @@ export abstract class Renderer {
     } finally {
       if (!completedWithoutError) {
         this._lastRevision = CURRENT_TAG.value();
+        if (this._env.inTransaction === true) {
+          this._env.commit();
+        }
       }
       this._isRenderingRoots = false;
     }

packages/ember-glimmer/lib/resolver.ts

@@ -16,14 +16,14 @@ import {
 } from '@glimmer/runtime';
 import { privatize as P } from 'container';
 import { assert } from 'ember-debug';
+import { ENV } from 'ember-environment';
 import { _instrumentStart } from 'ember-metal';
 import { assign, LookupOptions, Owner, setOwner } from 'ember-utils';
 import {
   lookupComponent,
   lookupPartial,
   OwnedTemplateMeta,
 } from 'ember-views';
-import { EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS } from 'ember/features';
 import CompileTimeLookup from './compile-time-lookup';
 import { CurlyComponentDefinition } from './component-managers/curly';
 import { TemplateOnlyComponentDefinition } from './component-managers/template-only';
@@ -297,7 +297,7 @@ export default class RuntimeResolver implements IRuntimeResolver<OwnedTemplateMe
   private _lookupComponentDefinition(name: string, meta: OwnedTemplateMeta): Option<ComponentDefinition> {
     let { layout, component } = lookupComponent(meta.owner, name, makeOptions(meta.moduleName));
 
-    if (layout && !component && EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS) {
+    if (layout && !component && ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) {
       return new TemplateOnlyComponentDefinition(layout);
     }
 

packages/ember-glimmer/lib/setup-registry.ts

@@ -1,6 +1,5 @@
 import { privatize as P } from 'container';
-import { environment } from 'ember-environment';
-import { EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS } from 'ember/features';
+import { ENV, environment } from 'ember-environment';
 import Component from './component';
 import Checkbox from './components/checkbox';
 import LinkToComponent from './components/link-to';
@@ -79,7 +78,7 @@ export function setupEngineRegistry(registry: Registry) {
   registry.register('component:-checkbox', Checkbox);
   registry.register('component:link-to', LinkToComponent);
 
-  if (!EMBER_GLIMMER_TEMPLATE_ONLY_COMPONENTS) {
+  if (!ENV._TEMPLATE_ONLY_GLIMMER_COMPONENTS) {
     registry.register(P`component:-default`, Component);
   }
 }

packages/ember-glimmer/tests/integration/application/rendering-test.js

@@ -1,20 +1,34 @@
+import { ENV } from 'ember-environment';
 import { Controller } from 'ember-runtime';
 import { moduleFor, ApplicationTest } from '../../utils/test-case';
 import { strip } from '../../utils/abstract-test-case';
 import { Route } from 'ember-routing';
 import { Component } from 'ember-glimmer';
 
 moduleFor('Application test: rendering', class extends ApplicationTest {
+  constructor() {
+    super();
+    this._APPLICATION_TEMPLATE_WRAPPER = ENV._APPLICATION_TEMPLATE_WRAPPER;
+  }
+
+  teardown() {
+    super.teardown();
+    ENV._APPLICATION_TEMPLATE_WRAPPER = this._APPLICATION_TEMPLATE_WRAPPER;
+  }
+
+  ['@test it can render the application template with a wrapper']() {
+    ENV._APPLICATION_TEMPLATE_WRAPPER = true;
 
-  ['@feature(!ember-glimmer-remove-application-template-wrapper) it can render the application template']() {
     this.addTemplate('application', 'Hello world!');
 
     return this.visit('/').then(() => {
       this.assertComponentElement(this.element, { content: 'Hello world!' });
     });
   }
 
-  ['@feature(ember-glimmer-remove-application-template-wrapper) it can render the application template']() {
+  ['@test it can render the application template without a wrapper']() {
+    ENV._APPLICATION_TEMPLATE_WRAPPER = false;
+
     this.addTemplate('application', 'Hello world!');
 
     return this.visit('/').then(() => {

packages/ember-glimmer/tests/integration/components/error-handling-test.js

@@ -0,0 +1,72 @@
+import { set } from 'ember-metal';
+import { Component } from '../../utils/helpers';
+import { moduleFor, RenderingTest } from '../../utils/test-case';
+
+moduleFor('Errors thrown during render', class extends RenderingTest {
+  ['@test it can recover resets the transaction when an error is thrown during initial render'](assert) {
+    let shouldThrow = true;
+    let FooBarComponent = Component.extend({
+      init() {
+        this._super(...arguments);
+        if (shouldThrow) {
+          throw new Error('silly mistake in init!');
+        }
+      }
+    });
+
+    this.registerComponent('foo-bar', { ComponentClass: FooBarComponent, template: 'hello' });
+
+    assert.throws(() => {
+      this.render('{{#if switch}}{{#foo-bar}}{{foo-bar}}{{/foo-bar}}{{/if}}', { switch: true });
+    }, /silly mistake in init/);
+
+    assert.equal(this.env.inTransaction, false, 'should not be in a transaction even though an error was thrown');
+
+    this.assertText('');
+
+    this.runTask(() => set(this.context, 'switch', false));
+
+    shouldThrow = false;
+
+    this.runTask(() => set(this.context, 'switch', true));
+
+    this.assertText('hello');
+  }
+
+  ['@test it can recover resets the transaction when an error is thrown during rerender'](assert) {
+    let shouldThrow = false;
+    let FooBarComponent = Component.extend({
+      init() {
+        this._super(...arguments);
+        if (shouldThrow) {
+          throw new Error('silly mistake in init!');
+        }
+      }
+    });
+
+    this.registerComponent('foo-bar', { ComponentClass: FooBarComponent, template: 'hello' });
+
+    this.render('{{#if switch}}{{#foo-bar}}{{foo-bar}}{{/foo-bar}}{{/if}}', { switch: true });
+
+    this.assertText('hello');
+
+    this.runTask(() => set(this.context, 'switch', false));
+
+    shouldThrow = true;
+
+    assert.throws(() => {
+      this.runTask(() => set(this.context, 'switch', true));
+    }, /silly mistake in init/);
+
+    assert.equal(this.env.inTransaction, false, 'should not be in a transaction even though an error was thrown');
+
+    this.assertText('');
+
+    this.runTask(() => set(this.context, 'switch', false));
+    shouldThrow = false;
+
+    this.runTask(() => set(this.context, 'switch', true));
+
+    this.assertText('hello');
+  }
+});