Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@glimmer/tracking

glimmerjs551.5kMIT1.1.2TypeScript support: included

Glimmer property tracking library

ember-addon

readme

Glimmer.js

Welcome to Glimmer.js! Glimmer.js is actually a made up of lots of small packages, so this meta-repo exists to help you find what you're looking for.

Resources

Packages

Glimmer.js is the developer-facing API on top of the low-level Glimmer VM.

User-Facing

These packages are imported and used by Glimmer developers directly.

Internals

These packages are used internally by Glimmer but may be useful for more advanced users.

  • @glimmer/di - lightweight dependency injection library used by @glimmer/application
  • @glimmer/resolver - resolver used by @glimmer/application to look up component modules

Build Tooling

These packages are used for building Glimmer apps, and aren't intended to run in the user's browser.

Tests

Type Tests

The following packages are committed to maintaining stable Typescript types in addition to their JavaScript API:

  • @glimmer/component
  • @glimmer/tracking

Any changes to their types, including changes caused by upgrading the Typescript compiler, are covered under SemVer for these packages (e.g. breaking changes to types will require a new major version).

In order to ensure we aren't making changes to types unintentionally, we have a set of tests for their public APIs in /test/types. These can be run with:

yarn build
yarn test:types

In general, any new additions to the public types should be a new minor version, and removals of public APIs or changes to the versions of TS that are supported should be a major version. Corrections to existing types that are not breaking (e.g. strictly equal to or wider than the current type) can be released in patch versions.

To add a new API:

  1. Add it to any hasExactKeys statements that assert on the keys of a public value/type
  2. Add an $ExpectType test for the new API to ensure it has the correct type.

To remove an API:

  1. Remove it from any hasExactKeys statements
  2. Remove any $ExpectType tests related to it

Symbols

Symbols are often used for internal state that is only accessible within a framework. We use a few symbols internally in these packages, and because of this they appear in the public type signatures, and assertions. However, unless the symbol itself is part of the public JS API of the package, these properties are inacessible to users, and thus they are not part of public API, and any changes can be made and released in a patch release.

changelog

Changelog

v1.0.3 (2020-12-10)

:bug: Bug Fix

  • @glimmer/component
    • #321 Ensure stability of destroyable APIs in Ember 3.22+. (@rwjblue)

Committers: 1

v1.0.2 (2020-09-18)

:bug: Bug Fix

  • @glimmer/tracking
    • #306 Make @glimmer/tracking an ember-cli addon for Ember apps. (@rwjblue)

Committers: 1

v1.0.1 (2020-07-27)

:bug: Bug Fix

  • @glimmer/component
    • #293 Leverage built-in destroyables on Ember 3.20+ to avoid deprecations. (@rwjblue)

:house: Internal

  • @glimmer/component
    • #291 Add Ember 3.8, 3.12, 3.16, and 3.20 to @glimmer/component CI.. (@rwjblue)

Committers: 1

v1.0.0-beta.2 (2019-11-15)

:rocket: Enhancement

  • @glimmer/component
    • #224 [REFACTOR] Removes deprecations and adds usage error messages. (@pzuraq)
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr, @glimmer/tracking
    • #223 Update to Glimmer VM 0.44.0 and migrate tracked implementation to leverage @glimmer/validator. (@pzuraq)

:bug: Bug Fix

  • @glimmer/component
    • #225 Removes blueprints from @glimmer/component. (@pzuraq)

Committers: 1

v1.0.0-beta.1 (2019-10-23)

:boom: Breaking Change

  • @glimmer/application, @glimmer/component, @glimmer/tracking

:rocket: Enhancement

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/blueprint, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr, @glimmer/tracking
    • #214 Implement Ember-compatible Custom Component Manager API. (@tomdale)
  • @glimmer/application, @glimmer/component, @glimmer/tracking

:bug: Bug Fix

  • @glimmer/component
    • #217 Moves @glimmer/tracking to devDependencies. (@pzuraq)

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr, @glimmer/tracking

Committers: 2

v0.14.0-alpha.12 (2019-08-16)

