Skip to content

v4.3.0
Compare
Choose a tag to compare
@chasenlehara chasenlehara released this 06 Jul 05:20
· 1529 commits to master since this release
v4.3.0
95c46ab

Big changes

This release has three big things:

  • Improved compatibility with webpack
  • Components can be programmatically instantiated with new
  • Strict mode in modules

Improved compatibility with webpack

Most of the packages are compatible with the process.env.NODE_ENV checks that other bundlers (like webpack) use to remove code from production builds.

Find more information in this issue: Make CanJS compatible with how webpack strips out dev code.

Components can be programmatically instantiated with new

This release implements everything from the proposal to improve routing to components (and testing), including updates to can-component and can-stache, and a new can-value package.

can-component 4.2.0

In short, the can-component changes make it possible to create new component instances with new, without rendering the instances in a template. This is useful when you:

  • have complex logic for switching between different components (e.g. routing)
  • want to create components without adding them to the page (e.g. testing)

The following defines a MyGreeting component and creates a my-greeting element by calling new on the component’s constructor function:

const HelloWorld = Component.extend({
	tag: "hello-world",
	view: `
		<can-slot name="greetingTemplate" />
		<content>world</content>
		<ul>{{#each(items)}} {{this}} {{/each}}</ul>
	`,
	ViewModel: {
		items: {}
	}
});

// Create a new instance of our component
const componentInstance = new HelloWorld({

	// values with which to initialize the component’s view model
	viewModel: {
		items: ["eat"]
	},

	// can-stache template to replace any <content> elements in the component’s view
	content: "<em>{{message}}</em>",

	// <can-template> strings rendered by can-stache with the scope
	templates: {
		greetingTemplate: "{{greeting}}"
	},

	// scope with which to render the <content> and templates
	scope: {
		greeting: "Hello",
		message: "friend"
	}
});

myGreetingInstance.element; // is like <my-greeting>Hello <em>friend</em> <ul> <li>eat</li> </ul></my-greeting>

myGreetingInstance.viewModel; // is HelloWorld.ViewModel{items: ["eat"]}

Changing the component’s view model will cause its element and any bindings to be updated:

myGreetingInstance.viewModel.items.push("sleep");

myGreetingInstance.element; // is like <my-greeting>Hello <em>friend</em> <ul> <li>eat</li> <li>sleep</li> </ul></my-greeting>

can-stache 4.9.0

This release makes it possible to render component instances in a template with the “unescaped” (triple-curly) tags:

import Component from "can-component";
import stache from "can-stache";

const MyGreeting = Component.extend({
  tag: "my-greeting",
  view: "<p>Hello {{subject}}</p>",
  ViewModel: {
    subject: "string"
  }
});

const myGreetingInstance = new MyGreeting({
  viewModel: {
    subject: "friend"
  }
});

const template = stache("<div>{{{componentInstance}}}</div>");

const fragment = template({
  componentInstance: myGreetingInstance
});

fragment; //-> <div><my-greeting><p>Hello friend</p></my-greeting></div>

can-value 1.0

can-value makes it possible to create new observables:

  • from any object or primitive value
  • with the return value of a function (that updates when the observables inside it change)
  • bound to a specific key in another observable

Find examples in the docs for can-value and each of its methods: bind, from, returnedBy, to, and with.

Strict mode in modules

Almost every module now opts into strict mode with a "use strict" at the top of the file.

Updates to individual packages

can-ajax

can-assign

can-attribute-encoder

See canjs/can-attribute-encoder#21

can-attribute-observable

can-bind

can-component

can-compute

  • Unbinding temporary computes now uses (polyfilled) setImmediate instead of a 10ms timeout. This is to make dependent events happen in queue more consistently with mutation observer events (which also use setImmediate in vdom, and native immediate timeouts with real DOM).
  • COMPUTE.truthy now doesn't automatically evaluate functions if computes return them as values. This supports using "@" expressions (which do not evaluate a reference function to its returned value) with {{#if}} in can-stache.
  • Some external dev dependencies updated: testee and generator-donejs

Fixes an issue with canReflect.onValue

// oldVal was passed to the change event callback as expected
compute.on("change", function(newVal, oldVall) {
   // oldVal was being set correctly here
});

