Ember 3.2 released


Today, the Ember project released version 3.2.0 of Ember.js, Ember Data and Ember CLI-this must be a little later than planned! Thank you for your support and patience.

This version started the 3.3 test cycle of all sub-projects. We encourage our community (especially plugin authors) to help test these beta versions and report any bugs before they are released as the final version in six weeks.This Embers try Plugins are a great way to continuously test your project against the latest Ember version.

You can read more about our general publishing process here:

Please note that we did not include the 3.3 beta feature in this blog post, mainly because we are very focused on launching 3.2 and must be prioritized. thank you for understanding!


Ember.js

Ember.js is the core framework for building ambitious web applications.

Changes in Ember.js 3.2

Ember.js 3.2 is an incremental and backward compatible version of Ember with bug fixes, performance improvements, and a small number of deprecations. There is one (1) new feature and three (3) deprecations in this version.

New features (1)

Block let template helper (1 of 1)

new let The template helper can create new bindings in the template.It’s like with However, the block is not conditionally rendered based on the value passed to the block.

Suppose we need to capitalize the first name and last name in the template. We can do this:

Welcome back {{concat (capitalize person.firstName) ' ' (capitalize person.lastName)}}

Account Details:
First Name: {{capitalize person.firstName}}
Last Name: {{capitalize person.lastName}}

This can cause errors because we have to track this throughout the template.Thankfully, now using let helper:

{{#let (capitalize person.firstName) (capitalize person.lastName)
  as |firstName lastName|
}}
  Welcome back {{concat firstName ' ' lastName}}

  Account Details:
  First Name: {{firstName}}
  Last Name: {{lastName}}
{{/let}}

Now you can use firstName with lastName Inside let Knowing that logic is a comfortable block in one place. This is an ingenious way to introduce bindings in templates without setting their properties on the controller or component.

What is important to understand let The helper is that it is only used as a block helper. This means you can’t do things like this:

{{let
  firstName=(capitalize person.firstName)
  lastName=(capitalize person.lastName)
}}

Deprecated (3)

When the API will be removed in the future, a deprecation will be added to Ember.js. Each deprecation guide has an entry in the deprecation guide that describes the migration path to a more stable API. Before the major version of the framework is released, the deprecated public API will not be removed.

Consider using ember-cli-deprecated-workflow addon If you want to upgrade your application without immediately solving the deprecation issue.

Use of Ember.Logger (1 of 3)

Used for Ember.Logger Deprecated.You should replace Ember.Logger transfer console.

In Microsoft Edge and IE11, in addition to calling its methods, using the console may require more subtle changes than just replacing the console anywhere Logger appear. In these browsers, when the development tools are opened, their behavior will be the same as in other browsers.

However, when running normally, the call to its method cannot be bound to any object other than the console object. Otherwise, you will receive an invalid call object exception. This is a known inconsistency with these browsers.

To avoid this situation, please convert:

var print = Logger.log; // assigning method to variable

Into this:

// assigning method bound to console to variable
var print = console.log.bind(console);

In addition, convert any of the following:

Logger.info.apply(undefined, arguments); // or
Logger.info.apply(null, arguments); // or
Logger.info.apply(this, arguments); // or

Into this:

console.info.apply(console, arguments);

Finally, because node versions prior to version 9 do not support console.debug, you may need to convert the following:

Logger.debug(message);

Into this:

if (console.debug) {
  console.debug(message);
} else {
  console.log(message);
}

Additional author notes -If your add-on needs to support both Ember 2.x and Ember 3.x clients, you will need to test whether the console exists before calling its methods. If you do a lot of logging, you may find it convenient to define your own wrapper. Writing the wrapper as a service will provide dependency injection for the test and even the client.

Private API router #router rename (2 of 3)

In order to avoid conflicts with user-defined attributes or methods, Router#router Private API has been renamed to Router#_router. If you want to access the router, you should inject the router service into the router like this:

import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';

export default Route.extend({
  router: service()
});
Use defineProperty (3 of 3) to define calculated properties

use defineProperty (by import { defineProperty } from '@ember/object';) To define calculation properties. Although not common, you can assign calculated properties directly to objects.In this way, they are derived from such Ember.get. It is not recommended to assign calculated attributes directly to support ES5 getter calculated attributes, you should replace these assignments with calls defineProperty.

For example, the following:

import { computed, get } from '@ember/object';
let object = {};
object.key = computed(() => 'value');
get(object, 'key') === 'value';

It should be changed to this:

