diff --git a/src/generators/Generator.ts b/src/generators/Generator.ts index 1f48424c95..35bb2e9859 100644 --- a/src/generators/Generator.ts +++ b/src/generators/Generator.ts @@ -626,6 +626,10 @@ export default class Generator { addDeclaration('store', templateProperties.store.value); } + if (templateProperties.immutable) { + addDeclaration('immutable', templateProperties.immutable.value); + } + if (templateProperties.tag) { this.tag = templateProperties.tag.value.value; } diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 08bdf0012f..5f91cb5123 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -123,7 +123,7 @@ export default function dom( const condition = `${deps.map(dep => `changed.${dep}`).join(' || ')}`; - const statement = `if (@differs(state.${key}, (state.${key} = %computed-${key}(${deps + const statement = `if (this._differs(state.${key}, (state.${key} = %computed-${key}(${deps .map(dep => `state.${dep}`) .join(', ')})))) changed.${key} = true;`; @@ -208,6 +208,10 @@ export default function dom( ${options.dev && !generator.customElement && `if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option");`} @init(this, options); + ${options.immutable && deindent` + if (options.immutable !== undefined ? options.immutable : ${templateProperties.immutable && '%immutable' || 'this.root.options.immutable'}) { + this._differs = @differsImmutable; + }`} ${templateProperties.store && `this.store = %store();`} ${generator.usesRefs && `this.refs = {};`} this._state = @assign(${initialState.join(', ')}); diff --git a/src/interfaces.ts b/src/interfaces.ts index 9773d330d3..82de8cd047 100644 --- a/src/interfaces.ts +++ b/src/interfaces.ts @@ -52,6 +52,7 @@ export interface CompileOptions { cssOutputFilename?: string; dev?: boolean; + immutable?: boolean; shared?: boolean | string; cascade?: boolean; hydratable?: boolean; diff --git a/src/shared/index.js b/src/shared/index.js index ef160ebf07..8996ee378a 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -26,7 +26,11 @@ export function destroyDev(detach) { } export function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); +} + +export function differsImmutable(a, b) { + return a != a ? b == b : a !== b; } export function dispatchObservers(component, group, changed, newState, oldState) { @@ -68,6 +72,7 @@ export function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -150,7 +155,7 @@ export function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/src/validate/js/propValidators/immutable.ts b/src/validate/js/propValidators/immutable.ts new file mode 100644 index 0000000000..b54521d9e4 --- /dev/null +++ b/src/validate/js/propValidators/immutable.ts @@ -0,0 +1,11 @@ +import { Validator } from '../../'; +import { Node } from '../../../interfaces'; + +export default function immutable(validator: Validator, prop: Node) { + if (prop.value.type !== 'Literal' || typeof prop.value.value !== 'boolean') { + validator.error( + `'immutable' must be a boolean literal`, + prop.value.start + ); + } +} diff --git a/src/validate/js/propValidators/index.ts b/src/validate/js/propValidators/index.ts index 942c757601..05819b0837 100644 --- a/src/validate/js/propValidators/index.ts +++ b/src/validate/js/propValidators/index.ts @@ -15,6 +15,7 @@ import tag from './tag'; import transitions from './transitions'; import setup from './setup'; import store from './store'; +import immutable from './immutable'; export default { data, @@ -34,4 +35,5 @@ export default { transitions, setup, store, + immutable, }; diff --git a/store.js b/store.js index f31c659080..853d36a52a 100644 --- a/store.js +++ b/store.js @@ -2,12 +2,13 @@ import { assign, blankObject, differs, + differsImmutable, dispatchObservers, get, observe } from './shared.js'; -function Store(state) { +function Store(state, options) { this._observers = { pre: blankObject(), post: blankObject() }; this._changeHandlers = []; this._dependents = []; @@ -16,6 +17,7 @@ function Store(state) { this._sortedComputedProperties = []; this._state = assign({}, state); + this._differs = options && options.immutable ? differsImmutable : differs; } assign(Store.prototype, { @@ -88,7 +90,7 @@ assign(Store.prototype, { if (dirty) { var newValue = fn.apply(null, values); - if (differs(newValue, value)) { + if (store._differs(newValue, value)) { value = newValue; changed[key] = true; state[key] = value; @@ -124,7 +126,7 @@ assign(Store.prototype, { for (var key in newState) { if (this._computed[key]) throw new Error("'" + key + "' is a read-only property"); - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/collapses-text-around-comments/expected-bundle.js b/test/js/samples/collapses-text-around-comments/expected-bundle.js index 59cd2de125..72b12b5ef4 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -52,7 +52,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -94,6 +94,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -151,7 +152,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/component-static-immutable/_config.js b/test/js/samples/component-static-immutable/_config.js new file mode 100644 index 0000000000..06713941e0 --- /dev/null +++ b/test/js/samples/component-static-immutable/_config.js @@ -0,0 +1,5 @@ +export default { + options: { + immutable: true + } +}; \ No newline at end of file diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js new file mode 100644 index 0000000000..500322d902 --- /dev/null +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -0,0 +1,238 @@ +function noop() {} + +function assign(target) { + var k, + source, + i = 1, + len = arguments.length; + for (; i < len; i++) { + source = arguments[i]; + for (k in source) target[k] = source[k]; + } + + return target; +} + +function blankObject() { + return Object.create(null); +} + +function destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; + + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; +} + +function differs(a, b) { + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); +} + +function differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function dispatchObservers(component, group, changed, newState, oldState) { + for (var key in group) { + if (!changed[key]) continue; + + var newValue = newState[key]; + var oldValue = oldState[key]; + + var callbacks = group[key]; + if (!callbacks) continue; + + for (var i = 0; i < callbacks.length; i += 1) { + var callback = callbacks[i]; + if (callback.__calling) continue; + + callback.__calling = true; + callback.call(component, newValue, oldValue); + callback.__calling = false; + } + } +} + +function fire(eventName, data) { + var handlers = + eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (var i = 0; i < handlers.length; i += 1) { + handlers[i].call(this, data); + } +} + +function get(key) { + return key ? this._state[key] : this._state; +} + +function init(component, options) { + component._observers = { pre: blankObject(), post: blankObject() }; + component._handlers = blankObject(); + component._bind = options._bind; + component._differs = differs; + + component.options = options; + component.root = options.root || component; + component.store = component.root.store || options.store; +} + +function observe(key, callback, options) { + var group = options && options.defer + ? this._observers.post + : this._observers.pre; + + (group[key] || (group[key] = [])).push(callback); + + if (!options || options.init !== false) { + callback.__calling = true; + callback.call(this, this._state[key]); + callback.__calling = false; + } + + return { + cancel: function() { + var index = group[key].indexOf(callback); + if (~index) group[key].splice(index, 1); + } + }; +} + +function on(eventName, handler) { + if (eventName === 'teardown') return this.on('destroy', handler); + + var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + var index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; +} + +function set(newState) { + this._set(assign({}, newState)); + if (this.root._lock) return; + this.root._lock = true; + callAll(this.root._beforecreate); + callAll(this.root._oncreate); + callAll(this.root._aftercreate); + this.root._lock = false; +} + +function _set(newState) { + var oldState = this._state, + changed = {}, + dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + } + if (!dirty) return; + + this._state = assign({}, oldState, newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this._fragment.p(changed, this._state); + dispatchObservers(this, this._observers.post, changed, this._state, oldState); + } +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +function _mount(target, anchor) { + this._fragment.m(target, anchor); +} + +function _unmount() { + if (this._fragment) this._fragment.u(); +} + +var proto = { + destroy: destroy, + get: get, + fire: fire, + observe: observe, + on: on, + set: set, + teardown: destroy, + _recompute: noop, + _set: _set, + _mount: _mount, + _unmount: _unmount +}; + +/* generated by Svelte vX.Y.Z */ +var Nested = window.Nested; + +var immutable = true; + +function create_main_fragment(state, component) { + + var nested = new Nested({ + root: component.root, + data: { foo: "bar" } + }); + + return { + c: function create() { + nested._fragment.c(); + }, + + m: function mount(target, anchor) { + nested._mount(target, anchor); + }, + + p: noop, + + u: function unmount() { + nested._unmount(); + }, + + d: function destroy$$1() { + nested.destroy(false); + } + }; +} + +function SvelteComponent(options) { + init(this, options); + if (options.immutable !== undefined ? options.immutable : immutable) { + this._differs = differsImmutable; + } + this._state = assign({}, options.data); + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this._fragment = create_main_fragment(this._state, this); + + if (options.target) { + this._fragment.c(); + this._fragment.m(options.target, options.anchor || null); + + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } +} + +assign(SvelteComponent.prototype, proto); + +export default SvelteComponent; diff --git a/test/js/samples/component-static-immutable/expected.js b/test/js/samples/component-static-immutable/expected.js new file mode 100644 index 0000000000..811d5c50c4 --- /dev/null +++ b/test/js/samples/component-static-immutable/expected.js @@ -0,0 +1,64 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, callAll, differsImmutable, init, noop, proto } from "svelte/shared.js"; + +var Nested = window.Nested; + +var immutable = true; + +function create_main_fragment(state, component) { + + var nested = new Nested({ + root: component.root, + data: { foo: "bar" } + }); + + return { + c: function create() { + nested._fragment.c(); + }, + + m: function mount(target, anchor) { + nested._mount(target, anchor); + }, + + p: noop, + + u: function unmount() { + nested._unmount(); + }, + + d: function destroy() { + nested.destroy(false); + } + }; +} + +function SvelteComponent(options) { + init(this, options); + if (options.immutable !== undefined ? options.immutable : immutable) { + this._differs = differsImmutable; + } + this._state = assign({}, options.data); + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this._fragment = create_main_fragment(this._state, this); + + if (options.target) { + this._fragment.c(); + this._fragment.m(options.target, options.anchor || null); + + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/component-static-immutable/input.html b/test/js/samples/component-static-immutable/input.html new file mode 100644 index 0000000000..df6c82ea81 --- /dev/null +++ b/test/js/samples/component-static-immutable/input.html @@ -0,0 +1,10 @@ + + + \ No newline at end of file diff --git a/test/js/samples/component-static-immutable2/_config.js b/test/js/samples/component-static-immutable2/_config.js new file mode 100644 index 0000000000..06713941e0 --- /dev/null +++ b/test/js/samples/component-static-immutable2/_config.js @@ -0,0 +1,5 @@ +export default { + options: { + immutable: true + } +}; \ No newline at end of file diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js new file mode 100644 index 0000000000..abab18060b --- /dev/null +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -0,0 +1,236 @@ +function noop() {} + +function assign(target) { + var k, + source, + i = 1, + len = arguments.length; + for (; i < len; i++) { + source = arguments[i]; + for (k in source) target[k] = source[k]; + } + + return target; +} + +function blankObject() { + return Object.create(null); +} + +function destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; + + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; +} + +function differs(a, b) { + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); +} + +function differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function dispatchObservers(component, group, changed, newState, oldState) { + for (var key in group) { + if (!changed[key]) continue; + + var newValue = newState[key]; + var oldValue = oldState[key]; + + var callbacks = group[key]; + if (!callbacks) continue; + + for (var i = 0; i < callbacks.length; i += 1) { + var callback = callbacks[i]; + if (callback.__calling) continue; + + callback.__calling = true; + callback.call(component, newValue, oldValue); + callback.__calling = false; + } + } +} + +function fire(eventName, data) { + var handlers = + eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (var i = 0; i < handlers.length; i += 1) { + handlers[i].call(this, data); + } +} + +function get(key) { + return key ? this._state[key] : this._state; +} + +function init(component, options) { + component._observers = { pre: blankObject(), post: blankObject() }; + component._handlers = blankObject(); + component._bind = options._bind; + component._differs = differs; + + component.options = options; + component.root = options.root || component; + component.store = component.root.store || options.store; +} + +function observe(key, callback, options) { + var group = options && options.defer + ? this._observers.post + : this._observers.pre; + + (group[key] || (group[key] = [])).push(callback); + + if (!options || options.init !== false) { + callback.__calling = true; + callback.call(this, this._state[key]); + callback.__calling = false; + } + + return { + cancel: function() { + var index = group[key].indexOf(callback); + if (~index) group[key].splice(index, 1); + } + }; +} + +function on(eventName, handler) { + if (eventName === 'teardown') return this.on('destroy', handler); + + var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + var index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; +} + +function set(newState) { + this._set(assign({}, newState)); + if (this.root._lock) return; + this.root._lock = true; + callAll(this.root._beforecreate); + callAll(this.root._oncreate); + callAll(this.root._aftercreate); + this.root._lock = false; +} + +function _set(newState) { + var oldState = this._state, + changed = {}, + dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + } + if (!dirty) return; + + this._state = assign({}, oldState, newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this._fragment.p(changed, this._state); + dispatchObservers(this, this._observers.post, changed, this._state, oldState); + } +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +function _mount(target, anchor) { + this._fragment.m(target, anchor); +} + +function _unmount() { + if (this._fragment) this._fragment.u(); +} + +var proto = { + destroy: destroy, + get: get, + fire: fire, + observe: observe, + on: on, + set: set, + teardown: destroy, + _recompute: noop, + _set: _set, + _mount: _mount, + _unmount: _unmount +}; + +/* generated by Svelte vX.Y.Z */ +var Nested = window.Nested; + +function create_main_fragment(state, component) { + + var nested = new Nested({ + root: component.root, + data: { foo: "bar" } + }); + + return { + c: function create() { + nested._fragment.c(); + }, + + m: function mount(target, anchor) { + nested._mount(target, anchor); + }, + + p: noop, + + u: function unmount() { + nested._unmount(); + }, + + d: function destroy$$1() { + nested.destroy(false); + } + }; +} + +function SvelteComponent(options) { + init(this, options); + if (options.immutable !== undefined ? options.immutable : this.root.options.immutable) { + this._differs = differsImmutable; + } + this._state = assign({}, options.data); + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this._fragment = create_main_fragment(this._state, this); + + if (options.target) { + this._fragment.c(); + this._fragment.m(options.target, options.anchor || null); + + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } +} + +assign(SvelteComponent.prototype, proto); + +export default SvelteComponent; diff --git a/test/js/samples/component-static-immutable2/expected.js b/test/js/samples/component-static-immutable2/expected.js new file mode 100644 index 0000000000..96dcb16874 --- /dev/null +++ b/test/js/samples/component-static-immutable2/expected.js @@ -0,0 +1,62 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, callAll, differsImmutable, init, noop, proto } from "svelte/shared.js"; + +var Nested = window.Nested; + +function create_main_fragment(state, component) { + + var nested = new Nested({ + root: component.root, + data: { foo: "bar" } + }); + + return { + c: function create() { + nested._fragment.c(); + }, + + m: function mount(target, anchor) { + nested._mount(target, anchor); + }, + + p: noop, + + u: function unmount() { + nested._unmount(); + }, + + d: function destroy() { + nested.destroy(false); + } + }; +} + +function SvelteComponent(options) { + init(this, options); + if (options.immutable !== undefined ? options.immutable : this.root.options.immutable) { + this._differs = differsImmutable; + } + this._state = assign({}, options.data); + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this._fragment = create_main_fragment(this._state, this); + + if (options.target) { + this._fragment.c(); + this._fragment.m(options.target, options.anchor || null); + + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/component-static-immutable2/input.html b/test/js/samples/component-static-immutable2/input.html new file mode 100644 index 0000000000..44a2bf2bc1 --- /dev/null +++ b/test/js/samples/component-static-immutable2/input.html @@ -0,0 +1,9 @@ + + + \ No newline at end of file diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index 708ef5be95..b89784944c 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index b39f95a77b..b88fbb5e47 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; @@ -209,8 +210,8 @@ assign(SvelteComponent.prototype, proto); SvelteComponent.prototype._recompute = function _recompute(changed, state) { if (changed.x) { - if (differs(state.a, (state.a = a(state.x)))) changed.a = true; - if (differs(state.b, (state.b = b(state.x)))) changed.b = true; + if (this._differs(state.a, (state.a = a(state.x)))) changed.a = true; + if (this._differs(state.b, (state.b = b(state.x)))) changed.b = true; } }; diff --git a/test/js/samples/computed-collapsed-if/expected.js b/test/js/samples/computed-collapsed-if/expected.js index c2f5e3c2be..085365f4c5 100644 --- a/test/js/samples/computed-collapsed-if/expected.js +++ b/test/js/samples/computed-collapsed-if/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, differs, init, noop, proto } from "svelte/shared.js"; +import { assign, init, noop, proto } from "svelte/shared.js"; function a(x) { return x * 2; @@ -41,8 +41,8 @@ assign(SvelteComponent.prototype, proto); SvelteComponent.prototype._recompute = function _recompute(changed, state) { if (changed.x) { - if (differs(state.a, (state.a = a(state.x)))) changed.a = true; - if (differs(state.b, (state.b = b(state.x)))) changed.b = true; + if (this._differs(state.a, (state.a = a(state.x)))) changed.a = true; + if (this._differs(state.b, (state.b = b(state.x)))) changed.b = true; } } export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 91662053a4..606b5dc9e8 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js index 03e5cef1e2..0cc67aa9bc 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -40,7 +40,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -82,6 +82,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -139,7 +140,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index ba22542c4b..1a1e25de5a 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 2079e6607c..e3532c976a 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js index efcfcc8f30..df67cf01e8 100644 --- a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js +++ b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js b/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js index cf43bbd130..55fd993d32 100644 --- a/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js +++ b/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/each-block-changed-check/expected-bundle.js b/test/js/samples/each-block-changed-check/expected-bundle.js index e35826e354..524789a51a 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -60,7 +60,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -102,6 +102,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -159,7 +160,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 43db3035a3..860d249ee0 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -40,7 +40,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -82,6 +82,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -139,7 +140,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 91f894bc30..96d3b06cc8 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -40,7 +40,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -82,6 +82,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -139,7 +140,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/if-block-no-update/expected-bundle.js b/test/js/samples/if-block-no-update/expected-bundle.js index b309a25e96..29e8a05a8b 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index 5084639f4b..80a2a1475c 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js index 753d61db71..4348f9367e 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/inline-style-optimized-url/expected-bundle.js b/test/js/samples/inline-style-optimized-url/expected-bundle.js index cf360881b1..017dc960fc 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index 38024df4ff..fc1ba783cc 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 320c733a43..3958d3862b 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -44,7 +44,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -86,6 +86,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -143,7 +144,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/input-without-blowback-guard/expected-bundle.js b/test/js/samples/input-without-blowback-guard/expected-bundle.js index eacaca85a6..dbed2a12c0 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 7b730f08d9..5b49b4995a 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -46,7 +46,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -88,6 +88,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -145,7 +146,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/legacy-quote-class/expected-bundle.js b/test/js/samples/legacy-quote-class/expected-bundle.js index 499a82c46e..db13a962c9 100644 --- a/test/js/samples/legacy-quote-class/expected-bundle.js +++ b/test/js/samples/legacy-quote-class/expected-bundle.js @@ -63,7 +63,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -105,6 +105,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -162,7 +163,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index bbd56d8123..230454d955 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -56,7 +56,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -98,6 +98,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -155,7 +156,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index f8e0722db7..b037ff3ad4 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -42,7 +42,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -84,6 +84,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -141,7 +142,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js b/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js index e53dd0de5e..c0d41a7c76 100644 --- a/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js +++ b/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 58ee3a67a0..d1b04e43a5 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 12f06bcf92..21f8467d3b 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 6eb3471b5b..bebf5e4466 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -28,7 +28,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -70,6 +70,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -127,7 +128,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/use-elements-as-anchors/expected-bundle.js b/test/js/samples/use-elements-as-anchors/expected-bundle.js index e2ee1e61fb..f7302d8bd7 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -52,7 +52,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -94,6 +94,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -151,7 +152,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index a8a932c8b7..f522e5f96d 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -48,7 +48,7 @@ function destroy(detach) { } function differs(a, b) { - return a !== b || ((a && typeof a === 'object') || typeof a === 'function'); + return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function dispatchObservers(component, group, changed, newState, oldState) { @@ -90,6 +90,7 @@ function init(component, options) { component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; + component._differs = differs; component.options = options; component.root = options.root || component; @@ -147,7 +148,7 @@ function _set(newState) { dirty = false; for (var key in newState) { - if (differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; } if (!dirty) return; diff --git a/test/runtime/index.js b/test/runtime/index.js index 778f47c0cc..8ec4c5194a 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -66,6 +66,7 @@ describe("runtime", () => { compileOptions.hydratable = hydrate; compileOptions.dev = config.dev; compileOptions.store = !!config.store; + compileOptions.immutable = config.immutable; // check that no ES2015+ syntax slipped in if (!config.allowES2015) { @@ -160,7 +161,8 @@ describe("runtime", () => { target, hydrate, data: config.data, - store: (config.store !== true && config.store) + store: (config.store !== true && config.store), + immutable: config.immutable }, config.options || {}); const component = new SvelteComponent(options); diff --git a/test/runtime/samples/immutable-mutable/Nested.html b/test/runtime/samples/immutable-mutable/Nested.html new file mode 100644 index 0000000000..02278e385e --- /dev/null +++ b/test/runtime/samples/immutable-mutable/Nested.html @@ -0,0 +1,13 @@ +

Called {{count}} times.

+ + \ No newline at end of file diff --git a/test/runtime/samples/immutable-mutable/_config.js b/test/runtime/samples/immutable-mutable/_config.js new file mode 100644 index 0000000000..5dab0f239b --- /dev/null +++ b/test/runtime/samples/immutable-mutable/_config.js @@ -0,0 +1,16 @@ +export default { + immutable: true, + html: `

Called 0 times.

`, + + test(assert, component, target, window) { + var nested = component.refs.nested; + nested.observe('foo', foo => { + nested.set({ count: nested.get('count') + 1 }); + }); + + assert.htmlEqual(target.innerHTML, `

Called 1 times.

`); + + nested.set({ foo: nested.get('foo') }); + assert.htmlEqual(target.innerHTML, `

Called 2 times.

`); + } +}; diff --git a/test/runtime/samples/immutable-mutable/main.html b/test/runtime/samples/immutable-mutable/main.html new file mode 100644 index 0000000000..4e36143361 --- /dev/null +++ b/test/runtime/samples/immutable-mutable/main.html @@ -0,0 +1,13 @@ +
+ +
+ + diff --git a/test/runtime/samples/immutable-nested/Nested.html b/test/runtime/samples/immutable-nested/Nested.html new file mode 100644 index 0000000000..05eb9f3fdf --- /dev/null +++ b/test/runtime/samples/immutable-nested/Nested.html @@ -0,0 +1,12 @@ +

Called {{count}} times.

+ + \ No newline at end of file diff --git a/test/runtime/samples/immutable-nested/_config.js b/test/runtime/samples/immutable-nested/_config.js new file mode 100644 index 0000000000..541566ce4d --- /dev/null +++ b/test/runtime/samples/immutable-nested/_config.js @@ -0,0 +1,16 @@ +export default { + immutable: true, + html: `

Called 0 times.

`, + + test(assert, component, target, window) { + var nested = component.refs.nested; + nested.observe('foo', foo => { + nested.set({ count: nested.get('count') + 1 }); + }); + + assert.htmlEqual(target.innerHTML, `

Called 1 times.

`); + + nested.set({ foo: nested.get('foo') }); + assert.htmlEqual(target.innerHTML, `

Called 1 times.

`); + } +}; diff --git a/test/runtime/samples/immutable-nested/main.html b/test/runtime/samples/immutable-nested/main.html new file mode 100644 index 0000000000..4e36143361 --- /dev/null +++ b/test/runtime/samples/immutable-nested/main.html @@ -0,0 +1,13 @@ +
+ +
+ + diff --git a/test/runtime/samples/immutable-root/_config.js b/test/runtime/samples/immutable-root/_config.js new file mode 100644 index 0000000000..a862008d7d --- /dev/null +++ b/test/runtime/samples/immutable-root/_config.js @@ -0,0 +1,15 @@ +export default { + immutable: true, + html: `

Called 0 times.

`, + + test(assert, component, target, window) { + component.observe('foo', foo => { + component.set({ count: component.get('count') + 1 }); + }); + + assert.htmlEqual(target.innerHTML, `

Called 1 times.

`); + + component.set({ foo: component.get('foo') }); + assert.htmlEqual(target.innerHTML, `

Called 1 times.

`); + } +}; diff --git a/test/runtime/samples/immutable-root/main.html b/test/runtime/samples/immutable-root/main.html new file mode 100644 index 0000000000..087f561caf --- /dev/null +++ b/test/runtime/samples/immutable-root/main.html @@ -0,0 +1,14 @@ +
+

Called {{count}} times.

+
+ + \ No newline at end of file diff --git a/test/store/index.js b/test/store/index.js index d8053367a9..e3c024e4d5 100644 --- a/test/store/index.js +++ b/test/store/index.js @@ -187,4 +187,44 @@ describe('store', () => { }, /Cyclical dependency detected/); }); }); + + describe('immutable', () => { + it('observing state only changes on immutable updates', () => { + let newFoo; + let oldFoo; + let callCount = 0; + let value1 = {}; + let value2 = {}; + + const store = new Store({ + foo: value1 + }, { immutable: true }); + + store.observe('foo', (n, o) => { + callCount++; + newFoo = n; + oldFoo = o; + }); + + assert.equal(callCount, 1); + assert.equal(newFoo, value1); + assert.equal(oldFoo, undefined); + + store.set({ + foo: value1 + }); + + assert.equal(callCount, 1); + assert.equal(newFoo, value1); + assert.equal(oldFoo, undefined); + + store.set({ + foo: value2 + }); + + assert.equal(callCount, 2); + assert.equal(newFoo, value2); + assert.equal(oldFoo, value1); + }); + }); });