:rocket: Enhancement

  • @glimmer/component
    • #204 Adding back didUpdate hook to glimmer.js component-manager. (@chiragpat)
      • This change also fixes compatibility with Ember 3.13 beta.

Committers: 2

v0.14.0-alpha.11 (2019-08-10)

:rocket: Enhancement

  • @glimmer/tracking

Committers: 1

v0.14.0-alpha.10 (2019-08-08)

:bug: Bug Fix

  • @glimmer/component
    • #201 Update the assignment of this.args to reflect the arg proxy. (@pzuraq)

Committers: 1

v0.14.0-alpha.9 (2019-07-11)

:rocket: Enhancement

  • @glimmer/application-test-helpers, @glimmer/ssr
    • #199 Modify SSRApplication.renderToString to accept a custom Serializer. (@SinS3i)

Committers: 1

v0.14.0-alpha.8 (2019-06-24)

:bug: Bug Fix

  • @glimmer/ssr
    • #197 Handle non-primitive values passed as args in SSR. (@tomdale)

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr, @glimmer/tracking

Committers: 1

v0.14.0-alpha.7 (2019-05-16)

  • Re-release of v0.14.0-alpha.6 due to a problem with published artifacts.

v0.14.0-alpha.6 (2019-05-15)

:rocket: Enhancement

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/ssr
    • #191 Adding support to pass in a dynamic scope into the ssr glimmer app. (@chiragpat)

Committers: 1

v0.14.0-alpha.5 (2019-05-03)

:rocket: Enhancement

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/ssr, @glimmer/test-utils
  • @glimmer/component

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr, @glimmer/tracking

Committers: 6

v0.14.0-alpha.4 (2019-03-18)

:rocket: Enhancement

  • @glimmer/component
    • #178 [BUGFIX] Freeze args when updating in DEBUG. (@pzuraq)

:bug: Bug Fix

  • @glimmer/component
    • #180 [BUGFIX] Fixes args tracking in Glimmer component. (@pzuraq)

Committers: 1

v0.13.0 (2018-11-05)

:boom: Breaking Change

  • @glimmer/blueprint

:rocket: Enhancement

  • @glimmer/blueprint
  • @glimmer/application, @glimmer/component

:bug: Bug Fix

  • @glimmer/application
    • #134 await for rerender to finish before changing rendering flag. (@lifeart)
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component

Committers: 4

v0.11.1 (2018-09-20)

:rocket: Enhancement

  • @glimmer/component

:bug: Bug Fix

:warning: Deprecation

  • @glimmer/component
    • #141 Add deprecation warning for tracked property dependent keys. (@smfoote)

Committers: 3

v0.9.1 (2018-02-15)

:house: Internal

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates
    • #113 Include handle in bytecode data segment metadata. (@tomdale)

Committers: 1

v0.9.0 (2018-02-08)

Glimmer.js v0.9.0 is a big infrastructural upgrade that lays the groundwork for some exciting new features.

The biggest change in 0.9.0 is that we've broken apart the monolithic Application class into composable objects to change how Glimmer.js behaves:

  1. A Renderer controls how Glimmer performs the initial render.
  2. A Loader controls how Glimmer loads and compiles templates.
  3. A Builder controls how DOM elements are constructed when templates are rendered.

One benefit of this design is that we can add different modes to Glimmer without having to ship code for unused modes. For more discussion, see #34: Separate Application responsibilities.

Out of the box, you can experiment with incremental rendering in your Glimmer.js app using the new AsyncRenderer. This renderer breaks initial rendering into small, discrete units of work. Each unit of work is scheduled using the browser's requestIdleCallback API, ensuring the browser stays responsive even on slower devices and complex pages.

We will also be adding binary bytecode templates and server-side rendering with rehydration in a future release. The implementation for these features are in the 0.9.0 release, but not yet integrated into the default application produced by the blueprint.

To upgrade existing Glimmer.js applications, you will need to update the src/main.ts file to specify the renderer, loader and builder to use. To preserve the rendering behavior of Glimmer.js 0.8.0, use the DOMRenderer, RuntimeCompilerLoader, and SyncRenderer:

// src/main.ts
import Application, { DOMBuilder, RuntimeCompilerLoader, SyncRenderer } from '@glimmer/application';
import Resolver, { BasicModuleRegistry } from '@glimmer/resolver';
import moduleMap from '../config/module-map';
import resolverConfiguration from '../config/resolver-configuration';

export default class App extends Application {
  constructor() {
    let moduleRegistry = new BasicModuleRegistry(moduleMap);
    let resolver = new Resolver(resolverConfiguration, moduleRegistry);
    const element = document.body;

    super({
      builder: new DOMBuilder({ element, nextSibling: null }),
      loader: new RuntimeCompilerLoader(resolver),
      renderer: new SyncRenderer(),
      resolver,
      rootName: resolverConfiguration.app.rootName,
    });
  }
}

v0.9.0-alpha.14 (2018-02-08)

:rocket: Enhancement

:memo: Documentation

  • @glimmer/application
  • @glimmer/component
    • #53 Update and improve Component documentation. (@locks)

:house: Internal

  • @glimmer/blueprint
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr
  • @glimmer/app-compiler

Committers: 4

v0.9.0-alpha.13 (2017-12-09)

:rocket: Enhancement

  • @glimmer/application-test-helpers, @glimmer/application
  • @glimmer/blueprint
    • #87 Import @glimmer/blueprint into monorepo. (@Turbo87)

:bug: Bug Fix

  • @glimmer/application
    • #95 Use Glimmer.js version of UpdatableReference to avoid action volatility. (@tomdale)

Committers: 3

v0.9.0-alpha.12 (2017-11-28)

:bug: Bug Fix

  • @glimmer/application, @glimmer/compiler-delegates

Committers: 1

v0.9.0-alpha.10 (2017-11-28)

:rocket: Enhancement

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr
  • @glimmer/application-test-helpers, @glimmer/component
    • #85 Remove unused/duplicate dev dependencies. (@Turbo87)
  • Other
  • @glimmer/app-compiler
    • #82 app-compiler: Remove unnecessary co dependency. (@Turbo87)
  • @glimmer/app-compiler, @glimmer/compiler-delegates
    • #81 Replace deprecated qunitjs dependency with qunit. (@Turbo87)

Committers: 2

v0.9.0-alpha.9 (2017-11-16)

:rocket: Enhancement

  • @glimmer/application

Committers: 1

v0.9.0-alpha.8 (2017-11-15)

:bug: Bug Fix

  • @glimmer/compiler-delegates
    • #74 BUGFIX: Builtin helpers and app helpers serialization. (@chadhietala)

Committers: 1

v0.9.0-alpha.7 (2017-11-15)

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates

Committers: 1

v0.9.0-alpha.6 (2017-11-13)

:bug: Bug Fix

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates

Committers: 1

v0.9.0-alpha.5 (2017-11-09)

:rocket: Enhancement

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr

:house: Internal

  • @glimmer/application
  • @glimmer/compiler-delegates
  • @glimmer/app-compiler, @glimmer/compiler-delegates

Committers: 4

v0.9.0-alpha.4 (2017-10-30)

:rocket: Enhancement

  • @glimmer/app-compiler, @glimmer/application, @glimmer/compiler-delegates

Committers: 1

v0.9.0-alpha.3 (2017-10-30)

:house: Internal

Committers: 1

v0.9.0-alpha.2 (2017-10-30)

:rocket: Enhancement

  • @glimmer/application, @glimmer/component
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/test-utils
  • @glimmer/application, @glimmer/ssr
  • @glimmer/app-compiler, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component
  • @glimmer/application
    • #34 Separate Application responsibilities. (@tomdale)
  • @glimmer/compiler-delegates

:bug: Bug Fix

  • @glimmer/app-compiler, @glimmer/compiler-delegates

:house: Internal

  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/ssr
  • @glimmer/app-compiler, @glimmer/application-test-helpers, @glimmer/application, @glimmer/compiler-delegates, @glimmer/component, @glimmer/test-utils

v0.8.0 (2017-10-22)