import { computed, defineProperty, get } from '@ember/object';
let object = {};
defineProperty(object, 'key', computed(() => 'value'));
get(object, 'key') === 'value';

For more details about the changes in Ember.js 3.2, please check Ember.js 3.2.0 release page.


Embers data

Ember Data is the official data persistence library for Ember.js applications.

Changes in Ember Data 3.2

There are four (4) new features and zero (0) deprecations in Ember Data 3.2 version.

New features (4)

Lazy relationship load (1 of 4)

Lazy relationship resolution was introduced in Ember Data 2.14. Because this parsing uses left/right keying, it means that it is not compatible with polymorphic relationships.

Using Ember Data 3.2, this is Fixed now.

Ember data feature mark removal (2, 4 in total)

Ember Data’s current feature flags are out of date, so they are all Removed in Ember Data 3.2Ember Data will try to develop in different directions and make some planned changes in 2018.

If your application depends on enabling these feature flags to function, please contact the Ember Data team by opening a github issue on github Ember data warehouse The Ember Data team will try to assist with the transition.

Function flag ds-improved-ajax (No. 3 of 4)

The Ember Data team has released a plugin that will support ds-improved-ajax Application programming interface.

Function flag ds-pushpayload-return (No. 4 of 4)

If you rely on ds-pushpayload-return For feature flags, you can use the following pattern to manually serialize API responses and push records to the store.

export function pushPayload(store, modelName, rawPayload) {
   let ModelClass = store.modelFor(modelName);
   let serializer = store.serializerFor(modelName);

   let jsonApiPayload = serializer.normalizeResponse(store, ModelClass, rawPayload, null, 'query');

  return store.push(jsonApiPayload);
}
// Before
this.get('store').pushPayload(modelName, rawPayload);

// After
import { pushPayload } from '<app-name>/utils/push-payload';

pushPayload(this.get('store'), modelName, rawPayload);

Deprecated (0)

No deprecation was introduced in Ember Data 3.2.

For more details about the changes in Ember Data 3.2, please check
Ember Data 3.2.0 release page.


Ember command line interface

Ember CLI is a command line interface for managing and packaging Ember.js applications.

Upgrade Ember CLI

You can upgrade Ember CLI separately from Ember.js and Ember Data!Use to upgrade your project yarn Run:

yarn upgrade ember-cli

Use to upgrade your project npm Run:

npm install --save-dev ember-cli

Run after running the upgrade command ember init Apply blueprint changes in the project directory.You can preview these changes application with Plug-in.

Changes in Ember CLI 3.2

There are two (2) new features and one (1) deprecation in the Ember CLI 3.2 version.

New features and updates (2)

qunit-dom (1 of 2)

To make DOM assertions more readable, qunit-dom Dependencies will be added default To all applications and plugins. Opt out by deleting it from the package.json file.Look https://github.com/simlabs/qunit-dom-codemod To ease migration.

This code:

assert.equal(this.element.querySelector('.title').textContent.trim(), 'Hello World!');

Becomes like this:

assert.dom('.title').hasText('Hello World!');
Update ember-cli-qunit Dependencies (2 of 2 in total)

When upgrading Ember 2.18 applications to Ember 3.0, ember-cli-qunit Not updated from ^4.1.1.If there is already a package lock file, then its version will not be updated, making find() Assistant not available in Ember 3.0 style testing.It has now been updated to ^4.3.2 in the blueprint package.json to ensure find() Will be available in the upgrade project. It should be noted that this problem will not occur in newly created projects or projects without NPM or Yarn package lock files, because the version constraint ^4.1.1 will pull down 4.3.2 or newer versions.

Deprecated (1)

ember-cli-babel 5 (1 of 1)

This version of Ember CLI Deprecated ember-cli-babel 5.x. Babel 6 has been supported for a long time and it works well. Babel 5 support has been deprecated and is expected to be removed soon.


There are some other bug fixes in this release that are not included in this blog post.For more detailed information about the changes to Ember CLI 3.2.0 and detailed upgrade instructions, please check Ember CLI 3.2.0 release page.

Thank you till @rwjblue, @Turbo87, @ef4, @CodingItWrong, @kellyselden, @stefanpenner, @德纳切夫, with @twokul
Thank you for your excellent work on ember-cli!

For more details about the changes in Ember CLI 3.2 and detailed upgrade instructions, please check Ember CLI 3.2.0 release page.

thank you!

As an ambitious community-driven open source project, each of these releases reminds us that without your continued support, the Ember project is impossible to achieve. We are very grateful for the efforts of our contributors.

Leave a Reply

Your email address will not be published. Required fields are marked *