dist/ember.js in ember-source-2.11.0.beta.4 vs dist/ember.js in ember-source-2.11.0.beta.8

- old
+ new

@@ -1,14 +1,14 @@ ;(function() { /*! * @overview Ember - JavaScript Application Framework - * @copyright Copyright 2011-2016 Tilde Inc. and contributors + * @copyright Copyright 2011-2017 Tilde Inc. and contributors * Portions Copyright 2006-2011 Strobe Inc. * Portions Copyright 2008-2011 Apple Inc. All rights reserved. * @license Licensed under MIT license * See https://raw.github.com/emberjs/ember.js/master/LICENSE - * @version 2.11.0-beta.4 + * @version 2.11.0-beta.8 */ var enifed, requireModule, Ember; (function() { @@ -6838,20 +6838,19 @@ surrounding context or outer controller; all contextual information must be passed in. The easiest way to create an `Ember.Component` is via a template. If you name a template - `components/my-foo`, you will be able to use + `app/components/my-foo.hbs`, you will be able to use `{{my-foo}}` in other templates, which will make an instance of the isolated component. - ```handlebars - {{app-profile person=currentUser}} + ```app/components/my-foo.hbs + {{person-profile person=currentUser}} ``` - ```handlebars - <!-- app-profile template --> + ```app/components/person-profile.hbs <h1>{{person.title}}</h1> <img src={{person.avatar}}> <p class='signature'>{{person.signature}}</p> ``` @@ -6859,64 +6858,469 @@ include the **contents** of any block attached to the component. The block will be executed in the context of the surrounding context or outer controller: ```handlebars - {{#app-profile person=currentUser}} + {{#person-profile person=currentUser}} <p>Admin mode</p> {{! Executed in the controller's context. }} - {{/app-profile}} + {{/person-profile}} ``` - ```handlebars - <!-- app-profile template --> + ```app/components/person-profile.hbs <h1>{{person.title}}</h1> {{! Executed in the component's context. }} {{yield}} {{! block contents }} ``` If you want to customize the component, in order to handle events or actions, you implement a subclass of `Ember.Component` named after the name of the - component. Note that `Component` needs to be appended to the name of - your subclass like `AppProfileComponent`. + component. For example, you could implement the action - `hello` for the `app-profile` component: + `hello` for the `person-profile` component: - ```javascript - App.AppProfileComponent = Ember.Component.extend({ + ```app/components/person-profile.js + import Ember from 'ember'; + + export default Ember.Component.extend({ actions: { - hello: function(name) { + hello(name) { console.log("Hello", name); } } }); ``` And then use it in the component's template: - ```handlebars - <!-- app-profile template --> + ```app/templates/components/person-profile.hbs <h1>{{person.title}}</h1> {{yield}} <!-- block contents --> <button {{action 'hello' person.name}}> Say Hello to {{person.name}} </button> ``` + Components must have a `-` in their name to avoid conflicts with built-in controls that wrap HTML elements. This is consistent with the same requirement in web components. + + ## HTML Tag + + The default HTML tag name used for a component's DOM representation is `div`. + This can be customized by setting the `tagName` property. + The following component class: + + ```app/components/emphasized-paragraph.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'em' + }); + ``` + + Would result in instances with the following HTML: + + ```html + <em id="ember1" class="ember-view"></em> + ``` + + + ## HTML `class` Attribute + + The HTML `class` attribute of a component's tag can be set by providing a + `classNames` property that is set to an array of strings: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNames: ['my-class', 'my-other-class'] + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view my-class my-other-class"></div> + ``` + + `class` attribute values can also be set by providing a `classNameBindings` + property set to an array of properties names for the component. The return value + of these properties will be added as part of the value for the components's `class` + attribute. These properties can be computed properties: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['propertyA', 'propertyB'], + propertyA: 'from-a', + propertyB: Ember.computed(function() { + if (someLogic) { return 'from-b'; } + }) + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view from-a from-b"></div> + ``` + + If the value of a class name binding returns a boolean the property name + itself will be used as the class name if the property is true. + The class name will not be added if the value is `false` or `undefined`. + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['hovered'], + hovered: true + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view hovered"></div> + ``` + + When using boolean class name bindings you can supply a string value other + than the property name for use as the `class` HTML attribute by appending the + preferred value after a ":" character when defining the binding: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['awesome:so-very-cool'], + awesome: true + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view so-very-cool"></div> + ``` + + Boolean value class name bindings whose property names are in a + camelCase-style format will be converted to a dasherized format: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['isUrgent'], + isUrgent: true + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view is-urgent"></div> + ``` + + Class name bindings can also refer to object values that are found by + traversing a path relative to the component itself: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['messages.empty'], + messages: Ember.Object.create({ + empty: true + }) + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view empty"></div> + ``` + + If you want to add a class name for a property which evaluates to true and + and a different class name if it evaluates to false, you can pass a binding + like this: + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + classNameBindings: ['isEnabled:enabled:disabled'], + isEnabled: true + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view enabled"></div> + ``` + + When isEnabled is `false`, the resulting HTML representation looks like + this: + + ```html + <div id="ember1" class="ember-view disabled"></div> + ``` + + This syntax offers the convenience to add a class if a property is `false`: + + ```app/components/my-widget.js + import Ember from 'ember'; + + // Applies no class when isEnabled is true and class 'disabled' when isEnabled is false + export default Ember.Component.extend({ + classNameBindings: ['isEnabled::disabled'], + isEnabled: true + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view"></div> + ``` + + When the `isEnabled` property on the component is set to `false`, it will result + in component instances with an HTML representation of: + + ```html + <div id="ember1" class="ember-view disabled"></div> + ``` + + Updates to the value of a class name binding will result in automatic + update of the HTML `class` attribute in the component's rendered HTML + representation. If the value becomes `false` or `undefined` the class name + will be removed. + Both `classNames` and `classNameBindings` are concatenated properties. See + [Ember.Object](/api/classes/Ember.Object.html) documentation for more + information about concatenated properties. + + + ## HTML Attributes + + The HTML attribute section of a component's tag can be set by providing an + `attributeBindings` property set to an array of property names on the component. + The return value of these properties will be used as the value of the component's + HTML associated attribute: + + ```app/components/my-anchor.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'a', + attributeBindings: ['href'], + href: 'http://google.com' + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <a id="ember1" class="ember-view" href="http://google.com"></a> + ``` + + One property can be mapped on to another by placing a ":" between + the source property and the destination property: + + ```app/components/my-anchor.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'a', + attributeBindings: ['url:href'], + url: 'http://google.com' + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <a id="ember1" class="ember-view" href="http://google.com"></a> + ``` + + Namespaced attributes (e.g. `xlink:href`) are supported, but have to be + mapped, since `:` is not a valid character for properties in Javascript: + + ```app/components/my-use.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'use', + attributeBindings: ['xlinkHref:xlink:href'], + xlinkHref: '#triangle' + }); + ``` + + Will result in component instances with an HTML representation of: + + ```html + <use xlink:href="#triangle"></use> + ``` + + If the return value of an `attributeBindings` monitored property is a boolean + the attribute will be present or absent depending on the value: + + ```app/components/my-text-input.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'input', + attributeBindings: ['disabled'], + disabled: false + }); + ``` + + Will result in a component instance with an HTML representation of: + + ```html + <input id="ember1" class="ember-view" /> + ``` + + `attributeBindings` can refer to computed properties: + + ```app/components/my-text-input.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'input', + attributeBindings: ['disabled'], + disabled: Ember.computed(function() { + if (someLogic) { + return true; + } else { + return false; + } + }) + }); + ``` + + To prevent setting an attribute altogether, use `null` or `undefined` as the + return value of the `attributeBindings` monitored property: + + ```app/components/my-text-input.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + tagName: 'form', + attributeBindings: ['novalidate'], + novalidate: null + }); + ``` + + Updates to the property of an attribute binding will result in automatic + update of the HTML attribute in the component's rendered HTML representation. + `attributeBindings` is a concatenated property. See [Ember.Object](/api/classes/Ember.Object.html) + documentation for more information about concatenated properties. + + + ## Layouts + + See [Ember.Templates.helpers.yield](/api/classes/Ember.Templates.helpers.html#method_yield) + for more information. + + + ## Responding to Browser Events + + Components can respond to user-initiated events in one of three ways: method + implementation, through an event manager, and through `{{action}}` helper use + in their template or layout. + + + ### Method Implementation + + Components can respond to user-initiated events by implementing a method that + matches the event name. A `jQuery.Event` object will be passed as the + argument to this method. + + ```app/components/my-widget.js + import Ember from 'ember'; + + export default Ember.Component.extend({ + click(event) { + // will be called when an instance's + // rendered element is clicked + } + }); + ``` + + + ### `{{action}}` Helper + + See [Ember.Templates.helpers.action](/api/classes/Ember.Templates.helpers.html#method_action). + + + ### Event Names + + All of the event handling approaches described above respond to the same set + of events. The names of the built-in events are listed below. (The hash of + built-in events exists in `Ember.EventDispatcher`.) Additional, custom events + can be registered by using `Ember.Application.customEvents`. + + Touch events: + + * `touchStart` + * `touchMove` + * `touchEnd` + * `touchCancel` + + Keyboard events: + + * `keyDown` + * `keyUp` + * `keyPress` + + Mouse events: + + * `mouseDown` + * `mouseUp` + * `contextMenu` + * `click` + * `doubleClick` + * `mouseMove` + * `focusIn` + * `focusOut` + * `mouseEnter` + * `mouseLeave` + + Form events: + + * `submit` + * `change` + * `focusIn` + * `focusOut` + * `input` + + HTML5 drag and drop events: + + * `dragStart` + * `drag` + * `dragEnter` + * `dragLeave` + * `dragOver` + * `dragEnd` + * `drop` + @class Component @namespace Ember @extends Ember.CoreView @uses Ember.TargetActionSupport @uses Ember.ClassNamesSupport @uses Ember.ActionSupport @uses Ember.ViewMixin + @uses Ember.ViewStateSupport @public */ var Component = _emberViews.CoreView.extend(_emberViews.ChildViewsSupport, _emberViews.ViewStateSupport, _emberViews.ClassNamesSupport, _emberRuntime.TargetActionSupport, _emberViews.ActionSupport, _emberViews.ViewMixin, (_CoreView$extend = { isComponent: true, @@ -6953,10 +7357,12 @@ if (typeof _this[methodName] === 'function') { return true; // indicate that the assertion should be triggered } } })()); + + _emberMetal.assert('You cannot use a computed property for the component\'s `tagName` (' + this + ').', !(this.tagName && this.tagName.isDescriptor)); }, rerender: function () { this[DIRTY_TAG].dirty(); this._super(); @@ -7004,37 +7410,37 @@ Enables components to take a list of parameters as arguments. For example, a component that takes two parameters with the names `name` and `age`: ```javascript let MyComponent = Ember.Component.extend; - MyComponent.reopenClass({ - positionalParams: ['name', 'age'] + MyComponent.reopenClass({ + positionalParams: ['name', 'age'] }); ``` It can then be invoked like this: ```hbs {{my-component "John" 38}} ``` The parameters can be referred to just like named parameters: ```hbs - Name: {{attrs.name}}, Age: {{attrs.age}}. + Name: {{name}}, Age: {{age}}. ``` Using a string instead of an array allows for an arbitrary number of parameters: ```javascript let MyComponent = Ember.Component.extend; - MyComponent.reopenClass({ - positionalParams: 'names' + MyComponent.reopenClass({ + positionalParams: 'names' }); ``` It can then be invoked like this: ```hbs {{my-component "John" "Michael" "Scott"}} ``` The parameters can then be referred to by enumerating over the list: ```hbs - {{#each attrs.names as |name|}}{{name}}{{/each}} + {{#each names as |name|}}{{name}}{{/each}} ``` @static @public @property positionalParams @since 1.13.0 @@ -7139,10 +7545,71 @@ @public @since 1.13.0 */ /** + A component may contain a layout. A layout is a regular template but + supersedes the `template` property during rendering. It is the + responsibility of the layout template to retrieve the `template` + property from the component (or alternatively, call `Handlebars.helpers.yield`, + `{{yield}}`) to render it in the correct location. + This is useful for a component that has a shared wrapper, but which delegates + the rendering of the contents of the wrapper to the `template` property + on a subclass. + @property layout + @type Function + @public + */ + + /** + The name of the layout to lookup if no layout is provided. + By default `Ember.Component` will lookup a template with this name in + `Ember.TEMPLATES` (a shared global object). + @property layoutName + @type String + @default null + @private + */ + + /** + Returns a jQuery object for this component's element. If you pass in a selector + string, this method will return a jQuery object, using the current element + as its buffer. + For example, calling `component.$('li')` will return a jQuery object containing + all of the `li` elements inside the DOM element of this component. + @method $ + @param {String} [selector] a jQuery-compatible selector string + @return {jQuery} the jQuery object for the DOM node + @public + */ + + /** + The HTML `id` of the component's element in the DOM. You can provide this + value yourself but it must be unique (just as in HTML): + ```handlebars + {{my-component elementId="a-really-cool-id"}} + ``` + If not manually set a default value will be provided by the framework. + Once rendered an element's `elementId` is considered immutable and you + should never change it. If you need to compute a dynamic value for the + `elementId`, you should do this when the component or element is being + instantiated: + ```javascript + export default Ember.Component.extend({ + init() { + this._super(...arguments); + var index = this.get('index'); + this.set('elementId', `component-id${index}`); + } + }); + ``` + @property elementId + @type String + @public + */ + + /** If `false`, the view will appear hidden in DOM. @property isVisible @type Boolean @default null @public @@ -7561,11 +8028,11 @@ @class LinkComponent @namespace Ember @extends Ember.Component @see {Ember.Templates.helpers.link-to} - @private + @public **/ var LinkComponent = _emberGlimmerComponent.default.extend({ layout: _emberGlimmerTemplatesLinkTo.default, tagName: 'a', @@ -8421,11 +8888,11 @@ exports.DOMChanges = _glimmerRuntime.DOMChanges; exports.DOMTreeConstruction = _glimmerRuntime.DOMTreeConstruction; exports.NodeDOMTreeConstruction = _glimmerNode.NodeDOMTreeConstruction; }); -enifed('ember-glimmer/environment', ['exports', 'ember-utils', 'ember-metal', 'ember-views', 'glimmer-runtime', 'ember-glimmer/syntax/curly-component', 'ember-glimmer/syntax', 'ember-glimmer/syntax/dynamic-component', 'ember-glimmer/utils/iterable', 'ember-glimmer/utils/references', 'ember-glimmer/helpers/if-unless', 'ember-glimmer/utils/bindings', 'ember-glimmer/helpers/action', 'ember-glimmer/helpers/component', 'ember-glimmer/helpers/concat', 'ember-glimmer/helpers/debugger', 'ember-glimmer/helpers/get', 'ember-glimmer/helpers/hash', 'ember-glimmer/helpers/loc', 'ember-glimmer/helpers/log', 'ember-glimmer/helpers/mut', 'ember-glimmer/helpers/readonly', 'ember-glimmer/helpers/unbound', 'ember-glimmer/helpers/-class', 'ember-glimmer/helpers/-input-type', 'ember-glimmer/helpers/query-param', 'ember-glimmer/helpers/each-in', 'ember-glimmer/helpers/-normalize-class', 'ember-glimmer/helpers/-html-safe', 'ember-glimmer/protocol-for-url', 'ember-glimmer/modifiers/action'], function (exports, _emberUtils, _emberMetal, _emberViews, _glimmerRuntime, _emberGlimmerSyntaxCurlyComponent, _emberGlimmerSyntax, _emberGlimmerSyntaxDynamicComponent, _emberGlimmerUtilsIterable, _emberGlimmerUtilsReferences, _emberGlimmerHelpersIfUnless, _emberGlimmerUtilsBindings, _emberGlimmerHelpersAction, _emberGlimmerHelpersComponent, _emberGlimmerHelpersConcat, _emberGlimmerHelpersDebugger, _emberGlimmerHelpersGet, _emberGlimmerHelpersHash, _emberGlimmerHelpersLoc, _emberGlimmerHelpersLog, _emberGlimmerHelpersMut, _emberGlimmerHelpersReadonly, _emberGlimmerHelpersUnbound, _emberGlimmerHelpersClass, _emberGlimmerHelpersInputType, _emberGlimmerHelpersQueryParam, _emberGlimmerHelpersEachIn, _emberGlimmerHelpersNormalizeClass, _emberGlimmerHelpersHtmlSafe, _emberGlimmerProtocolForUrl, _emberGlimmerModifiersAction) { +enifed('ember-glimmer/environment', ['exports', 'ember-utils', 'ember-metal', 'ember-views', 'glimmer-runtime', 'ember-glimmer/syntax/curly-component', 'ember-glimmer/syntax', 'ember-glimmer/syntax/dynamic-component', 'ember-glimmer/utils/iterable', 'ember-glimmer/utils/references', 'ember-glimmer/utils/debug-stack', 'ember-glimmer/helpers/if-unless', 'ember-glimmer/utils/bindings', 'ember-glimmer/helpers/action', 'ember-glimmer/helpers/component', 'ember-glimmer/helpers/concat', 'ember-glimmer/helpers/debugger', 'ember-glimmer/helpers/get', 'ember-glimmer/helpers/hash', 'ember-glimmer/helpers/loc', 'ember-glimmer/helpers/log', 'ember-glimmer/helpers/mut', 'ember-glimmer/helpers/readonly', 'ember-glimmer/helpers/unbound', 'ember-glimmer/helpers/-class', 'ember-glimmer/helpers/-input-type', 'ember-glimmer/helpers/query-param', 'ember-glimmer/helpers/each-in', 'ember-glimmer/helpers/-normalize-class', 'ember-glimmer/helpers/-html-safe', 'ember-glimmer/protocol-for-url', 'ember-glimmer/modifiers/action'], function (exports, _emberUtils, _emberMetal, _emberViews, _glimmerRuntime, _emberGlimmerSyntaxCurlyComponent, _emberGlimmerSyntax, _emberGlimmerSyntaxDynamicComponent, _emberGlimmerUtilsIterable, _emberGlimmerUtilsReferences, _emberGlimmerUtilsDebugStack, _emberGlimmerHelpersIfUnless, _emberGlimmerUtilsBindings, _emberGlimmerHelpersAction, _emberGlimmerHelpersComponent, _emberGlimmerHelpersConcat, _emberGlimmerHelpersDebugger, _emberGlimmerHelpersGet, _emberGlimmerHelpersHash, _emberGlimmerHelpersLoc, _emberGlimmerHelpersLog, _emberGlimmerHelpersMut, _emberGlimmerHelpersReadonly, _emberGlimmerHelpersUnbound, _emberGlimmerHelpersClass, _emberGlimmerHelpersInputType, _emberGlimmerHelpersQueryParam, _emberGlimmerHelpersEachIn, _emberGlimmerHelpersNormalizeClass, _emberGlimmerHelpersHtmlSafe, _emberGlimmerProtocolForUrl, _emberGlimmerModifiersAction) { 'use strict'; var builtInComponents = { textarea: '-text-area' }; @@ -8531,10 +8998,14 @@ '-input-type': _emberGlimmerHelpersInputType.default, '-normalize-class': _emberGlimmerHelpersNormalizeClass.default, '-html-safe': _emberGlimmerHelpersHtmlSafe.default, '-get-dynamic-var': _glimmerRuntime.getDynamicVar }; + + _emberMetal.runInDebug(function () { + return _this.debugStack = new _emberGlimmerUtilsDebugStack.default(); + }); } // Hello future traveler, welcome to the world of syntax refinement. // The method below is called by Glimmer's runtime compiler to allow // us to take generic statement syntax and refine it to more meaniful @@ -11889,13 +12360,34 @@ }; return _class2; })()); }); -enifed('ember-glimmer/syntax/curly-component', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-glimmer/utils/bindings', 'ember-glimmer/component', 'ember-metal', 'ember-views', 'ember-glimmer/utils/process-args', 'container'], function (exports, _emberUtils, _glimmerRuntime, _emberGlimmerUtilsBindings, _emberGlimmerComponent, _emberMetal, _emberViews, _emberGlimmerUtilsProcessArgs, _container) { +enifed('ember-glimmer/syntax/abstract-manager', ['exports', 'ember-metal'], function (exports, _emberMetal) { 'use strict'; + var AbstractManager = function AbstractManager() { + babelHelpers.classCallCheck(this, AbstractManager); + }; + + _emberMetal.runInDebug(function () { + AbstractManager.prototype._pushToDebugStack = function (name, environment) { + this.debugStack = environment.debugStack; + this.debugStack.push(name); + }; + + AbstractManager.prototype._pushEngineToDebugStack = function (name, environment) { + this.debugStack = environment.debugStack; + this.debugStack.pushEngine(name); + }; + }); + + exports.default = AbstractManager; +}); +enifed('ember-glimmer/syntax/curly-component', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-glimmer/utils/bindings', 'ember-glimmer/component', 'ember-metal', 'ember-views', 'ember-glimmer/utils/process-args', 'container', 'ember-glimmer/syntax/abstract-manager'], function (exports, _emberUtils, _glimmerRuntime, _emberGlimmerUtilsBindings, _emberGlimmerComponent, _emberMetal, _emberViews, _emberGlimmerUtilsProcessArgs, _container, _emberGlimmerSyntaxAbstractManager) { + 'use strict'; + exports.validatePositionalParameters = validatePositionalParameters; var _templateObject = babelHelpers.taggedTemplateLiteralLoose(['template:components/-default'], ['template:components/-default']); var DEFAULT_LAYOUT = _container.privatize(_templateObject); @@ -12059,22 +12551,32 @@ function rerenderInstrumentDetails(component) { return component.instrumentDetails({ initialRender: false }); } - var CurlyComponentManager = (function () { + var CurlyComponentManager = (function (_AbstractManager) { +babelHelpers.inherits(CurlyComponentManager, _AbstractManager); + function CurlyComponentManager() { babelHelpers.classCallCheck(this, CurlyComponentManager); + + _AbstractManager.apply(this, arguments); } CurlyComponentManager.prototype.prepareArgs = function prepareArgs(definition, args) { validatePositionalParameters(args.named, args.positional.values, definition.ComponentClass.positionalParams); return _emberGlimmerUtilsProcessArgs.gatherArgs(args, definition); }; CurlyComponentManager.prototype.create = function create(environment, definition, args, dynamicScope, callerSelfRef, hasBlock) { + var _this = this; + + _emberMetal.runInDebug(function () { + return _this._pushToDebugStack('component:' + definition.name, environment); + }); + var parentView = dynamicScope.view; var klass = definition.ComponentClass; var processedArgs = _emberGlimmerUtilsProcessArgs.ComponentArgs.create(args); @@ -12199,12 +12701,18 @@ component.trigger('willInsertElement'); } }; CurlyComponentManager.prototype.didRenderLayout = function didRenderLayout(bucket, bounds) { + var _this2 = this; + bucket.component[_emberGlimmerComponent.BOUNDS] = bounds; bucket.finalize(); + + _emberMetal.runInDebug(function () { + return _this2.debugStack.pop(); + }); }; CurlyComponentManager.prototype.getTag = function getTag(_ref3) { var component = _ref3.component; @@ -12221,15 +12729,21 @@ component.trigger('didRender'); } }; CurlyComponentManager.prototype.update = function update(bucket, _, dynamicScope) { + var _this3 = this; + var component = bucket.component; var args = bucket.args; var argsRevision = bucket.argsRevision; var environment = bucket.environment; + _emberMetal.runInDebug(function () { + return _this3._pushToDebugStack(component._debugContainerKey, environment); + }); + bucket.finalizer = _emberMetal._instrumentStart('render.component', rerenderInstrumentDetails, component); if (!args.tag.validate(argsRevision)) { var _args$value = args.value(); @@ -12254,11 +12768,17 @@ component.trigger('willRender'); } }; CurlyComponentManager.prototype.didUpdateLayout = function didUpdateLayout(bucket) { + var _this4 = this; + bucket.finalize(); + + _emberMetal.runInDebug(function () { + return _this4.debugStack.pop(); + }); }; CurlyComponentManager.prototype.didUpdate = function didUpdate(_ref5) { var component = _ref5.component; var environment = _ref5.environment; @@ -12272,11 +12792,11 @@ CurlyComponentManager.prototype.getDestructor = function getDestructor(stateBucket) { return stateBucket; }; return CurlyComponentManager; - })(); + })(_emberGlimmerSyntaxAbstractManager.default); var MANAGER = new CurlyComponentManager(); var TopComponentManager = (function (_CurlyComponentManager) { babelHelpers.inherits(TopComponentManager, _CurlyComponentManager); @@ -12286,12 +12806,18 @@ _CurlyComponentManager.apply(this, arguments); } TopComponentManager.prototype.create = function create(environment, definition, args, dynamicScope, currentScope, hasBlock) { + var _this5 = this; + var component = definition.ComponentClass; + _emberMetal.runInDebug(function () { + return _this5._pushToDebugStack(component._debugContainerKey, environment); + }); + var finalizer = _emberMetal._instrumentStart('render.component', initialRenderInstrumentDetails, component); dynamicScope.view = component; // We usually do this in the `didCreateElement`, but that hook doesn't fire for tagless components @@ -12645,11 +13171,11 @@ return _emberGlimmerSyntaxDynamicComponent.DynamicComponentSyntax.create(environment, args, symbolTable); } }; exports.InputSyntax = InputSyntax; }); -enifed('ember-glimmer/syntax/mount', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet) { +enifed('ember-glimmer/syntax/mount', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet', 'ember-glimmer/syntax/abstract-manager'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet, _emberGlimmerSyntaxAbstractManager) { /** @module ember @submodule ember-glimmer */ 'use strict'; @@ -12707,23 +13233,33 @@ return MountSyntax; })(_glimmerRuntime.StatementSyntax); exports.MountSyntax = MountSyntax; - var MountManager = (function () { + var MountManager = (function (_AbstractManager) { + babelHelpers.inherits(MountManager, _AbstractManager); + function MountManager() { babelHelpers.classCallCheck(this, MountManager); + + _AbstractManager.apply(this, arguments); } MountManager.prototype.prepareArgs = function prepareArgs(definition, args) { return args; }; MountManager.prototype.create = function create(environment, _ref, args, dynamicScope) { var name = _ref.name; var env = _ref.env; + var _this = this; + + _emberMetal.runInDebug(function () { + return _this._pushEngineToDebugStack('engine:' + name, env); + }); + dynamicScope.outletState = _glimmerReference.UNDEFINED_REFERENCE; var engine = env.owner.buildChildEngineInstance(name); engine.boot(); @@ -12755,22 +13291,28 @@ return engine; }; MountManager.prototype.didCreateElement = function didCreateElement() {}; - MountManager.prototype.didRenderLayout = function didRenderLayout() {}; + MountManager.prototype.didRenderLayout = function didRenderLayout() { + var _this2 = this; + _emberMetal.runInDebug(function () { + return _this2.debugStack.pop(); + }); + }; + MountManager.prototype.didCreate = function didCreate(state) {}; MountManager.prototype.update = function update(state, args, dynamicScope) {}; MountManager.prototype.didUpdateLayout = function didUpdateLayout() {}; MountManager.prototype.didUpdate = function didUpdate(state) {}; return MountManager; - })(); + })(_emberGlimmerSyntaxAbstractManager.default); var MOUNT_MANAGER = new MountManager(); var MountDefinition = (function (_ComponentDefinition) { babelHelpers.inherits(MountDefinition, _ComponentDefinition); @@ -12783,11 +13325,11 @@ } return MountDefinition; })(_glimmerRuntime.ComponentDefinition); }); -enifed('ember-glimmer/syntax/outlet', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-metal', 'ember-glimmer/utils/references', 'glimmer-reference'], function (exports, _emberUtils, _glimmerRuntime, _emberMetal, _emberGlimmerUtilsReferences, _glimmerReference) { +enifed('ember-glimmer/syntax/outlet', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-metal', 'ember-glimmer/utils/references', 'glimmer-reference', 'ember-glimmer/syntax/abstract-manager'], function (exports, _emberUtils, _glimmerRuntime, _emberMetal, _emberGlimmerUtilsReferences, _glimmerReference, _emberGlimmerSyntaxAbstractManager) { /** @module ember @submodule ember-glimmer */ 'use strict'; @@ -12972,20 +13514,30 @@ }; return StateBucket; })(); - var OutletComponentManager = (function () { + var OutletComponentManager = (function (_AbstractManager) { + babelHelpers.inherits(OutletComponentManager, _AbstractManager); + function OutletComponentManager() { babelHelpers.classCallCheck(this, OutletComponentManager); + + _AbstractManager.apply(this, arguments); } OutletComponentManager.prototype.prepareArgs = function prepareArgs(definition, args) { return args; }; OutletComponentManager.prototype.create = function create(environment, definition, args, dynamicScope) { + var _this = this; + + _emberMetal.runInDebug(function () { + return _this._pushToDebugStack('template:' + definition.template.meta.moduleName, environment); + }); + var outletStateReference = dynamicScope.outletState = dynamicScope.outletState.get('outlets').get(definition.outletName); var outletState = outletStateReference.value(); return new StateBucket(outletState); }; @@ -13006,11 +13558,17 @@ OutletComponentManager.prototype.getDestructor = function getDestructor() { return null; }; OutletComponentManager.prototype.didRenderLayout = function didRenderLayout(bucket) { + var _this2 = this; + bucket.finalize(); + + _emberMetal.runInDebug(function () { + return _this2.debugStack.pop(); + }); }; OutletComponentManager.prototype.didCreateElement = function didCreateElement() {}; OutletComponentManager.prototype.didCreate = function didCreate(state) {}; @@ -13020,11 +13578,11 @@ OutletComponentManager.prototype.didUpdateLayout = function didUpdateLayout(bucket) {}; OutletComponentManager.prototype.didUpdate = function didUpdate(state) {}; return OutletComponentManager; - })(); + })(_emberGlimmerSyntaxAbstractManager.default); var MANAGER = new OutletComponentManager(); var TopLevelOutletComponentManager = (function (_OutletComponentManager) { babelHelpers.inherits(TopLevelOutletComponentManager, _OutletComponentManager); @@ -13034,10 +13592,16 @@ _OutletComponentManager.apply(this, arguments); } TopLevelOutletComponentManager.prototype.create = function create(environment, definition, args, dynamicScope) { + var _this3 = this; + + _emberMetal.runInDebug(function () { + return _this3._pushToDebugStack('template:' + definition.template.meta.moduleName, environment); + }); + return new StateBucket(dynamicScope.outletState.value()); }; TopLevelOutletComponentManager.prototype.layoutFor = function layoutFor(definition, bucket, env) { return env.getCompiledBlock(TopLevelOutletLayoutCompiler, definition.template); @@ -13114,11 +13678,11 @@ exports.OutletLayoutCompiler = OutletLayoutCompiler; OutletLayoutCompiler.id = 'outlet'; }); -enifed('ember-glimmer/syntax/render', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet) { +enifed('ember-glimmer/syntax/render', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet', 'ember-glimmer/syntax/abstract-manager'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet, _emberGlimmerSyntaxAbstractManager) { /** @module ember @submodule ember-glimmer */ 'use strict'; @@ -13253,13 +13817,17 @@ return RenderSyntax; })(_glimmerRuntime.StatementSyntax); exports.RenderSyntax = RenderSyntax; - var AbstractRenderManager = (function () { + var AbstractRenderManager = (function (_AbstractManager) { + babelHelpers.inherits(AbstractRenderManager, _AbstractManager); + function AbstractRenderManager() { babelHelpers.classCallCheck(this, AbstractRenderManager); + + _AbstractManager.apply(this, arguments); } AbstractRenderManager.prototype.prepareArgs = function prepareArgs(definition, args) { return args; }; @@ -13295,27 +13863,39 @@ AbstractRenderManager.prototype.didUpdateLayout = function didUpdateLayout() {}; AbstractRenderManager.prototype.didUpdate = function didUpdate() {}; return AbstractRenderManager; - })(); + })(_emberGlimmerSyntaxAbstractManager.default); + _emberMetal.runInDebug(function () { + AbstractRenderManager.prototype.didRenderLayout = function () { + this.debugStack.pop(); + }; + }); + var SingletonRenderManager = (function (_AbstractRenderManager) { babelHelpers.inherits(SingletonRenderManager, _AbstractRenderManager); function SingletonRenderManager() { babelHelpers.classCallCheck(this, SingletonRenderManager); _AbstractRenderManager.apply(this, arguments); } SingletonRenderManager.prototype.create = function create(environment, definition, args, dynamicScope) { + var _this = this; + var name = definition.name; var env = definition.env; var controller = env.owner.lookup('controller:' + name) || _emberRouting.generateController(env.owner, name); + _emberMetal.runInDebug(function () { + return _this._pushToDebugStack('controller:' + name + ' (with the render helper)', environment); + }); + if (dynamicScope.rootOutletState) { dynamicScope.outletState = dynamicScope.rootOutletState.getOrphan(name); } return { controller: controller }; @@ -13334,18 +13914,24 @@ _AbstractRenderManager2.apply(this, arguments); } NonSingletonRenderManager.prototype.create = function create(environment, definition, args, dynamicScope) { + var _this2 = this; + var name = definition.name; var env = definition.env; var modelRef = args.positional.at(0); var factory = env.owner._lookupFactory('controller:' + name) || _emberRouting.generateControllerFactory(env.owner, name); var controller = factory.create({ model: modelRef.value() }); + _emberMetal.runInDebug(function () { + return _this2._pushToDebugStack('controller:' + name + ' (with the render helper)', environment); + }); + if (dynamicScope.rootOutletState) { dynamicScope.outletState = dynamicScope.rootOutletState.getOrphan(name); } return { controller: controller }; @@ -13681,10 +14267,103 @@ }; return ColonClassNameBindingReference; })(_glimmerReference.CachedReference); }); +enifed('ember-glimmer/utils/debug-stack', ['exports', 'ember-metal'], function (exports, _emberMetal) { + 'use strict'; + + var DebugStack = undefined; + + _emberMetal.runInDebug(function () { + var Element = function Element(name) { + babelHelpers.classCallCheck(this, Element); + + this.name = name; + }; + + var TemplateElement = (function (_Element) { + babelHelpers.inherits(TemplateElement, _Element); + + function TemplateElement() { + babelHelpers.classCallCheck(this, TemplateElement); + + _Element.apply(this, arguments); + } + + return TemplateElement; + })(Element); + + var EngineElement = (function (_Element2) { + babelHelpers.inherits(EngineElement, _Element2); + + function EngineElement() { + babelHelpers.classCallCheck(this, EngineElement); + + _Element2.apply(this, arguments); + } + + return EngineElement; + })(Element); + + DebugStack = (function () { + function DebugStack() { + babelHelpers.classCallCheck(this, DebugStack); + + this._stack = []; + } + + DebugStack.prototype.push = function push(name) { + this._stack.push(new TemplateElement(name)); + }; + + DebugStack.prototype.pushEngine = function pushEngine(name) { + this._stack.push(new EngineElement(name)); + }; + + DebugStack.prototype.pop = function pop() { + var element = this._stack.pop(); + + if (element) { + return element.name; + } + }; + + DebugStack.prototype.peek = function peek() { + var template = this._currentTemplate(); + var engine = this._currentEngine(); + + if (engine) { + return '"' + template + '" (in "' + engine + '")'; + } else if (template) { + return '"' + template + '"'; + } + }; + + DebugStack.prototype._currentTemplate = function _currentTemplate() { + return this._getCurrentByType(TemplateElement); + }; + + DebugStack.prototype._currentEngine = function _currentEngine() { + return this._getCurrentByType(EngineElement); + }; + + DebugStack.prototype._getCurrentByType = function _getCurrentByType(type) { + for (var i = this._stack.length; i >= 0; i--) { + var element = this._stack[i]; + if (element instanceof type) { + return element.name; + } + } + }; + + return DebugStack; + })(); + }); + + exports.default = DebugStack; +}); enifed('ember-glimmer/utils/iterable', ['exports', 'ember-utils', 'ember-metal', 'ember-runtime', 'ember-glimmer/utils/references', 'ember-glimmer/helpers/each-in', 'glimmer-reference'], function (exports, _emberUtils, _emberMetal, _emberRuntime, _emberGlimmerUtilsReferences, _emberGlimmerHelpersEachIn, _glimmerReference) { 'use strict'; exports.default = iterableFor; @@ -14514,12 +15193,14 @@ var positionalValue = positional.value(); var namedValue = named.value(); _emberMetal.runInDebug(function () { - Object.freeze(positionalValue); - Object.freeze(namedValue); + if (_emberUtils.HAS_NATIVE_WEAKMAP) { + Object.freeze(positionalValue); + Object.freeze(namedValue); + } }); var result = helper(positionalValue, namedValue); if (result === null) { @@ -14565,12 +15246,14 @@ var positionalValue = positional.value(); var namedValue = named.value(); _emberMetal.runInDebug(function () { - Object.freeze(positionalValue); - Object.freeze(namedValue); + if (_emberUtils.HAS_NATIVE_WEAKMAP) { + Object.freeze(positionalValue); + Object.freeze(namedValue); + } }); return helper(positionalValue, namedValue); }; @@ -14606,12 +15289,14 @@ var positionalValue = positional.value(); var namedValue = named.value(); _emberMetal.runInDebug(function () { - Object.freeze(positionalValue); - Object.freeze(namedValue); + if (_emberUtils.HAS_NATIVE_WEAKMAP) { + Object.freeze(positionalValue); + Object.freeze(namedValue); + } }); return instance.compute(positionalValue, namedValue); }; @@ -15654,11 +16339,11 @@ }; return DefaultStore; })(); }); -enifed('ember-metal/chains', ['exports', 'ember-utils', 'ember-metal/property_get', 'ember-metal/meta', 'ember-metal/watch_key', 'ember-metal/watch_path'], function (exports, _emberUtils, _emberMetalProperty_get, _emberMetalMeta, _emberMetalWatch_key, _emberMetalWatch_path) { +enifed('ember-metal/chains', ['exports', 'ember-utils', 'ember-metal/property_get', 'ember-metal/meta', 'ember-metal/watch_key', 'ember-metal/computed', 'ember-metal/watch_path'], function (exports, _emberUtils, _emberMetalProperty_get, _emberMetalMeta, _emberMetalWatch_key, _emberMetalComputed, _emberMetalWatch_path) { 'use strict'; exports.finishChains = finishChains; var FIRST_KEY = /^([^\.]+)/; @@ -15839,12 +16524,12 @@ if (isVolatile(obj[key])) { return _emberMetalProperty_get.get(obj, key); // Otherwise attempt to get the cached value of the computed property } else { var cache = meta.readableCache(); - if (cache && key in cache) { - return cache[key]; + if (cache) { + return _emberMetalComputed.cacheFor.get(cache, key); } } } ChainNode.prototype = { @@ -18717,11 +19402,11 @@ } return original; } }); -enifed('ember-metal/meta', ['exports', 'ember-utils', 'ember-metal/features', 'ember-metal/meta_listeners', 'ember-metal/debug', 'ember-metal/chains'], function (exports, _emberUtils, _emberMetalFeatures, _emberMetalMeta_listeners, _emberMetalDebug, _emberMetalChains) { +enifed('ember-metal/meta', ['exports', 'ember-utils', 'ember-metal/features', 'ember-metal/meta_listeners', 'ember-metal/debug', 'ember-metal/chains', 'require'], function (exports, _emberUtils, _emberMetalFeatures, _emberMetalMeta_listeners, _emberMetalDebug, _emberMetalChains, _require) { 'no use strict'; // Remove "use strict"; from transpiled module until // https://bugs.webkit.org/show_bug.cgi?id=138038 is fixed exports.Meta = Meta; @@ -18782,17 +19467,23 @@ var META_DESTROYED = 1 << 3; var IS_PROXY = 1 << 4; if (true || false) { members.lastRendered = ownMap; - members.lastRenderedFrom = ownMap; // FIXME: not used in production, remove me from prod builds + if (_require.has('ember-debug')) { + //https://github.com/emberjs/ember.js/issues/14732 + members.lastRenderedReferenceMap = ownMap; + members.lastRenderedTemplateMap = ownMap; + } } var memberNames = Object.keys(members); var META_FIELD = '__ember_meta__'; function Meta(obj, parentMeta) { + var _this = this; + _emberMetalDebug.runInDebug(function () { return counters.metaInstantiated++; }); this._cache = undefined; @@ -18824,11 +19515,14 @@ // inherited, and we can optimize it much better than JS runtimes. this.parent = parentMeta; if (true || false) { this._lastRendered = undefined; - this._lastRenderedFrom = undefined; // FIXME: not used in production, remove me from prod builds + _emberMetalDebug.runInDebug(function () { + _this._lastRenderedReferenceMap = undefined; + _this._lastRenderedTemplateMap = undefined; + }); } this._initializeListeners(); } @@ -19191,28 +19885,15 @@ obj[key] = value; } }; } - var HAS_NATIVE_WEAKMAP = (function () { - // detect if `WeakMap` is even present - var hasWeakMap = typeof WeakMap === 'function'; - if (!hasWeakMap) { - return false; - } - - var instance = new WeakMap(); - // use `Object`'s `.toString` directly to prevent us from detecting - // polyfills as native weakmaps - return Object.prototype.toString.call(instance) === '[object WeakMap]'; - })(); - var setMeta = undefined, peekMeta = undefined; // choose the one appropriate for given platform - if (HAS_NATIVE_WEAKMAP) { + if (_emberUtils.HAS_NATIVE_WEAKMAP) { (function () { var getPrototypeOf = Object.getPrototypeOf; var metaStore = new WeakMap(); exports.setMeta = setMeta = function WeakMap_setMeta(obj, meta) { @@ -22341,14 +23022,18 @@ if (true || false) { (function () { var counter = 0; var inTransaction = false; var shouldReflush = undefined; + var debugStack = undefined; exports.default = runInTransaction = function (context, methodName) { shouldReflush = false; inTransaction = true; + _emberMetalDebug.runInDebug(function () { + debugStack = context.env.debugStack; + }); context[methodName](); inTransaction = false; counter++; return shouldReflush; }; @@ -22360,39 +23045,47 @@ var meta = _emberMetalMeta.meta(object); var lastRendered = meta.writableLastRendered(); lastRendered[key] = counter; _emberMetalDebug.runInDebug(function () { - var lastRenderedFrom = meta.writableLastRenderedFrom(); - lastRenderedFrom[key] = reference; + var referenceMap = meta.writableLastRenderedReferenceMap(); + referenceMap[key] = reference; + + var templateMap = meta.writableLastRenderedTemplateMap(); + if (templateMap[key] === undefined) { + templateMap[key] = debugStack.peek(); + } }); }; exports.assertNotRendered = assertNotRendered = function (object, key, _meta) { var meta = _meta || _emberMetalMeta.meta(object); var lastRendered = meta.readableLastRendered(); if (lastRendered && lastRendered[key] === counter) { raise((function () { - var ref = meta.readableLastRenderedFrom(); - var parts = []; - var lastRef = ref[key]; + var templateMap = meta.readableLastRenderedTemplateMap(); + var lastRenderedIn = templateMap[key]; + var currentlyIn = debugStack.peek(); + var referenceMap = meta.readableLastRenderedReferenceMap(); + var lastRef = referenceMap[key]; + var parts = []; var label = undefined; if (lastRef) { while (lastRef && lastRef._propertyKey) { parts.unshift(lastRef._propertyKey); lastRef = lastRef._parentReference; } - label = parts.join(); + label = parts.join('.'); } else { label = 'the same value'; } - return 'You modified ' + label + ' twice on ' + object + ' in a single render. This was unreliable and slow in Ember 1.x and ' + implication; + return 'You modified "' + label + '" twice on ' + object + ' in a single render. It was rendered in ' + lastRenderedIn + ' and modified in ' + currentlyIn + '. This was unreliable and slow in Ember 1.x and ' + implication; })(), false); shouldReflush = true; } }; @@ -33456,13 +34149,13 @@ /** Remove all elements from the array. This is useful if you want to reuse an existing array without having to recreate it. ```javascript let colors = ['red', 'green', 'blue']; - color.length(); // 3 - colors.clear(); // [] - colors.length(); // 0 + colors.length; // 3 + colors.clear(); // [] + colors.length; // 0 ``` @method clear @return {Ember.Array} An empty Array. @public */ @@ -34635,11 +35328,11 @@ Allow registering options for all factories of a type. ```javascript let App = Ember.Application.create(); let appInstance = App.buildInstance(); // if all of type `connection` must not be singletons - appInstance.optionsForType('connection', { singleton: false }); + appInstance.registerOptionsForType('connection', { singleton: false }); appInstance.register('connection:twitter', TwitterConnection); appInstance.register('connection:facebook', FacebookConnection); let twitter = appInstance.lookup('connection:twitter'); let twitter2 = appInstance.lookup('connection:twitter'); twitter === twitter2; // => false @@ -39317,11 +40010,11 @@ } return ret; } } }); -enifed('ember-utils/index', ['exports', 'ember-utils/symbol', 'ember-utils/owner', 'ember-utils/assign', 'ember-utils/empty-object', 'ember-utils/dictionary', 'ember-utils/guid', 'ember-utils/intern', 'ember-utils/super', 'ember-utils/inspect', 'ember-utils/lookup-descriptor', 'ember-utils/invoke', 'ember-utils/make-array', 'ember-utils/apply-str', 'ember-utils/name', 'ember-utils/to-string'], function (exports, _emberUtilsSymbol, _emberUtilsOwner, _emberUtilsAssign, _emberUtilsEmptyObject, _emberUtilsDictionary, _emberUtilsGuid, _emberUtilsIntern, _emberUtilsSuper, _emberUtilsInspect, _emberUtilsLookupDescriptor, _emberUtilsInvoke, _emberUtilsMakeArray, _emberUtilsApplyStr, _emberUtilsName, _emberUtilsToString) { +enifed('ember-utils/index', ['exports', 'ember-utils/symbol', 'ember-utils/owner', 'ember-utils/assign', 'ember-utils/empty-object', 'ember-utils/dictionary', 'ember-utils/guid', 'ember-utils/intern', 'ember-utils/super', 'ember-utils/inspect', 'ember-utils/lookup-descriptor', 'ember-utils/invoke', 'ember-utils/make-array', 'ember-utils/apply-str', 'ember-utils/name', 'ember-utils/to-string', 'ember-utils/weak-map-utils'], function (exports, _emberUtilsSymbol, _emberUtilsOwner, _emberUtilsAssign, _emberUtilsEmptyObject, _emberUtilsDictionary, _emberUtilsGuid, _emberUtilsIntern, _emberUtilsSuper, _emberUtilsInspect, _emberUtilsLookupDescriptor, _emberUtilsInvoke, _emberUtilsMakeArray, _emberUtilsApplyStr, _emberUtilsName, _emberUtilsToString, _emberUtilsWeakMapUtils) { /* This package will be eagerly parsed and should have no dependencies on external packages. It is intended to be used to share utility methods that will be needed @@ -39355,10 +40048,11 @@ exports.tryInvoke = _emberUtilsInvoke.tryInvoke; exports.makeArray = _emberUtilsMakeArray.default; exports.applyStr = _emberUtilsApplyStr.default; exports.NAME_KEY = _emberUtilsName.default; exports.toString = _emberUtilsToString.default; + exports.HAS_NATIVE_WEAKMAP = _emberUtilsWeakMapUtils.HAS_NATIVE_WEAKMAP; }); enifed('ember-utils/inspect', ['exports'], function (exports) { 'use strict'; exports.default = inspect; @@ -39655,12 +40349,12 @@ `setOwner` forces a new owner on a given object instance. This is primarily useful in some testing cases. @method setOwner @for Ember - @param {Object} object An object with an owner. - @return {Object} An owner object. + @param {Object} object An object instance. + @param {Object} object The new owner object of the object instance. @since 2.3.0 @public */ function setOwner(object, owner) { @@ -39772,10 +40466,27 @@ } else { return objectToString.call(obj); } } }); +enifed('ember-utils/weak-map-utils', ['exports'], function (exports) { + 'use strict'; + + var HAS_NATIVE_WEAKMAP = (function () { + // detect if `WeakMap` is even present + var hasWeakMap = typeof WeakMap === 'function'; + if (!hasWeakMap) { + return false; + } + + var instance = new WeakMap(); + // use `Object`'s `.toString` directly to prevent us from detecting + // polyfills as native weakmaps + return Object.prototype.toString.call(instance) === '[object WeakMap]'; + })(); + exports.HAS_NATIVE_WEAKMAP = HAS_NATIVE_WEAKMAP; +}); enifed('ember-views/compat/attrs', ['exports', 'ember-utils'], function (exports, _emberUtils) { 'use strict'; var MUTABLE_CELL = _emberUtils.symbol('MUTABLE_CELL'); exports.MUTABLE_CELL = MUTABLE_CELL; @@ -41734,485 +42445,10 @@ @module ember @submodule ember-views */ /** - `Ember.View` is the class in Ember responsible for encapsulating templates of - HTML content, combining templates with data to render as sections of a page's - DOM, and registering and responding to user-initiated events. - - ## HTML Tag - - The default HTML tag name used for a view's DOM representation is `div`. This - can be customized by setting the `tagName` property. The following view - class: - - ```javascript - ParagraphView = Ember.View.extend({ - tagName: 'em' - }); - ``` - - Would result in instances with the following HTML: - - ```html - <em id="ember1" class="ember-view"></em> - ``` - - ## HTML `class` Attribute - - The HTML `class` attribute of a view's tag can be set by providing a - `classNames` property that is set to an array of strings: - - ```javascript - MyView = Ember.View.extend({ - classNames: ['my-class', 'my-other-class'] - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view my-class my-other-class"></div> - ``` - - `class` attribute values can also be set by providing a `classNameBindings` - property set to an array of properties names for the view. The return value - of these properties will be added as part of the value for the view's `class` - attribute. These properties can be computed properties: - - ```javascript - MyView = Ember.View.extend({ - classNameBindings: ['propertyA', 'propertyB'], - propertyA: 'from-a', - propertyB: Ember.computed(function() { - if (someLogic) { return 'from-b'; } - }) - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view from-a from-b"></div> - ``` - - If the value of a class name binding returns a boolean the property name - itself will be used as the class name if the property is true. The class name - will not be added if the value is `false` or `undefined`. - - ```javascript - MyView = Ember.View.extend({ - classNameBindings: ['hovered'], - hovered: true - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view hovered"></div> - ``` - - When using boolean class name bindings you can supply a string value other - than the property name for use as the `class` HTML attribute by appending the - preferred value after a ":" character when defining the binding: - - ```javascript - MyView = Ember.View.extend({ - classNameBindings: ['awesome:so-very-cool'], - awesome: true - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view so-very-cool"></div> - ``` - - Boolean value class name bindings whose property names are in a - camelCase-style format will be converted to a dasherized format: - - ```javascript - MyView = Ember.View.extend({ - classNameBindings: ['isUrgent'], - isUrgent: true - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view is-urgent"></div> - ``` - - Class name bindings can also refer to object values that are found by - traversing a path relative to the view itself: - - ```javascript - MyView = Ember.View.extend({ - classNameBindings: ['messages.empty'] - messages: Ember.Object.create({ - empty: true - }) - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view empty"></div> - ``` - - If you want to add a class name for a property which evaluates to true and - and a different class name if it evaluates to false, you can pass a binding - like this: - - ```javascript - // Applies 'enabled' class when isEnabled is true and 'disabled' when isEnabled is false - Ember.View.extend({ - classNameBindings: ['isEnabled:enabled:disabled'] - isEnabled: true - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view enabled"></div> - ``` - - When isEnabled is `false`, the resulting HTML representation looks like - this: - - ```html - <div id="ember1" class="ember-view disabled"></div> - ``` - - This syntax offers the convenience to add a class if a property is `false`: - - ```javascript - // Applies no class when isEnabled is true and class 'disabled' when isEnabled is false - Ember.View.extend({ - classNameBindings: ['isEnabled::disabled'] - isEnabled: true - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view"></div> - ``` - - When the `isEnabled` property on the view is set to `false`, it will result - in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view disabled"></div> - ``` - - Updates to the value of a class name binding will result in automatic - update of the HTML `class` attribute in the view's rendered HTML - representation. If the value becomes `false` or `undefined` the class name - will be removed. - - Both `classNames` and `classNameBindings` are concatenated properties. See - [Ember.Object](/api/classes/Ember.Object.html) documentation for more - information about concatenated properties. - - ## HTML Attributes - - The HTML attribute section of a view's tag can be set by providing an - `attributeBindings` property set to an array of property names on the view. - The return value of these properties will be used as the value of the view's - HTML associated attribute: - - ```javascript - AnchorView = Ember.View.extend({ - tagName: 'a', - attributeBindings: ['href'], - href: 'http://google.com' - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <a id="ember1" class="ember-view" href="http://google.com"></a> - ``` - - One property can be mapped on to another by placing a ":" between - the source property and the destination property: - - ```javascript - AnchorView = Ember.View.extend({ - tagName: 'a', - attributeBindings: ['url:href'], - url: 'http://google.com' - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <a id="ember1" class="ember-view" href="http://google.com"></a> - ``` - - Namespaced attributes (e.g. `xlink:href`) are supported, but have to be - mapped, since `:` is not a valid character for properties in Javascript: - - ```javascript - UseView = Ember.View.extend({ - tagName: 'use', - attributeBindings: ['xlinkHref:xlink:href'], - xlinkHref: '#triangle' - }); - ``` - Will result in view instances with an HTML representation of: - - ```html - <use xlink:href="#triangle"></use> - ``` - - If the return value of an `attributeBindings` monitored property is a boolean - the attribute will be present or absent depending on the value: - - ```javascript - MyTextInput = Ember.View.extend({ - tagName: 'input', - attributeBindings: ['disabled'], - disabled: false - }); - ``` - - Will result in a view instance with an HTML representation of: - - ```html - <input id="ember1" class="ember-view" /> - ``` - - `attributeBindings` can refer to computed properties: - - ```javascript - MyTextInput = Ember.View.extend({ - tagName: 'input', - attributeBindings: ['disabled'], - disabled: Ember.computed(function() { - if (someLogic) { - return true; - } else { - return false; - } - }) - }); - ``` - - To prevent setting an attribute altogether, use `null` or `undefined` as the - return value of the `attributeBindings` monitored property: - - ```javascript - MyTextInput = Ember.View.extend({ - tagName: 'form', - attributeBindings: ['novalidate'], - novalidate: null - }); - ``` - - Updates to the property of an attribute binding will result in automatic - update of the HTML attribute in the view's rendered HTML representation. - - `attributeBindings` is a concatenated property. See [Ember.Object](/api/classes/Ember.Object.html) - documentation for more information about concatenated properties. - - ## Layouts - - Views can have a secondary template that wraps their main template. Like - primary templates, layouts can be any function that accepts an optional - context parameter and returns a string of HTML that will be inserted inside - view's tag. Views whose HTML element is self closing (e.g. `<input />`) - cannot have a layout and this property will be ignored. - - Most typically in Ember a layout will be a compiled template. - - A view's layout can be set directly with the `layout` property or reference - an existing template by name with the `layoutName` property. - - A template used as a layout must contain a single use of the - `{{yield}}` helper. The HTML contents of a view's rendered `template` will be - inserted at this location: - - ```javascript - AViewWithLayout = Ember.View.extend({ - layout: Ember.HTMLBars.compile("<div class='my-decorative-class'>{{yield}}</div>"), - template: Ember.HTMLBars.compile("I got wrapped") - }); - ``` - - Will result in view instances with an HTML representation of: - - ```html - <div id="ember1" class="ember-view"> - <div class="my-decorative-class"> - I got wrapped - </div> - </div> - ``` - - See [Ember.Templates.helpers.yield](/api/classes/Ember.Templates.helpers.html#method_yield) - for more information. - - ## Responding to Browser Events - - Views can respond to user-initiated events in one of three ways: method - implementation, through an event manager, and through `{{action}}` helper use - in their template or layout. - - ### Method Implementation - - Views can respond to user-initiated events by implementing a method that - matches the event name. A `jQuery.Event` object will be passed as the - argument to this method. - - ```javascript - AView = Ember.View.extend({ - click: function(event) { - // will be called when an instance's - // rendered element is clicked - } - }); - ``` - - ### Event Managers - - Views can define an object as their `eventManager` property. This object can - then implement methods that match the desired event names. Matching events - that occur on the view's rendered HTML or the rendered HTML of any of its DOM - descendants will trigger this method. A `jQuery.Event` object will be passed - as the first argument to the method and an `Ember.View` object as the - second. The `Ember.View` will be the view whose rendered HTML was interacted - with. This may be the view with the `eventManager` property or one of its - descendant views. - - ```javascript - AView = Ember.View.extend({ - eventManager: Ember.Object.create({ - doubleClick: function(event, view) { - // will be called when an instance's - // rendered element or any rendering - // of this view's descendant - // elements is clicked - } - }) - }); - ``` - - An event defined for an event manager takes precedence over events of the - same name handled through methods on the view. - - ```javascript - AView = Ember.View.extend({ - mouseEnter: function(event) { - // will never trigger. - }, - eventManager: Ember.Object.create({ - mouseEnter: function(event, view) { - // takes precedence over AView#mouseEnter - } - }) - }); - ``` - - Similarly a view's event manager will take precedence for events of any views - rendered as a descendant. A method name that matches an event name will not - be called if the view instance was rendered inside the HTML representation of - a view that has an `eventManager` property defined that handles events of the - name. Events not handled by the event manager will still trigger method calls - on the descendant. - - ```javascript - var App = Ember.Application.create(); - App.OuterView = Ember.View.extend({ - template: Ember.HTMLBars.compile("outer {{#view 'inner'}}inner{{/view}} outer"), - eventManager: Ember.Object.create({ - mouseEnter: function(event, view) { - // view might be instance of either - // OuterView or InnerView depending on - // where on the page the user interaction occurred - } - }) - }); - - App.InnerView = Ember.View.extend({ - click: function(event) { - // will be called if rendered inside - // an OuterView because OuterView's - // eventManager doesn't handle click events - }, - mouseEnter: function(event) { - // will never be called if rendered inside - // an OuterView. - } - }); - ``` - - ### `{{action}}` Helper - - See [Ember.Templates.helpers.action](/api/classes/Ember.Templates.helpers.html#method_action). - - ### Event Names - - All of the event handling approaches described above respond to the same set - of events. The names of the built-in events are listed below. (The hash of - built-in events exists in `Ember.EventDispatcher`.) Additional, custom events - can be registered by using `Ember.Application.customEvents`. - - Touch events: - - * `touchStart` - * `touchMove` - * `touchEnd` - * `touchCancel` - - Keyboard events - - * `keyDown` - * `keyUp` - * `keyPress` - - Mouse events - - * `mouseDown` - * `mouseUp` - * `contextMenu` - * `click` - * `doubleClick` - * `mouseMove` - * `focusIn` - * `focusOut` - * `mouseEnter` - * `mouseLeave` - - Form events: - - * `submit` - * `change` - * `focusIn` - * `focusOut` - * `input` - - HTML5 drag and drop events: - - * `dragStart` - * `drag` - * `dragEnter` - * `dragLeave` - * `dragOver` - * `dragEnd` - * `drop` - @class View @namespace Ember @extends Ember.CoreView @deprecated See http://emberjs.com/deprecations/v1.x/#toc_ember-view @uses Ember.ViewSupport @@ -42757,11 +42993,11 @@ // reduced computed macros enifed("ember/version", ["exports"], function (exports) { "use strict"; - exports.default = "2.11.0-beta.4"; + exports.default = "2.11.0-beta.8"; }); enifed('internal-test-helpers/apply-mixins', ['exports', 'ember-utils'], function (exports, _emberUtils) { 'use strict'; exports.default = applyMixins; @@ -52945,13 +53181,15 @@ NamedArgs.prototype.compile = function compile(compiler, env, symbolTable) { var keys = this.keys; var values = this.values; - return new _glimmerRuntimeLibCompiledExpressionsArgs.CompiledNamedArgs(keys, values.map(function (value) { - return value.compile(compiler, env, symbolTable); - })); + var compiledValues = new Array(values.length); + for (var i = 0; i < compiledValues.length; i++) { + compiledValues[i] = values[i].compile(compiler, env, symbolTable); + } + return new _glimmerRuntimeLibCompiledExpressionsArgs.CompiledNamedArgs(keys, compiledValues); }; return NamedArgs; })(); @@ -53282,12 +53520,23 @@ }); enifed('glimmer-runtime/lib/utils', ['exports', 'glimmer-util'], function (exports, _glimmerUtil) { 'use strict'; - var EMPTY_ARRAY = Object.freeze([]); + var HAS_NATIVE_WEAKMAP = (function () { + // detect if `WeakMap` is even present + var hasWeakMap = typeof WeakMap === 'function'; + if (!hasWeakMap) { + return false; + } + var instance = new WeakMap(); + // use `Object`'s `.toString` directly to prevent us from detecting + // polyfills as native weakmaps + return Object.prototype.toString.call(instance) === '[object WeakMap]'; + })(); + var EMPTY_ARRAY = HAS_NATIVE_WEAKMAP ? Object.freeze([]) : []; exports.EMPTY_ARRAY = EMPTY_ARRAY; - var EMPTY_DICT = Object.freeze(_glimmerUtil.dict()); + var EMPTY_DICT = HAS_NATIVE_WEAKMAP ? Object.freeze(_glimmerUtil.dict()) : _glimmerUtil.dict(); exports.EMPTY_DICT = EMPTY_DICT; var ListRange = (function () { function ListRange(list, start, end) { this.list = list;