// but it was always undefined when using canReflect.onValue
canReflect.onValue(compute, function(newVal, oldVal) {
  // oldVal always `undefined`
});

canjs/can-compute#129

can-connect

This change migrates can-connect to being an infrastructure package. can-rest-model, can-rest-realtime-model, can-super-model and others will serve as the primary way in which users will use can-connect.

can-connect-feathers

can-construct

can-construct-super

canjs/can-construct-super#37

can-control

canjs/can-control#108

can-debug

canjs/can-debug#45

can-define

import {DefineMap, Reflect} from "can";

const Todo = DefineMap.extend("Todo",{
    id: {type: "number", identity: true},
    name: "string",
    complete: "boolean"
});

var todo = new Todo({id: 6, name: "mow lawn"});

Reflect.getIdentity(todo) //-> 6

can-define-backup

import DefineMap from "can-define/map/map";
import defineBackup from "can-define-backup";

const recipe = new DefineMap( "Recipe", {
    title: "Pancake Mix"
} );
defineBackup(recipe);

canjs/can-define-backup#12

can-define-lazy-value

can-define-stream

can-define-stream-kefir

can-define-validate-validatejs

can-deparam

canjs/can-deparam@v1.0.1...v1.0.2

can-dom-data

can-dom-data-state

canjs/can-dom-data-state@v0.1.0...v0.1.1

canjs/can-dom-data-state@v0.1.1...v0.2.0

can-dom-events

Fixes cur.matches is not a function error

See canjs/can-dom-events#41

Support Edge 14

Edge 14 has no support for Element.prototype.matches but it implements the same functionality as Element.prototype.msMatchesSelector.

can-dom-mutate

can-event-dom-enter

This should have been a minor. Will make a minor after verifying this works.

can-event-dom-radiochange

can-event-queue

Document @@can.getWhatIChange

This patch release includes documentation for the @@can.getWhatIChange symbol implemented on both value and map event bindings.

can-fixture

can-fixture-socket

can-globals

can-kefir

can-key

can-key-tree

can-list

can-log

canjs/can-log@v0.1.1...v0.1.2

can-map

🎉

var map = new Map({ 0: "zero" });
canReflect.getKeyValue(map, 0);

and

var map = new Map({ 0: "zero" });
map.attr({ 1: "one" }, "true");

canjs/can-map#97

can-map-define

can-ndjson-stream

can-observation

can-observation-recorder

  • start returns deps

can-observe

can-param

can-parse-uri

can-queues

can-reflect

can-reflect-dependencies

can-reflect-promise

can-route

import route from "can-route";

route.register("{page}");

route.data = new ViewModel();
route.start();

route.stop();
route.data = new OtherViewModel();
route.start();

can-route-pushstate

canjs/can-route-pushstate#86

Fixes bug with .currentRule() not being observable

See canjs/can-route-pushstate#91

import route from "can-route";
import RoutePushstate from "can-route-pushstate";

route.urlData = new RoutePushstate();
route.register("{page}");

can-set

  • can-set v1.4.0 - Algebra.has() does not check sorting nor pagination
    Previously can-set.Algebra.has() operated somewhat similarly to can-set.Algebra.subset() in that it had a special treatment for when a set had sorting and pagination together, to ensure that sorting/order was checked first. This didn't make sense in the case of has() since it checks instance properties instead of sets, and instances in general do not know their own positions in sorted queries nor do they contain sort information of their own.

This has been released as a minor revision instead of a patch: even though no changes in the can-set tests nor documentation were necessary, we cannot guarantee that it won't break users' code relying on Algebra.has().

  • can-set v1.5.0 - Fix issues with Algebra.prototype.difference()
    This release includes PR #82, which improved the difference() function for set.Algebra -- some differences involving paging were incorrect, now fixed, and differences involving ID fields are now supported as well. Also, undefined is no longer returned; the function now agrees with its documentation and returns false when A - B = A or A - B = ∅ (for sets A and B).

In addition, the documentation for union() in set.Algebra was updated to reflect the actual return value: false if the union cannot be expressed as a Set.

and these two sets:
{ type: 'a' }
{ area: 'x' }

