This week: Polyfilled ember-data packages syntax for all Ember apps 📦, use Figma with Storybook to make your developer life easier 🎨, QUnit DOM announces v1.0 release 🎂, and check out the ember-changeset 3.0.0 Release 🎉!
The ember-data packages API allows you to import objects and methods from smaller packages in the ember-data module following guidelines similar to the ones established in the Ember Modules RFC#176. With real and resolvable package paths, many developers can directly benefit from them with improved code reference information in their IDE. The ember-data packages API is available since ember-data 3.11.
There's nothing like a new, shiny API that makes your developer life easier. Even better if you can already use that API in your application without any upgrading! Users of ember-data with version 3.10 and below get to benefit from the new way of importing with the help of the ember-data packages polyfill!
The polyfill ensures that any instances of the Packages API import statements are transformed back to the legacy "DS" EmberData import syntax. You can opt-in to using the polyfill in your app, by upgrading your ember-cli-babel dependency to version 7.14 or higher for this new feature.
QUnit DOM provides readable assertions for QUnit and has been shipped with Ember since v3.1. If you haven't tried QUnit DOM yet, we recommend checking out its API to see how you can simplify your tests.
You can also try out a new assertion, hasProperty, to check for DOM properties. There can be subtle differences between hasAttribute (to check for HTML attributes) and hasProperty (for DOM properties):
// These two assertions are equivalent.
// These three assertions are equivalent.
.hasAttribute('class', 'btn btn-red')
.hasProperty('className', 'btn btn-red');
The ember-changeset addon officially released version 3.0.0. The addon provides a Changeset class that represents a set of valid changes for any Object (Ember.Object, DS.Model, POJOs, etc). The idea is only the changeset's internal values are updated until we invoke the save method which would set and save the valid changes onto the provided object.
This release requires Ember 3.13 and above and the use of @tracked will help ember-changeset monitor and propagate changes to the UI layer. If your app is < 3.13 or you need to support IE11, then you can install the 2.0 series. Watch a free video intro presented by EmberScreencasts and use ember-changeset today!