We've got some big changes in v0.8.0 of Glimmer.js! The most notable change is that we have migrated from dasherized components (x-profile) to capitalized components (Profile). Multi-word components should be capitalized too, so user-profile becomes UserProfile.

To upgrade existing Glimmer.js applications to 0.8.0, perform the following steps:

  1. Modify your application's package.json:
    1. @glimmer/application should be ^0.8.0.
    2. @glimmer/component should be ^0.8.0 (you may need to add this dependency).
  2. Rename component files from dasherized to CapitalCase. For example, the src/ui/components/user-profile directory should be renamed to src/ui/components/UserProfile.
  3. Change all component invocations from dasherized to CapitalCase. For example, change <user-profile @user={{user}} /> to <UserProfile @user={{user}} />.

These are all of the changes that should be necessary to migrate an existing app.

We've also introduced a new feature that makes it easier to take control of HTML attributes. In 0.8.0, you can add ...attributes to an element in a component's template, and any attributes passed to the component will be applied to that element.

For example, imagine you have a ProfileImage component whose template contains an img tag. You want anyone using this component to be able to treat it just like an img element, including being able to set standard HTML attributes on it. We'll add ...attributes to the target element, like this:

{{! src/ui/components/ProfileImage/template.hbs }}
<img ...attributes>

Now when invoking the component, any HTML attributes (i.e. anything without a @ prefix) will be transferred to the element with ...attributes on it:

{{! src/ui/components/Main/template.hbs }}
<ProfileImage
  @isAdmin={{isAdmin}} {{! not an attribute! }}
  src={{user.imageUrl}}
  role="complementary"
  data-is-awesome="yes-is-awesome"
  />

The final DOM will look something like this:

<img
  src="/images/profiles/chad.jpg"
  role="complementary"
  data-is-awesome="yes-is-awesome">

For more information on these and other changes in Glimmer.js, make sure to read the Glimmer.js Progress Report blog post.

Note that 0.8.0 lays the foundation for compiling to binary bytecode, but does not yet enable it. Expect this functionality to be enabled in a future release, now that the requisite version of the underlying Glimmer compiler and VM have been upgraded.

:bug: Bug Fix

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component
    • #26 Fix incompatibility with {{each}} and frozen objects. (@tomdale)

:house: Internal

  • Other
  • @glimmer/application, @glimmer/component
    • #30 Support running tests in the browser, Node, or both. (@tomdale)
  • @glimmer/application, @glimmer/component, @glimmer/local-debug-flags
    • #29 Run tests in production and development modes. (@tomdale)

Committers: 2

v0.8.0-alpha.10 (2017-10-17)

:house: Internal

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/test-utils

Committers: 1

v0.8.0-alpha.9 (2017-10-12)

:bug: Bug Fix

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/test-utils
    • #23 Fix dependencies and add failing tests for block params and user helpers. (@chadhietala)

:house: Internal

  • #15 Use yarn to install package dependencies. (@tomdale)

Committers: 2

v0.8.0-alpha.8 (2017-10-06)

:bug: Bug Fix

  • #21 Bump @glimmer/compiler dependency to 0.29.3. (@tomdale)

Committers: 1

v0.8.0-alpha.7 (2017-09-29)

:rocket: Enhancement

  • @glimmer/application

Committers: 1

v0.8.0-alpha.6 (2017-09-28)

:rocket: Enhancement

  • @glimmer/component

Committers: 1

v0.8.0-alpha.5 (2017-09-26)

:bug: Bug Fix

  • @glimmer/application

Committers: 1

v0.8.0-alpha.2 (2017-09-26)

:bug: Bug Fix

  • @glimmer/component
    • #16 Break RuntimeResolver circular dependency. (@tomdale)

Committers: 1

v0.8.0-alpha.1 (2017-10-17)

:rocket: Enhancement

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component
  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/test-utils

:memo: Documentation

:house: Internal

  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/test-utils
  • @glimmer/application-test-helpers, @glimmer/application, @glimmer/component, @glimmer/local-debug-flags, @glimmer/test-utils
    • #3 [Monorepo] Adopt @glimmer/component and @glimmer/application. (@tomdale)

Committers: 3