And these two lists related to the respective sets:
[{ id: 1, type: 'a' area: 'x' }, { id: 2, type: 'a', area: 'y' }]
[{ id: 1, type: 'a' area: 'x' }, { id: 3, type: 'b', area: 'x' }]

Previously, the result of getUnion() would return a simple concatenation of these two lists:
[{ id: 1, type: 'a' area: 'x' }, { id: 2, type: 'a', area: 'y' }, { id: 1, type: 'a' area: 'x' }, { id: 3, type: 'b', area: 'x' }]

This is suboptimal in cases like in can-connect's cache-requests behavior, where the union of several sets may be used to build a query response for yet a different set. Each item should be represented at most once when creating the union. With this release, items in both aItems and bItems are removed from the bItems before concatenating into a union result. The example above becomes:

[{ id: 1, type: 'a' area: 'x' }, { id: 2, type: 'a', area: 'y' }, { id: 3, type: 'b', area: 'x' }]

Note: this doesn't remove all duplicates, just removes duplicates from bItems that are already in aItems -- if aItems already has a duplicate, or bItems has a duplicate not in aItems, it will be preserved.

can-simple-dom

can-simple-map

can-simple-observable

can-stache

can-stache-bindings

can-stache-converters

can-stache-key

canjs/can-stache-key@27fbfc5

canjs/can-stache-key#32

can-stache-route-helpers

can-stream

can-stream-kefir

can-symbol

add patches signal that a key was added to an object.

{type: "add", key: "b", value: 1}

delete patches signal that a key was deleted from an object.

{type: "delete", key: "a"}

set patches signal that an existing key's value was set to another value.

{type: "set", key: "c", value: 2}

splice patches signal a list-like object had enumerable values added, removed
or both at a specific index.

{type: "splice", index: 0, deleteCount: 10, insert: [item1, item2]}

move patches signal a list-like object had an enumerable value move from one
position to another.

{type: "move",   fromIndex: 1, toIndex: 2}

values patches signal a container-like object (like Set) has
had items added or removed.

{type: "values", delete: [item0], insert: [item1, item2]}

can-types

can-util

can-validate

  • can-validate v1.1.2 - 1.1.2
    This patch release includes several small changes to can-validate internals, namely:

  • Remove unused import

  • Use can-reflect instead of can-util

  • Fix jshint setup (it needed a config file)

  • Use bit-docs 0.0.8 (instead of the prerelease)

✌️

  • can-validate v1.1.3 - 1.1.3
    In the previous release, can-reflect/eachIndex was introduced to replace can-util/each. Unfortunately can-reflect/eachIndex throws when passed an undefined/null reference.

This patch release adds a conditional to prevent can-validate to throw.

can-validate-interface

can-validate-legacy

can-validate-validatejs

can-value

can-vdom

can-view-autorender

canjs/can-view-autorender@v3.1.2...v3.1.3

canjs/can-view-autorender@v3.1.3...v3.1.4

can-view-callbacks

can-view-import

can-view-live

for faster performance

can-view-model

can-view-nodelist

canjs/can-view-nodelist@ee27a53

can-view-parser

With this release, the above parses correctly, with 3 > 2 being parsed as the value of the data-value attribute and the tag ending after the attribute value ends.

can-view-scope

var VM = DefineMap.extend({
  foo: "string"
});
var vm = new VM();
var scope = new Scope(vm);
scope.read("foo").parentHasKey; // -> true

This also makes it so that getPathsForKey will return back paths where the key returns a function.

canjs/can-view-scope#172.

can-view-target

can-zone

  • can-zone v0.6.16 - 0.6.16
    This patch release moves debug-on-timeout in the can-zone/debug plugin to occur when the asynchronous function is called, rather than when the callback is called. This makes it easier to look back in the call stack and figure out why the asynchronous code is still running after a timeout is complete.
  • can-zone v0.6.17 - 0.6.17

Wrap event handlers set with .on[event] = handler syntax.

This patch release makes it so can-zone wraps event handlers like the following:

var div = document.createElement("div");

// handleClick should run within the current zone now.
div.onclick = function handleClick() {
};

react-view-model

donejs:canjs chasen$

Assets 2
Loading