From 45b43e48280baae9421be1afba1afd72e1d9cefe Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 20 Apr 2018 17:15:03 -0400 Subject: [PATCH 1/9] emit classes --- src/generators/dom/index.ts | 29 +- src/shared/index.js | 219 +++++++-------- store.js | 148 +++++----- test/js/samples/action/expected-bundle.js | 194 ++++++------- test/js/samples/action/expected.js | 20 +- .../expected-bundle.js | 194 ++++++------- .../expected.js | 22 +- .../expected-bundle.js | 216 +++++++-------- .../component-static-immutable/expected.js | 40 +-- .../expected-bundle.js | 216 +++++++-------- .../component-static-immutable2/expected.js | 40 +-- .../component-static/expected-bundle.js | 214 +++++++------- test/js/samples/component-static/expected.js | 40 +-- .../computed-collapsed-if/expected-bundle.js | 194 ++++++------- .../samples/computed-collapsed-if/expected.js | 22 +- .../css-media-query/expected-bundle.js | 194 ++++++------- test/js/samples/css-media-query/expected.js | 22 +- .../expected-bundle.js | 177 ++++++------ .../css-shadow-dom-keyframes/expected.js | 5 +- .../deconflict-builtins/expected-bundle.js | 194 ++++++------- .../deconflict-builtins/expected-v2.js | 124 +++++++++ .../samples/deconflict-builtins/expected.js | 20 +- .../deconflict-globals/expected-bundle.js | 214 +++++++------- .../js/samples/deconflict-globals/expected.js | 42 +-- .../expected-bundle.js | 226 +++++++-------- .../expected-v2.js | 72 +++++ .../expected.js | 30 +- .../samples/do-use-dataset/expected-bundle.js | 192 ++++++------- test/js/samples/do-use-dataset/expected-v2.js | 55 ++++ test/js/samples/do-use-dataset/expected.js | 20 +- .../expected-bundle.js | 192 ++++++------- .../dont-use-dataset-in-legacy/expected-v2.js | 55 ++++ .../dont-use-dataset-in-legacy/expected.js | 20 +- .../expected-bundle.js | 192 ++++++------- .../dont-use-dataset-in-svg/expected-v2.js | 53 ++++ .../dont-use-dataset-in-svg/expected.js | 20 +- .../expected-bundle.js | 194 ++++++------- .../each-block-changed-check/expected-v2.js | 169 +++++++++++ .../each-block-changed-check/expected.js | 20 +- .../event-handlers-custom/expected-bundle.js | 193 ++++++------- .../samples/event-handlers-custom/expected.js | 19 +- .../head-no-whitespace/expected-bundle.js | 192 ++++++------- .../samples/head-no-whitespace/expected-v2.js | 50 ++++ .../js/samples/head-no-whitespace/expected.js | 20 +- .../if-block-no-update/expected-bundle.js | 194 ++++++------- .../samples/if-block-no-update/expected-v2.js | 104 +++++++ .../js/samples/if-block-no-update/expected.js | 20 +- .../if-block-simple/expected-bundle.js | 194 ++++++------- .../js/samples/if-block-simple/expected-v2.js | 80 ++++++ test/js/samples/if-block-simple/expected.js | 20 +- .../expected-bundle.js | 192 ++++++------- .../expected-v2.js | 53 ++++ .../expected.js | 20 +- .../expected-bundle.js | 192 ++++++------- .../inline-style-optimized-url/expected-v2.js | 48 ++++ .../inline-style-optimized-url/expected.js | 20 +- .../inline-style-optimized/expected-bundle.js | 192 ++++++------- .../inline-style-optimized/expected-v2.js | 48 ++++ .../inline-style-optimized/expected.js | 20 +- .../expected-bundle.js | 192 ++++++------- .../inline-style-unoptimized/expected-v2.js | 59 ++++ .../inline-style-unoptimized/expected.js | 20 +- .../expected-bundle.js | 194 ++++++------- .../input-without-blowback-guard/expected.js | 20 +- .../legacy-input-type/expected-bundle.js | 192 ++++++------- test/js/samples/legacy-input-type/expected.js | 20 +- .../samples/media-bindings/expected-bundle.js | 204 +++++++------- test/js/samples/media-bindings/expected.js | 30 +- .../non-imported-component/expected-bundle.js | 214 +++++++------- .../non-imported-component/expected.js | 40 +-- .../samples/setup-method/expected-bundle.js | 201 +++++++------- test/js/samples/setup-method/expected.js | 19 +- test/js/samples/svg-title/expected-bundle.js | 192 ++++++------- test/js/samples/svg-title/expected.js | 20 +- test/js/samples/title/expected-bundle.js | 192 ++++++------- test/js/samples/title/expected-v2.js | 39 +++ test/js/samples/title/expected.js | 20 +- .../expected-bundle.js | 194 ++++++------- .../use-elements-as-anchors/expected-v2.js | 262 ++++++++++++++++++ .../use-elements-as-anchors/expected.js | 20 +- .../window-binding-scroll/expected-bundle.js | 196 ++++++------- .../window-binding-scroll/expected-v2.js | 68 +++++ .../samples/window-binding-scroll/expected.js | 22 +- 83 files changed, 5096 insertions(+), 3715 deletions(-) create mode 100644 test/js/samples/deconflict-builtins/expected-v2.js create mode 100644 test/js/samples/dev-warning-missing-data-computed/expected-v2.js create mode 100644 test/js/samples/do-use-dataset/expected-v2.js create mode 100644 test/js/samples/dont-use-dataset-in-legacy/expected-v2.js create mode 100644 test/js/samples/dont-use-dataset-in-svg/expected-v2.js create mode 100644 test/js/samples/each-block-changed-check/expected-v2.js create mode 100644 test/js/samples/head-no-whitespace/expected-v2.js create mode 100644 test/js/samples/if-block-no-update/expected-v2.js create mode 100644 test/js/samples/if-block-simple/expected-v2.js create mode 100644 test/js/samples/inline-style-optimized-multiple/expected-v2.js create mode 100644 test/js/samples/inline-style-optimized-url/expected-v2.js create mode 100644 test/js/samples/inline-style-optimized/expected-v2.js create mode 100644 test/js/samples/inline-style-unoptimized/expected-v2.js create mode 100644 test/js/samples/title/expected-v2.js create mode 100644 test/js/samples/use-elements-as-anchors/expected-v2.js create mode 100644 test/js/samples/window-binding-scroll/expected-v2.js diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 9ae999d6695d..dfe1a8c0b8ad 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -2,7 +2,7 @@ import MagicString from 'magic-string'; import isReference from 'is-reference'; import { parseExpressionAt } from 'acorn'; import annotateWithScopes from '../../utils/annotateWithScopes'; -import { walk } from 'estree-walker'; +import { walk, childKeys } from 'estree-walker'; import deindent from '../../utils/deindent'; import { stringify, escape } from '../../utils/stringify'; import CodeBuilder from '../../utils/CodeBuilder'; @@ -136,7 +136,7 @@ export default function dom( let prototypeBase = `${name}.prototype`; const proto = sharedPath - ? `@proto` + ? `@Component.prototype` : deindent` { ${['destroy', 'get', 'fire', 'on', 'set', '_set', '_mount', '_unmount', '_differs'] @@ -174,7 +174,6 @@ export default function dom( ${options.dev && `this._debugName = '${debugName}';`} ${options.dev && !generator.customElement && `if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option");`} - @init(this, options); ${templateProperties.store && `this.store = %store();`} ${generator.usesRefs && `this.refs = {};`} this._state = ${initialState.reduce((state, piece) => `@assign(${state}, ${piece})`)}; @@ -332,13 +331,16 @@ export default function dom( }); `); } else { + // TODO put methods in class body builder.addBlock(deindent` - function ${name}(options) { - ${constructorBody} + class ${name} extends @Component { + constructor(options) { + super(options); + ${constructorBody} + } } - @assign(${prototypeBase}, ${proto}); - ${templateProperties.methods && `@assign(${prototypeBase}, %methods);`} + ${templateProperties.methods && `@assign(${name}.prototype, %methods);`} `); } @@ -402,6 +404,10 @@ export default function dom( } else { let inlineHelpers = ''; + // super gross hack to ensure Component isn't declared before its superclass + usedHelpers.delete('Component'); + usedHelpers.add('Thing').add('Component'); + usedHelpers.forEach(key => { const str = shared[key]; const code = new MagicString(str); @@ -424,8 +430,9 @@ export default function dom( usedHelpers.add(dependency); const alias = generator.alias(dependency); - if (alias !== node.name) + if (alias !== node.name) { code.overwrite(node.start, node.end, alias); + } } } }, @@ -439,17 +446,17 @@ export default function dom( // special case const global = `_svelteTransitionManager`; - inlineHelpers += `\n\nvar ${generator.alias('transitionManager')} = window.${global} || (window.${global} = ${code});\n\n`; + inlineHelpers += `var ${generator.alias('transitionManager')} = window.${global} || (window.${global} = ${code});\n\n`; } else { const alias = generator.alias(expression.id.name); if (alias !== expression.id.name) code.overwrite(expression.id.start, expression.id.end, alias); - inlineHelpers += `\n\n${code}`; + inlineHelpers += `${code}\n\n`; } }); - result += inlineHelpers; + result = inlineHelpers + result; } const filename = options.filename && ( diff --git a/src/shared/index.js b/src/shared/index.js index 0d7cb43bddbb..b93a7543572c 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -10,128 +10,139 @@ export function blankObject() { return Object.create(null); } -export 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; -} +// TODO need to think of a suitable name for this +export class Thing { + constructor() { + this._handlers = blankObject(); + } -export function destroyDev(detach) { - destroy.call(this, detach); - this.destroy = function() { - console.warn('Component was already destroyed'); - }; -} + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; -export function _differs(a, b) { - return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); -} + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; -export function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } -export function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; - } + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); } } -export function get() { - return this._state; -} +export class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -export function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; -} + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } + + 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; + } -export function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; } - }; -} -export function run(fn) { - fn(); -} + if (!dirty) return; -export 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; -} + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); -export function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _recompute() {} - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + _unmount() { + if (this._fragment) this._fragment.u(); } } -export function setDev(newState) { - if (typeof newState !== 'object') { - throw new Error( - this._debugName + '.set was called without an object of data key-values to update.' - ); +export class ComponentDev extends Component { + destroy(detach) { + super.destroy(detach); + this.destroy = () => { + console.warn('Component was already destroyed'); + }; } - this._checkReadOnly(newState); - set.call(this, newState); + set(newState) { + if (typeof newState !== 'object') { + throw new Error(`${this._debugName}.set was called without an object of data key-values to update.`); + } + + this._checkReadOnly(newState); + super.set(newState); + } } -export function callAll(fns) { - while (fns && fns.length) fns.shift()(); +export function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -export function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); +export function run(fn) { + fn(); } -export function _unmount() { - if (this._fragment) this._fragment.u(); +export function callAll(fns) { + while (fns && fns.length) fns.shift()(); } export function isPromise(value) { @@ -144,30 +155,4 @@ export var FAILURE = {}; export function removeFromStore() { this.store._remove(this); -} - -export var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; - -export var protoDev = { - destroy: destroyDev, - get, - fire, - on, - set: setDev, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +} \ No newline at end of file diff --git a/store.js b/store.js index 42f17c9bb87b..59d40618ade6 100644 --- a/store.js +++ b/store.js @@ -1,81 +1,24 @@ import { + Thing, assign, blankObject, - _differs, - _differsImmutable, - get, - on, - fire + _differsImmutable } from './shared.js'; -function Store(state, options) { - this._handlers = {}; - this._dependents = []; +class Store extends Thing { + constructor(state, options) { + super(); - this._computed = blankObject(); - this._sortedComputedProperties = []; + this._dependents = []; - this._state = assign({}, state); - this._differs = options && options.immutable ? _differsImmutable : _differs; -} - -assign(Store.prototype, { - _add: function(component, props) { - this._dependents.push({ - component: component, - props: props - }); - }, - - _init: function(props) { - var state = {}; - for (var i = 0; i < props.length; i += 1) { - var prop = props[i]; - state['$' + prop] = this._state[prop]; - } - return state; - }, - - _remove: function(component) { - var i = this._dependents.length; - while (i--) { - if (this._dependents[i].component === component) { - this._dependents.splice(i, 1); - return; - } - } - }, - - _sortComputedProperties: function() { - var computed = this._computed; - var sorted = this._sortedComputedProperties = []; - var cycles; - var visited = blankObject(); + this._computed = blankObject(); + this._sortedComputedProperties = []; - function visit(key) { - if (cycles[key]) { - throw new Error('Cyclical dependency detected'); - } - - if (visited[key]) return; - visited[key] = true; - - var c = computed[key]; - - if (c) { - cycles[key] = true; - c.deps.forEach(visit); - sorted.push(c); - } - } - - for (var key in this._computed) { - cycles = blankObject(); - visit(key); - } - }, + this._state = assign({}, state); + if (options && options.immutable) this._differs = _differsImmutable; + } - compute: function(key, deps, fn) { + compute(key, deps, fn) { var store = this; var value; @@ -102,15 +45,9 @@ assign(Store.prototype, { this._computed[key] = c; this._sortComputedProperties(); - }, - - fire: fire, - - get: get, - - on: on, + } - set: function(newState) { + set(newState) { var oldState = this._state, changed = this._changed = {}, dirty = false; @@ -156,6 +93,61 @@ assign(Store.prototype, { previous: oldState }); } -}); + + _add(component, props) { + this._dependents.push({ + component: component, + props: props + }); + } + + _init(props) { + var state = {}; + for (var i = 0; i < props.length; i += 1) { + var prop = props[i]; + state['$' + prop] = this._state[prop]; + } + return state; + } + + _remove(component) { + var i = this._dependents.length; + while (i--) { + if (this._dependents[i].component === component) { + this._dependents.splice(i, 1); + return; + } + } + } + + _sortComputedProperties() { + var computed = this._computed; + var sorted = this._sortedComputedProperties = []; + var cycles; + var visited = blankObject(); + + function visit(key) { + if (cycles[key]) { + throw new Error('Cyclical dependency detected'); + } + + if (visited[key]) return; + visited[key] = true; + + var c = computed[key]; + + if (c) { + cycles[key] = true; + c.deps.forEach(visit); + sorted.push(c); + } + } + + for (var key in this._computed) { + cycles = blankObject(); + visit(key); + } + } +} export { Store }; diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 093fb642a768..4cca72e910eb 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -21,116 +21,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -174,24 +176,24 @@ function create_main_fragment(component, state) { detachNode(a); }, - d: function destroy$$1() { + d: function destroy() { if (typeof link_action.destroy === 'function') link_action.destroy.call(component); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/action/expected.js b/test/js/samples/action/expected.js index 5562b845296b..e2776ce9411b 100644 --- a/test/js/samples/action/expected.js +++ b/test/js/samples/action/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function link(node) { @@ -48,17 +48,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 6786d1c2dcff..5e04dd681734 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -29,116 +29,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -185,20 +187,20 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign(data(), options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign(data(), options.data); - if (!document.getElementById("svelte-1a7i8ec-style")) add_css(); + if (!document.getElementById("svelte-1a7i8ec-style")) add_css(); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 2f50f85a68b5..90c02f30b1a8 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function data() { return { foo: 42 } @@ -45,19 +45,19 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign(data(), options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign(data(), options.data); - if (!document.getElementById("svelte-1a7i8ec-style")) add_css(); + if (!document.getElementById("svelte-1a7i8ec-style")) add_css(); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ 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 index 235f57755d3a..027e6c7cd01c 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -9,120 +9,118 @@ 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; -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function _differs(a, b) { - return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); -} + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + get() { + return this._state; + } - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; - } + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; } -} -function get() { - return this._state; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } + + 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; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 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; -} + if (!dirty) return; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); - - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -151,38 +149,38 @@ function create_main_fragment(component, state) { nested._unmount(); }, - d: function destroy$$1() { + d: function destroy() { nested.destroy(false); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._differs = _differsImmutable; export default SvelteComponent; diff --git a/test/js/samples/component-static-immutable/expected.js b/test/js/samples/component-static-immutable/expected.js index ee5a447d64ea..7512269f6ae6 100644 --- a/test/js/samples/component-static-immutable/expected.js +++ b/test/js/samples/component-static-immutable/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { _differsImmutable, assign, callAll, init, noop, proto } from "svelte/shared.js"; +import { Component, _differsImmutable, assign, callAll, noop } from "svelte/shared.js"; var Nested = window.Nested; @@ -32,31 +32,31 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._differs = _differsImmutable; export default SvelteComponent; \ 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 index 235f57755d3a..027e6c7cd01c 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -9,120 +9,118 @@ 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; -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function _differs(a, b) { - return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); -} + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + get() { + return this._state; + } - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; - } + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; } -} -function get() { - return this._state; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } + + 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; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 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; -} + if (!dirty) return; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); - - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -151,38 +149,38 @@ function create_main_fragment(component, state) { nested._unmount(); }, - d: function destroy$$1() { + d: function destroy() { nested.destroy(false); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._differs = _differsImmutable; export default SvelteComponent; diff --git a/test/js/samples/component-static-immutable2/expected.js b/test/js/samples/component-static-immutable2/expected.js index ee5a447d64ea..7512269f6ae6 100644 --- a/test/js/samples/component-static-immutable2/expected.js +++ b/test/js/samples/component-static-immutable2/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { _differsImmutable, assign, callAll, init, noop, proto } from "svelte/shared.js"; +import { Component, _differsImmutable, assign, callAll, noop } from "svelte/shared.js"; var Nested = window.Nested; @@ -32,31 +32,31 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + this._lock = true; + callAll(this._beforecreate); + callAll(this._oncreate); + callAll(this._aftercreate); + this._lock = false; + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._differs = _differsImmutable; export default SvelteComponent; \ 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 dc4f6dbf0dd9..8cd994bbc40c 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -9,116 +9,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -147,36 +149,36 @@ function create_main_fragment(component, state) { nested._unmount(); }, - d: function destroy$$1() { + d: function destroy() { nested.destroy(false); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + 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/expected.js b/test/js/samples/component-static/expected.js index 93584db49e8a..541ebae80186 100644 --- a/test/js/samples/component-static/expected.js +++ b/test/js/samples/component-static/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, callAll, init, noop, proto } from "svelte/shared.js"; +import { Component, assign, callAll, noop } from "svelte/shared.js"; var Nested = window.Nested; @@ -32,29 +32,29 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + 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/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index 8cd4bf0011db..5183205365e8 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -9,116 +9,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -145,21 +147,21 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); - this._recompute({ x: 1 }, this._state); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + this._recompute({ x: 1 }, this._state); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._recompute = function _recompute(changed, state) { if (changed.x) { if (this._differs(state.a, (state.a = a(state)))) changed.a = true; diff --git a/test/js/samples/computed-collapsed-if/expected.js b/test/js/samples/computed-collapsed-if/expected.js index f1228ca0b698..2527cd6c3d3d 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, init, noop, proto } from "svelte/shared.js"; +import { Component, assign, noop } from "svelte/shared.js"; function a({ x }) { return x * 2; @@ -24,21 +24,21 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); - this._recompute({ x: 1 }, this._state); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + this._recompute({ x: 1 }, this._state); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - SvelteComponent.prototype._recompute = function _recompute(changed, state) { if (changed.x) { if (this._differs(state.a, (state.a = a(state)))) changed.a = true; diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 6b1455f9c6ae..9a8fd8e81ed7 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -172,20 +174,20 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!document.getElementById("svelte-1slhpfn-style")) add_css(); + if (!document.getElementById("svelte-1slhpfn-style")) add_css(); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/css-media-query/expected.js b/test/js/samples/css-media-query/expected.js index 893af2303512..a7d97adcc9b4 100644 --- a/test/js/samples/css-media-query/expected.js +++ b/test/js/samples/css-media-query/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function add_css() { var style = createElement("style"); @@ -35,19 +35,19 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!document.getElementById("svelte-1slhpfn-style")) add_css(); + if (!document.getElementById("svelte-1slhpfn-style")) add_css(); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 c2f35f7b986e..cce0a24212ce 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -21,116 +21,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -161,7 +163,6 @@ function create_main_fragment(component, state) { class SvelteComponent extends HTMLElement { constructor(options = {}) { super(); - init(this, options); this._state = assign({}, options.data); this.attachShadow({ mode: 'open' }); @@ -185,7 +186,7 @@ class SvelteComponent extends HTMLElement { } customElements.define("custom-element", SvelteComponent); -assign(assign(SvelteComponent.prototype, proto), { +assign(assign(SvelteComponent.prototype, Component.prototype), { _mount(target, anchor) { target.insertBefore(this, anchor); }, diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js index eeac231db1bf..2487f11d974a 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var div; @@ -28,7 +28,6 @@ function create_main_fragment(component, state) { class SvelteComponent extends HTMLElement { constructor(options = {}) { super(); - init(this, options); this._state = assign({}, options.data); this.attachShadow({ mode: 'open' }); @@ -52,7 +51,7 @@ class SvelteComponent extends HTMLElement { } customElements.define("custom-element", SvelteComponent); -assign(assign(SvelteComponent.prototype, proto), { +assign(assign(SvelteComponent.prototype, Component.prototype), { _mount(target, anchor) { target.insertBefore(this, anchor); }, diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index 2f9dd2db1d49..284f281fd88a 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -39,116 +39,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -220,7 +222,7 @@ function create_main_fragment(component, state) { detachNode(each_anchor); }, - d: function destroy$$1() { + d: function destroy() { destroyEach(each_blocks); } }; @@ -259,18 +261,18 @@ function create_each_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/deconflict-builtins/expected-v2.js b/test/js/samples/deconflict-builtins/expected-v2.js new file mode 100644 index 000000000000..f6861d255714 --- /dev/null +++ b/test/js/samples/deconflict-builtins/expected-v2.js @@ -0,0 +1,124 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createComment, createElement, createText, destroyEach, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var each_anchor; + + var each_value = state.createElement; + + var each_blocks = []; + + for (var i = 0; i < each_value.length; i += 1) { + each_blocks[i] = create_each_block(component, assign(assign({}, state), { + each_value: each_value, + node: each_value[i], + node_index: i + })); + } + + return { + c: function create() { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } + + each_anchor = createComment(); + }, + + m: function mount(target, anchor) { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].m(target, anchor); + } + + insertNode(each_anchor, target, anchor); + }, + + p: function update(changed, state) { + var each_value = state.createElement; + + if (changed.createElement) { + for (var i = 0; i < each_value.length; i += 1) { + var each_context = assign(assign({}, state), { + each_value: each_value, + node: each_value[i], + node_index: i + }); + + if (each_blocks[i]) { + each_blocks[i].p(changed, each_context); + } else { + each_blocks[i] = create_each_block(component, each_context); + each_blocks[i].c(); + each_blocks[i].m(each_anchor.parentNode, each_anchor); + } + } + + for (; i < each_blocks.length; i += 1) { + each_blocks[i].u(); + each_blocks[i].d(); + } + each_blocks.length = each_value.length; + } + }, + + u: function unmount() { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].u(); + } + + detachNode(each_anchor); + }, + + d: function destroy() { + destroyEach(each_blocks); + } + }; +} + +// (1:0) {#each createElement as node} +function create_each_block(component, state) { + var node = state.node, each_value = state.each_value, node_index = state.node_index; + var span, text_value = node, text; + + return { + c: function create() { + span = createElement("span"); + text = createText(text_value); + }, + + m: function mount(target, anchor) { + insertNode(span, target, anchor); + appendNode(text, span); + }, + + p: function update(changed, state) { + node = state.node; + each_value = state.each_value; + node_index = state.node_index; + if ((changed.createElement) && text_value !== (text_value = node)) { + text.data = text_value; + } + }, + + u: function unmount() { + detachNode(span); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index f6861d255714..da60ff688c40 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createComment, createElement, createText, destroyEach, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createComment, createElement, createText, destroyEach, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var each_anchor; @@ -108,17 +108,17 @@ function create_each_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index 214eed957865..73a4e1c20bb7 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -9,116 +9,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -146,33 +148,33 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign(data_1(), options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign(data_1(), options.data); - var self = this; - var _oncreate = function() { - var changed = { }; - oncreate.call(self); - self.fire("update", { changed: changed, current: self._state }); - }; + var self = this; + var _oncreate = function() { + var changed = { }; + oncreate.call(self); + self.fire("update", { changed: changed, current: self._state }); + }; - if (!options.root) { - this._oncreate = []; - } + if (!options.root) { + this._oncreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - this.root._oncreate.push(_oncreate); + this.root._oncreate.push(_oncreate); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - callAll(this._oncreate); + callAll(this._oncreate); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/deconflict-globals/expected.js b/test/js/samples/deconflict-globals/expected.js index 91192f4ccaa3..7922871df457 100644 --- a/test/js/samples/deconflict-globals/expected.js +++ b/test/js/samples/deconflict-globals/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, callAll, init, noop, proto } from "svelte/shared.js"; +import { Component, assign, callAll, noop } from "svelte/shared.js"; function data_1() { return { @@ -26,32 +26,32 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign(data_1(), options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign(data_1(), options.data); - var self = this; - var _oncreate = function() { - var changed = { }; - oncreate.call(self); - self.fire("update", { changed: changed, current: self._state }); - }; + var self = this; + var _oncreate = function() { + var changed = { }; + oncreate.call(self); + self.fire("update", { changed: changed, current: self._state }); + }; - if (!options.root) { - this._oncreate = []; - } + if (!options.root) { + this._oncreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - this.root._oncreate.push(_oncreate); + this.root._oncreate.push(_oncreate); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - callAll(this._oncreate); + callAll(this._oncreate); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index e0ff6a11717d..8e0ccbcf02ec 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -29,135 +29,137 @@ 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; -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function destroyDev(detach) { - destroy.call(this, detach); - this.destroy = function() { - console.warn('Component was already destroyed'); - }; -} + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; -function _differs(a, b) { - return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); -} + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + get() { + return this._state; + } - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; - } + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; } -} -function get() { - return this._state; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } + + 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; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 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; -} + if (!dirty) return; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _recompute() {} - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + _unmount() { + if (this._fragment) this._fragment.u(); } } -function setDev(newState) { - if (typeof newState !== 'object') { - throw new Error( - this._debugName + '.set was called without an object of data key-values to update.' - ); +class ComponentDev extends Component { + destroy(detach) { + super.destroy(detach); + this.destroy = () => { + console.warn('Component was already destroyed'); + }; } - this._checkReadOnly(newState); - set.call(this, newState); -} + set(newState) { + if (typeof newState !== 'object') { + throw new Error(`${this._debugName}.set was called without an object of data key-values to update.`); + } -function callAll(fns) { - while (fns && fns.length) fns.shift()(); + this._checkReadOnly(newState); + super.set(newState); + } } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -function _unmount() { - if (this._fragment) this._fragment.u(); +function callAll(fns) { + while (fns && fns.length) fns.shift()(); } -var protoDev = { - destroy: destroyDev, - get, - fire, - on, - set: setDev, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; - /* generated by Svelte vX.Y.Z */ function bar({ foo }) { @@ -200,25 +202,25 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - this._debugName = ''; - if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); - init(this, options); - this._state = assign({ Math : Math }, options.data); - this._recompute({ foo: 1 }, this._state); - if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); +class SvelteComponent extends ComponentDev { + constructor(options) { + super(options); + this._debugName = ''; + if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); + this._state = assign({ Math : Math }, options.data); + this._recompute({ foo: 1 }, this._state); + if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, protoDev); - SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); }; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-v2.js b/test/js/samples/dev-warning-missing-data-computed/expected-v2.js new file mode 100644 index 000000000000..52dee37250c4 --- /dev/null +++ b/test/js/samples/dev-warning-missing-data-computed/expected-v2.js @@ -0,0 +1,72 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createElement, createText, detachNode, init, insertNode, noop, protoDev } from "svelte/shared.js"; + +function bar({ foo }) { + return foo * 2; +} + +function create_main_fragment(component, state) { + var p, text_value = state.Math.max(0, state.foo), text, text_1, text_2; + + return { + c: function create() { + p = createElement("p"); + text = createText(text_value); + text_1 = createText("\n\t"); + text_2 = createText(state.bar); + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + appendNode(text, p); + appendNode(text_1, p); + appendNode(text_2, p); + }, + + p: function update(changed, state) { + if ((changed.Math || changed.foo) && text_value !== (text_value = state.Math.max(0, state.foo))) { + text.data = text_value; + } + + if (changed.bar) { + text_2.data = state.bar; + } + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + this._debugName = ''; + if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); + init(this, options); + this._state = assign({ Math : Math }, options.data); + this._recompute({ foo: 1 }, this._state); + if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, protoDev); + +SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { + if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); +}; + +SvelteComponent.prototype._recompute = function _recompute(changed, state) { + if (changed.foo) { + if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; + } +} +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 52dee37250c4..f01bfb85475a 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, createText, detachNode, init, insertNode, noop, protoDev } from "svelte/shared.js"; +import { ComponentDev, appendNode, assign, createElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function bar({ foo }) { return foo * 2; @@ -41,25 +41,25 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - this._debugName = ''; - if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); - init(this, options); - this._state = assign({ Math : Math }, options.data); - this._recompute({ foo: 1 }, this._state); - if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); +class SvelteComponent extends ComponentDev { + constructor(options) { + super(options); + this._debugName = ''; + if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); + this._state = assign({ Math : Math }, options.data); + this._recompute({ foo: 1 }, this._state); + if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, protoDev); - SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); }; diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 32af7494c3df..2d544b5c15d7 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -176,18 +178,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/do-use-dataset/expected-v2.js b/test/js/samples/do-use-dataset/expected-v2.js new file mode 100644 index 000000000000..b88636a606d5 --- /dev/null +++ b/test/js/samples/do-use-dataset/expected-v2.js @@ -0,0 +1,55 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div, text, div_1; + + return { + c: function create() { + div = createElement("div"); + text = createText("\n"); + div_1 = createElement("div"); + this.h(); + }, + + h: function hydrate() { + div.dataset.foo = "bar"; + div_1.dataset.foo = state.bar; + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + insertNode(text, target, anchor); + insertNode(div_1, target, anchor); + }, + + p: function update(changed, state) { + if (changed.bar) { + div_1.dataset.foo = state.bar; + } + }, + + u: function unmount() { + detachNode(div); + detachNode(text); + detachNode(div_1); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/do-use-dataset/expected.js b/test/js/samples/do-use-dataset/expected.js index b88636a606d5..accd7a47e813 100644 --- a/test/js/samples/do-use-dataset/expected.js +++ b/test/js/samples/do-use-dataset/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var div, text, div_1; @@ -39,17 +39,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 5e9def191391..7a661b32a20e 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 @@ -29,116 +29,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -180,18 +182,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected-v2.js b/test/js/samples/dont-use-dataset-in-legacy/expected-v2.js new file mode 100644 index 000000000000..699da1270b87 --- /dev/null +++ b/test/js/samples/dont-use-dataset-in-legacy/expected-v2.js @@ -0,0 +1,55 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, createText, detachNode, init, insertNode, noop, proto, setAttribute } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div, text, div_1; + + return { + c: function create() { + div = createElement("div"); + text = createText("\n"); + div_1 = createElement("div"); + this.h(); + }, + + h: function hydrate() { + setAttribute(div, "data-foo", "bar"); + setAttribute(div_1, "data-foo", state.bar); + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + insertNode(text, target, anchor); + insertNode(div_1, target, anchor); + }, + + p: function update(changed, state) { + if (changed.bar) { + setAttribute(div_1, "data-foo", state.bar); + } + }, + + u: function unmount() { + detachNode(div); + detachNode(text); + detachNode(div_1); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected.js b/test/js/samples/dont-use-dataset-in-legacy/expected.js index 699da1270b87..d4fa1c0fede7 100644 --- a/test/js/samples/dont-use-dataset-in-legacy/expected.js +++ b/test/js/samples/dont-use-dataset-in-legacy/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, createText, detachNode, init, insertNode, noop, proto, setAttribute } from "svelte/shared.js"; +import { Component, assign, createElement, createText, detachNode, insertNode, noop, setAttribute } from "svelte/shared.js"; function create_main_fragment(component, state) { var div, text, div_1; @@ -39,17 +39,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 54b8382a2db9..b2b7814ea6a3 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 @@ -29,116 +29,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -178,18 +180,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/dont-use-dataset-in-svg/expected-v2.js b/test/js/samples/dont-use-dataset-in-svg/expected-v2.js new file mode 100644 index 000000000000..42693672549b --- /dev/null +++ b/test/js/samples/dont-use-dataset-in-svg/expected-v2.js @@ -0,0 +1,53 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createSvgElement, detachNode, init, insertNode, noop, proto, setAttribute } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var svg, g, g_1; + + return { + c: function create() { + svg = createSvgElement("svg"); + g = createSvgElement("g"); + g_1 = createSvgElement("g"); + this.h(); + }, + + h: function hydrate() { + setAttribute(g, "data-foo", "bar"); + setAttribute(g_1, "data-foo", state.bar); + }, + + m: function mount(target, anchor) { + insertNode(svg, target, anchor); + appendNode(g, svg); + appendNode(g_1, svg); + }, + + p: function update(changed, state) { + if (changed.bar) { + setAttribute(g_1, "data-foo", state.bar); + } + }, + + u: function unmount() { + detachNode(svg); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dont-use-dataset-in-svg/expected.js b/test/js/samples/dont-use-dataset-in-svg/expected.js index 42693672549b..beb4c48d27fc 100644 --- a/test/js/samples/dont-use-dataset-in-svg/expected.js +++ b/test/js/samples/dont-use-dataset-in-svg/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createSvgElement, detachNode, init, insertNode, noop, proto, setAttribute } from "svelte/shared.js"; +import { Component, appendNode, assign, createSvgElement, detachNode, insertNode, noop, setAttribute } from "svelte/shared.js"; function create_main_fragment(component, state) { var svg, g, g_1; @@ -37,17 +37,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 89c3cab24320..d77c249371ef 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -41,116 +41,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -231,7 +233,7 @@ function create_main_fragment(component, state) { detachNode(p); }, - d: function destroy$$1() { + d: function destroy() { destroyEach(each_blocks); } }; @@ -306,18 +308,18 @@ function create_each_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/each-block-changed-check/expected-v2.js b/test/js/samples/each-block-changed-check/expected-v2.js new file mode 100644 index 000000000000..e7e0ccca306f --- /dev/null +++ b/test/js/samples/each-block-changed-check/expected-v2.js @@ -0,0 +1,169 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createElement, createText, destroyEach, detachAfter, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var text, p, text_1; + + var each_value = state.comments; + + var each_blocks = []; + + for (var i = 0; i < each_value.length; i += 1) { + each_blocks[i] = create_each_block(component, assign(assign({}, state), { + each_value: each_value, + comment: each_value[i], + i: i + })); + } + + return { + c: function create() { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } + + text = createText("\n\n"); + p = createElement("p"); + text_1 = createText(state.foo); + }, + + m: function mount(target, anchor) { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].m(target, anchor); + } + + insertNode(text, target, anchor); + insertNode(p, target, anchor); + appendNode(text_1, p); + }, + + p: function update(changed, state) { + var each_value = state.comments; + + if (changed.comments || changed.elapsed || changed.time) { + for (var i = 0; i < each_value.length; i += 1) { + var each_context = assign(assign({}, state), { + each_value: each_value, + comment: each_value[i], + i: i + }); + + if (each_blocks[i]) { + each_blocks[i].p(changed, each_context); + } else { + each_blocks[i] = create_each_block(component, each_context); + each_blocks[i].c(); + each_blocks[i].m(text.parentNode, text); + } + } + + for (; i < each_blocks.length; i += 1) { + each_blocks[i].u(); + each_blocks[i].d(); + } + each_blocks.length = each_value.length; + } + + if (changed.foo) { + text_1.data = state.foo; + } + }, + + u: function unmount() { + for (var i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].u(); + } + + detachNode(text); + detachNode(p); + }, + + d: function destroy() { + destroyEach(each_blocks); + } + }; +} + +// (1:0) {#each comments as comment, i} +function create_each_block(component, state) { + var comment = state.comment, each_value = state.each_value, i = state.i; + var div, strong, text, text_1, span, text_2_value = comment.author, text_2, text_3, text_4_value = state.elapsed(comment.time, state.time), text_4, text_5, text_6, raw_value = comment.html, raw_before; + + return { + c: function create() { + div = createElement("div"); + strong = createElement("strong"); + text = createText(i); + text_1 = createText("\n\n\t\t"); + span = createElement("span"); + text_2 = createText(text_2_value); + text_3 = createText(" wrote "); + text_4 = createText(text_4_value); + text_5 = createText(" ago:"); + text_6 = createText("\n\n\t\t"); + raw_before = createElement('noscript'); + this.h(); + }, + + h: function hydrate() { + span.className = "meta"; + div.className = "comment"; + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + appendNode(strong, div); + appendNode(text, strong); + appendNode(text_1, div); + appendNode(span, div); + appendNode(text_2, span); + appendNode(text_3, span); + appendNode(text_4, span); + appendNode(text_5, span); + appendNode(text_6, div); + appendNode(raw_before, div); + raw_before.insertAdjacentHTML("afterend", raw_value); + }, + + p: function update(changed, state) { + comment = state.comment; + each_value = state.each_value; + i = state.i; + if ((changed.comments) && text_2_value !== (text_2_value = comment.author)) { + text_2.data = text_2_value; + } + + if ((changed.elapsed || changed.comments || changed.time) && text_4_value !== (text_4_value = state.elapsed(comment.time, state.time))) { + text_4.data = text_4_value; + } + + if ((changed.comments) && raw_value !== (raw_value = comment.html)) { + detachAfter(raw_before); + raw_before.insertAdjacentHTML("afterend", raw_value); + } + }, + + u: function unmount() { + detachAfter(raw_before); + + detachNode(div); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index e7e0ccca306f..a677d72d27dd 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, createText, destroyEach, detachAfter, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createElement, createText, destroyEach, detachAfter, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var text, p, text_1; @@ -153,17 +153,17 @@ function create_each_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 5d85e177e1b4..10e888c5f95a 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -21,116 +21,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -170,25 +172,26 @@ function create_main_fragment(component, state) { detachNode(button); }, - d: function destroy$$1() { + d: function destroy() { foo_handler.destroy(); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); assign(SvelteComponent.prototype, methods); export default SvelteComponent; diff --git a/test/js/samples/event-handlers-custom/expected.js b/test/js/samples/event-handlers-custom/expected.js index 3975641534d1..978532df69bc 100644 --- a/test/js/samples/event-handlers-custom/expected.js +++ b/test/js/samples/event-handlers-custom/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function foo( node, callback ) { // code goes here @@ -44,18 +44,19 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); assign(SvelteComponent.prototype, methods); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 7f88574b70f6..585e44bd3b74 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -21,116 +21,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -167,18 +169,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/head-no-whitespace/expected-v2.js b/test/js/samples/head-no-whitespace/expected-v2.js new file mode 100644 index 000000000000..9818f4211658 --- /dev/null +++ b/test/js/samples/head-no-whitespace/expected-v2.js @@ -0,0 +1,50 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createElement, detachNode, init, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var meta, meta_1; + + return { + c: function create() { + meta = createElement("meta"); + meta_1 = createElement("meta"); + this.h(); + }, + + h: function hydrate() { + meta.name = "twitter:creator"; + meta.content = "@sveltejs"; + meta_1.name = "twitter:title"; + meta_1.content = "Svelte"; + }, + + m: function mount(target, anchor) { + appendNode(meta, document.head); + appendNode(meta_1, document.head); + }, + + p: noop, + + u: function unmount() { + detachNode(meta); + detachNode(meta_1); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/head-no-whitespace/expected.js b/test/js/samples/head-no-whitespace/expected.js index 9818f4211658..a2dbece70c17 100644 --- a/test/js/samples/head-no-whitespace/expected.js +++ b/test/js/samples/head-no-whitespace/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, detachNode, init, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createElement, detachNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var meta, meta_1; @@ -34,17 +34,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 1760a2ca607f..4eb0bf8bcba5 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -175,7 +177,7 @@ function create_main_fragment(component, state) { detachNode(if_block_anchor); }, - d: function destroy$$1() { + d: function destroy() { if_block.d(); } }; @@ -225,18 +227,18 @@ function create_if_block_1(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/if-block-no-update/expected-v2.js b/test/js/samples/if-block-no-update/expected-v2.js new file mode 100644 index 000000000000..c06ff6ee679a --- /dev/null +++ b/test/js/samples/if-block-no-update/expected-v2.js @@ -0,0 +1,104 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createComment, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var if_block_anchor; + + function select_block_type(state) { + if (state.foo) return create_if_block; + return create_if_block_1; + } + + var current_block_type = select_block_type(state); + var if_block = current_block_type(component, state); + + return { + c: function create() { + if_block.c(); + if_block_anchor = createComment(); + }, + + m: function mount(target, anchor) { + if_block.m(target, anchor); + insertNode(if_block_anchor, target, anchor); + }, + + p: function update(changed, state) { + if (current_block_type !== (current_block_type = select_block_type(state))) { + if_block.u(); + if_block.d(); + if_block = current_block_type(component, state); + if_block.c(); + if_block.m(if_block_anchor.parentNode, if_block_anchor); + } + }, + + u: function unmount() { + if_block.u(); + detachNode(if_block_anchor); + }, + + d: function destroy() { + if_block.d(); + } + }; +} + +// (1:0) {#if foo} +function create_if_block(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "foo!"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +// (3:0) {:else} +function create_if_block_1(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "not foo!"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/if-block-no-update/expected.js b/test/js/samples/if-block-no-update/expected.js index c06ff6ee679a..9c3faef253fd 100644 --- a/test/js/samples/if-block-no-update/expected.js +++ b/test/js/samples/if-block-no-update/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createComment, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createComment, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var if_block_anchor; @@ -88,17 +88,17 @@ function create_if_block_1(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index f71aafff9415..85e13f2375a1 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -173,7 +175,7 @@ function create_main_fragment(component, state) { detachNode(if_block_anchor); }, - d: function destroy$$1() { + d: function destroy() { if (if_block) if_block.d(); } }; @@ -201,18 +203,18 @@ function create_if_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/if-block-simple/expected-v2.js b/test/js/samples/if-block-simple/expected-v2.js new file mode 100644 index 000000000000..b3447471d31e --- /dev/null +++ b/test/js/samples/if-block-simple/expected-v2.js @@ -0,0 +1,80 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createComment, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var if_block_anchor; + + var if_block = (state.foo) && create_if_block(component, state); + + return { + c: function create() { + if (if_block) if_block.c(); + if_block_anchor = createComment(); + }, + + m: function mount(target, anchor) { + if (if_block) if_block.m(target, anchor); + insertNode(if_block_anchor, target, anchor); + }, + + p: function update(changed, state) { + if (state.foo) { + if (!if_block) { + if_block = create_if_block(component, state); + if_block.c(); + if_block.m(if_block_anchor.parentNode, if_block_anchor); + } + } else if (if_block) { + if_block.u(); + if_block.d(); + if_block = null; + } + }, + + u: function unmount() { + if (if_block) if_block.u(); + detachNode(if_block_anchor); + }, + + d: function destroy() { + if (if_block) if_block.d(); + } + }; +} + +// (1:0) {#if foo} +function create_if_block(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "foo!"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/if-block-simple/expected.js b/test/js/samples/if-block-simple/expected.js index b3447471d31e..e5e83f73661c 100644 --- a/test/js/samples/if-block-simple/expected.js +++ b/test/js/samples/if-block-simple/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createComment, createElement, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createComment, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var if_block_anchor; @@ -64,17 +64,17 @@ function create_if_block(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 bd3bacfac27a..580c6472e273 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -174,18 +176,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/inline-style-optimized-multiple/expected-v2.js b/test/js/samples/inline-style-optimized-multiple/expected-v2.js new file mode 100644 index 000000000000..7a94993b690c --- /dev/null +++ b/test/js/samples/inline-style-optimized-multiple/expected-v2.js @@ -0,0 +1,53 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div; + + return { + c: function create() { + div = createElement("div"); + this.h(); + }, + + h: function hydrate() { + setStyle(div, "color", state.color); + setStyle(div, "transform", "translate(" + state.x + "px," + state.y + "px)"); + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + }, + + p: function update(changed, state) { + if (changed.color) { + setStyle(div, "color", state.color); + } + + if (changed.x || changed.y) { + setStyle(div, "transform", "translate(" + state.x + "px," + state.y + "px)"); + } + }, + + u: function unmount() { + detachNode(div); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index 7a94993b690c..9a7ec51e84fe 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop, setStyle } from "svelte/shared.js"; function create_main_fragment(component, state) { var div; @@ -37,17 +37,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 411990568209..51a04d5de472 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -169,18 +171,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/inline-style-optimized-url/expected-v2.js b/test/js/samples/inline-style-optimized-url/expected-v2.js new file mode 100644 index 000000000000..5a27ecfa4948 --- /dev/null +++ b/test/js/samples/inline-style-optimized-url/expected-v2.js @@ -0,0 +1,48 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div; + + return { + c: function create() { + div = createElement("div"); + this.h(); + }, + + h: function hydrate() { + setStyle(div, "background", "url(data:image/png;base64," + state.data + ")"); + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + }, + + p: function update(changed, state) { + if (changed.data) { + setStyle(div, "background", "url(data:image/png;base64," + state.data + ")"); + } + }, + + u: function unmount() { + detachNode(div); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 5a27ecfa4948..c8bdab407851 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop, setStyle } from "svelte/shared.js"; function create_main_fragment(component, state) { var div; @@ -32,17 +32,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index 7643ee066d12..1acfac36ec13 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -169,18 +171,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/inline-style-optimized/expected-v2.js b/test/js/samples/inline-style-optimized/expected-v2.js new file mode 100644 index 000000000000..86dabe8d21e1 --- /dev/null +++ b/test/js/samples/inline-style-optimized/expected-v2.js @@ -0,0 +1,48 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div; + + return { + c: function create() { + div = createElement("div"); + this.h(); + }, + + h: function hydrate() { + setStyle(div, "color", state.color); + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + }, + + p: function update(changed, state) { + if (changed.color) { + setStyle(div, "color", state.color); + } + }, + + u: function unmount() { + detachNode(div); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index 86dabe8d21e1..444f3307d80a 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto, setStyle } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop, setStyle } from "svelte/shared.js"; function create_main_fragment(component, state) { var div; @@ -32,17 +32,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 67b27347432a..6e7d53f05529 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -25,116 +25,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -180,18 +182,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/inline-style-unoptimized/expected-v2.js b/test/js/samples/inline-style-unoptimized/expected-v2.js new file mode 100644 index 000000000000..7d7e933c1226 --- /dev/null +++ b/test/js/samples/inline-style-unoptimized/expected-v2.js @@ -0,0 +1,59 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div, text, div_1, div_1_style_value; + + return { + c: function create() { + div = createElement("div"); + text = createText("\n"); + div_1 = createElement("div"); + this.h(); + }, + + h: function hydrate() { + div.style.cssText = state.style; + div_1.style.cssText = div_1_style_value = "" + state.key + ": " + state.value; + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + insertNode(text, target, anchor); + insertNode(div_1, target, anchor); + }, + + p: function update(changed, state) { + if (changed.style) { + div.style.cssText = state.style; + } + + if ((changed.key || changed.value) && div_1_style_value !== (div_1_style_value = "" + state.key + ": " + state.value)) { + div_1.style.cssText = div_1_style_value; + } + }, + + u: function unmount() { + detachNode(div); + detachNode(text); + detachNode(div_1); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index 7d7e933c1226..325d4e1e6c59 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, createElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var div, text, div_1, div_1_style_value; @@ -43,17 +43,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 e881aa6de460..ecc959165d76 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -33,116 +33,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -178,24 +180,24 @@ function create_main_fragment(component, state) { detachNode(input); }, - d: function destroy$$1() { + d: function destroy() { removeListener(input, "change", input_change_handler); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index ba99db454176..304614a6899f 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { addListener, assign, createElement, detachNode, init, insertNode, proto, removeListener, setAttribute } from "svelte/shared.js"; +import { Component, addListener, assign, createElement, detachNode, insertNode, removeListener, setAttribute } from "svelte/shared.js"; function create_main_fragment(component, state) { var input; @@ -39,17 +39,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 1119454b3db6..c0c999208842 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -27,116 +27,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -167,18 +169,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/legacy-input-type/expected.js b/test/js/samples/legacy-input-type/expected.js index 2426c064817c..2b4bcb75c433 100644 --- a/test/js/samples/legacy-input-type/expected.js +++ b/test/js/samples/legacy-input-type/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, createElement, detachNode, init, insertNode, noop, proto, setInputType } from "svelte/shared.js"; +import { Component, assign, createElement, detachNode, insertNode, noop, setInputType } from "svelte/shared.js"; function create_main_fragment(component, state) { var input; @@ -28,17 +28,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index abcdd409862d..18ee72e67c91 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -37,116 +37,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -221,7 +223,7 @@ function create_main_fragment(component, state) { detachNode(audio); }, - d: function destroy$$1() { + d: function destroy() { removeListener(audio, "timeupdate", audio_timeupdate_handler); removeListener(audio, "durationchange", audio_durationchange_handler); removeListener(audio, "play", audio_play_pause_handler); @@ -233,25 +235,25 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - callAll(this._beforecreate); + callAll(this._beforecreate); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index a395dd4385eb..9e424a5c65c5 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { addListener, assign, callAll, createElement, detachNode, init, insertNode, proto, removeListener, timeRangesToArray } from "svelte/shared.js"; +import { Component, addListener, assign, callAll, createElement, detachNode, insertNode, removeListener, timeRangesToArray } from "svelte/shared.js"; function create_main_fragment(component, state) { var audio, audio_is_paused = true, audio_updating = false, audio_animationframe; @@ -84,24 +84,24 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - callAll(this._beforecreate); + callAll(this._beforecreate); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index b4adec303a0a..475268755dc7 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -23,116 +23,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -170,37 +172,37 @@ function create_main_fragment(component, state) { nonimported._unmount(); }, - d: function destroy$$1() { + d: function destroy() { imported.destroy(false); nonimported.destroy(false); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + 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/non-imported-component/expected.js b/test/js/samples/non-imported-component/expected.js index c1637b7cc486..830b989a7279 100644 --- a/test/js/samples/non-imported-component/expected.js +++ b/test/js/samples/non-imported-component/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, callAll, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, assign, callAll, createText, detachNode, insertNode, noop } from "svelte/shared.js"; import Imported from 'Imported.html'; @@ -43,29 +43,29 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); - this._lock = true; - callAll(this._beforecreate); - callAll(this._oncreate); - callAll(this._aftercreate); - this._lock = false; + 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/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index e1aaa9ae759a..272fe733b40a 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -9,116 +9,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -128,14 +130,14 @@ var methods = { } }; -function setup(Component) { - Component.SOME_CONSTANT = 42; - Component.factory = function (target) { - return new Component({ +function setup(Component$$1) { + Component$$1.SOME_CONSTANT = 42; + Component$$1.factory = function (target) { + return new Component$$1({ target: target }); }; - Component.prototype.foo( 'baz' ); + Component$$1.prototype.foo( 'baz' ); } function create_main_fragment(component, state) { @@ -153,19 +155,20 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); assign(SvelteComponent.prototype, methods); setup(SvelteComponent); diff --git a/test/js/samples/setup-method/expected.js b/test/js/samples/setup-method/expected.js index d39c4288e377..ed4ac240bee2 100644 --- a/test/js/samples/setup-method/expected.js +++ b/test/js/samples/setup-method/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, init, noop, proto } from "svelte/shared.js"; +import { Component, assign, noop } from "svelte/shared.js"; var methods = { foo ( bar ) { @@ -32,19 +32,20 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); assign(SvelteComponent.prototype, methods); setup(SvelteComponent); diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 477d97c83947..94d1d1587ddc 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -29,116 +29,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -168,18 +170,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/svg-title/expected.js b/test/js/samples/svg-title/expected.js index 3f7ea0b8e9c5..592aa300b111 100644 --- a/test/js/samples/svg-title/expected.js +++ b/test/js/samples/svg-title/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createSvgElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createSvgElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var svg, title, text; @@ -27,17 +27,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 27cae18b3d14..2d58cecb32cc 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -9,116 +9,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -144,18 +146,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/title/expected-v2.js b/test/js/samples/title/expected-v2.js new file mode 100644 index 000000000000..0e059bbb4c67 --- /dev/null +++ b/test/js/samples/title/expected-v2.js @@ -0,0 +1,39 @@ +/* generated by Svelte vX.Y.Z */ +import { assign, init, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var title_value; + + document.title = title_value = "a " + state.custom + " title"; + + return { + c: noop, + + m: noop, + + p: function update(changed, state) { + if ((changed.custom) && title_value !== (title_value = "a " + state.custom + " title")) { + document.title = title_value; + } + }, + + u: noop, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index 0e059bbb4c67..db4821063a94 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { assign, init, noop, proto } from "svelte/shared.js"; +import { Component, assign, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var title_value; @@ -23,17 +23,17 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file 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 1fda063de122..634f34e04a8c 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -33,116 +33,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -271,7 +273,7 @@ function create_main_fragment(component, state) { detachNode(if_block_4_anchor); }, - d: function destroy$$1() { + d: function destroy() { if (if_block) if_block.d(); if (if_block_1) if_block_1.d(); if (if_block_2) if_block_2.d(); @@ -391,18 +393,18 @@ function create_if_block_4(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/use-elements-as-anchors/expected-v2.js b/test/js/samples/use-elements-as-anchors/expected-v2.js new file mode 100644 index 000000000000..d9cff08d3f98 --- /dev/null +++ b/test/js/samples/use-elements-as-anchors/expected-v2.js @@ -0,0 +1,262 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createComment, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var div, text, p, text_2, text_3, text_4, p_1, text_6, text_8, if_block_4_anchor; + + var if_block = (state.a) && create_if_block(component, state); + + var if_block_1 = (state.b) && create_if_block_1(component, state); + + var if_block_2 = (state.c) && create_if_block_2(component, state); + + var if_block_3 = (state.d) && create_if_block_3(component, state); + + var if_block_4 = (state.e) && create_if_block_4(component, state); + + return { + c: function create() { + div = createElement("div"); + if (if_block) if_block.c(); + text = createText("\n\n\t"); + p = createElement("p"); + p.textContent = "this can be used as an anchor"; + text_2 = createText("\n\n\t"); + if (if_block_1) if_block_1.c(); + text_3 = createText("\n\n\t"); + if (if_block_2) if_block_2.c(); + text_4 = createText("\n\n\t"); + p_1 = createElement("p"); + p_1.textContent = "so can this"; + text_6 = createText("\n\n\t"); + if (if_block_3) if_block_3.c(); + text_8 = createText("\n\n"); + if (if_block_4) if_block_4.c(); + if_block_4_anchor = createComment(); + }, + + m: function mount(target, anchor) { + insertNode(div, target, anchor); + if (if_block) if_block.m(div, null); + appendNode(text, div); + appendNode(p, div); + appendNode(text_2, div); + if (if_block_1) if_block_1.m(div, null); + appendNode(text_3, div); + if (if_block_2) if_block_2.m(div, null); + appendNode(text_4, div); + appendNode(p_1, div); + appendNode(text_6, div); + if (if_block_3) if_block_3.m(div, null); + insertNode(text_8, target, anchor); + if (if_block_4) if_block_4.m(target, anchor); + insertNode(if_block_4_anchor, target, anchor); + }, + + p: function update(changed, state) { + if (state.a) { + if (!if_block) { + if_block = create_if_block(component, state); + if_block.c(); + if_block.m(div, text); + } + } else if (if_block) { + if_block.u(); + if_block.d(); + if_block = null; + } + + if (state.b) { + if (!if_block_1) { + if_block_1 = create_if_block_1(component, state); + if_block_1.c(); + if_block_1.m(div, text_3); + } + } else if (if_block_1) { + if_block_1.u(); + if_block_1.d(); + if_block_1 = null; + } + + if (state.c) { + if (!if_block_2) { + if_block_2 = create_if_block_2(component, state); + if_block_2.c(); + if_block_2.m(div, text_4); + } + } else if (if_block_2) { + if_block_2.u(); + if_block_2.d(); + if_block_2 = null; + } + + if (state.d) { + if (!if_block_3) { + if_block_3 = create_if_block_3(component, state); + if_block_3.c(); + if_block_3.m(div, null); + } + } else if (if_block_3) { + if_block_3.u(); + if_block_3.d(); + if_block_3 = null; + } + + if (state.e) { + if (!if_block_4) { + if_block_4 = create_if_block_4(component, state); + if_block_4.c(); + if_block_4.m(if_block_4_anchor.parentNode, if_block_4_anchor); + } + } else if (if_block_4) { + if_block_4.u(); + if_block_4.d(); + if_block_4 = null; + } + }, + + u: function unmount() { + detachNode(div); + if (if_block) if_block.u(); + if (if_block_1) if_block_1.u(); + if (if_block_2) if_block_2.u(); + if (if_block_3) if_block_3.u(); + detachNode(text_8); + if (if_block_4) if_block_4.u(); + detachNode(if_block_4_anchor); + }, + + d: function destroy() { + if (if_block) if_block.d(); + if (if_block_1) if_block_1.d(); + if (if_block_2) if_block_2.d(); + if (if_block_3) if_block_3.d(); + if (if_block_4) if_block_4.d(); + } + }; +} + +// (2:1) {#if a} +function create_if_block(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "a"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +// (8:1) {#if b} +function create_if_block_1(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "b"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +// (12:1) {#if c} +function create_if_block_2(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "c"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +// (18:1) {#if d} +function create_if_block_3(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "d"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +// (25:0) {#if e} +function create_if_block_4(component, state) { + var p; + + return { + c: function create() { + p = createElement("p"); + p.textContent = "e"; + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + }, + + u: function unmount() { + detachNode(p); + }, + + d: noop + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/use-elements-as-anchors/expected.js b/test/js/samples/use-elements-as-anchors/expected.js index d9cff08d3f98..08c16e2a1e18 100644 --- a/test/js/samples/use-elements-as-anchors/expected.js +++ b/test/js/samples/use-elements-as-anchors/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createComment, createElement, createText, detachNode, init, insertNode, noop, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createComment, createElement, createText, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var div, text, p, text_2, text_3, text_4, p_1, text_6, text_8, if_block_4_anchor; @@ -246,17 +246,17 @@ function create_if_block_4(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index df4fc6b2c981..e39ce136922f 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -29,116 +29,118 @@ 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'); -} +// TODO need to think of a suitable name for this +class Thing { + constructor() { + this._handlers = blankObject(); + } -function fire(eventName, data) { - var handlers = - eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; - for (var i = 0; i < handlers.length; i += 1) { - var handler = handlers[i]; + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } -} -function get() { - return this._state; -} + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); -function init(component, options) { - component._handlers = blankObject(); - component._bind = options._bind; + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } - component.options = options; - component.root = options.root || component; - component.store = component.root.store || options.store; + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } } -function on(eventName, handler) { - var handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); +class Component extends Thing { + constructor(options) { + super(); + this._bind = options._bind; - return { - cancel: function() { - var index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; -} + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } -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; -} + destroy(detach) { + this.destroy = noop; + this.fire('destroy'); + this.set = this.get = noop; -function _set(newState) { - var oldState = this._state, - changed = {}, - dirty = false; + if (detach !== false) this._fragment.u(); + this._fragment.d(); + this._fragment = this._state = null; + } - for (var key in newState) { - if (this._differs(newState[key], oldState[key])) changed[key] = dirty = true; + 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; } - if (!dirty) return; - this._state = assign(assign({}, oldState), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); - if (this._fragment) { - this.fire("state", { changed: changed, current: this._state, previous: oldState }); - this._fragment.p(changed, this._state); - this.fire("update", { changed: changed, current: this._state, previous: oldState }); + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } } -} -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} -function _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + _unmount() { + if (this._fragment) this._fragment.u(); + } } -function _unmount() { - if (this._fragment) this._fragment.u(); +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; } -var proto = { - destroy, - get, - fire, - on, - set, - _recompute: noop, - _set, - _mount, - _unmount, - _differs -}; +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} /* generated by Svelte vX.Y.Z */ @@ -188,25 +190,25 @@ function create_main_fragment(component, state) { detachNode(p); }, - d: function destroy$$1() { + d: function destroy() { window.removeEventListener("scroll", onwindowscroll); } }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); - this._state.y = window.pageYOffset; +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + this._state.y = window.pageYOffset; - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } -assign(SvelteComponent.prototype, proto); - export default SvelteComponent; diff --git a/test/js/samples/window-binding-scroll/expected-v2.js b/test/js/samples/window-binding-scroll/expected-v2.js new file mode 100644 index 000000000000..59009aeb9b99 --- /dev/null +++ b/test/js/samples/window-binding-scroll/expected-v2.js @@ -0,0 +1,68 @@ +/* generated by Svelte vX.Y.Z */ +import { appendNode, assign, createElement, createText, detachNode, init, insertNode, proto } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + var window_updating = false, clear_window_updating = function() { window_updating = false; }, window_updating_timeout, p, text, text_1; + + function onwindowscroll(event) { + if (window_updating) return; + window_updating = true; + + component.set({ + y: this.pageYOffset + }); + window_updating = false; + } + window.addEventListener("scroll", onwindowscroll); + + component.observe("y", function(y) { + window_updating = true; + clearTimeout(window_updating_timeout); + window.scrollTo(window.pageXOffset, y); + window_updating_timeout = setTimeout(clear_window_updating, 100); + }); + + return { + c: function create() { + p = createElement("p"); + text = createText("scrolled to "); + text_1 = createText(state.y); + }, + + m: function mount(target, anchor) { + insertNode(p, target, anchor); + appendNode(text, p); + appendNode(text_1, p); + }, + + p: function update(changed, state) { + if (changed.y) { + text_1.data = state.y; + } + }, + + u: function unmount() { + detachNode(p); + }, + + d: function destroy() { + window.removeEventListener("scroll", onwindowscroll); + } + }; +} + +function SvelteComponent(options) { + init(this, options); + this._state = assign({}, options.data); + this._state.y = window.pageYOffset; + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } +} + +assign(SvelteComponent.prototype, proto); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index d18b35687ed9..0dd9f98cc505 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, createText, detachNode, init, insertNode, proto } from "svelte/shared.js"; +import { Component, appendNode, assign, createElement, createText, detachNode, insertNode } from "svelte/shared.js"; function create_main_fragment(component, state) { var window_updating = false, clear_window_updating = function() { window_updating = false; }, window_updating_timeout, p, text, text_1; @@ -53,18 +53,18 @@ function create_main_fragment(component, state) { }; } -function SvelteComponent(options) { - init(this, options); - this._state = assign({}, options.data); - this._state.y = window.pageYOffset; +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + this._state.y = window.pageYOffset; - this._fragment = create_main_fragment(this, this._state); + this._fragment = create_main_fragment(this, this._state); - if (options.target) { - this._fragment.c(); - this._mount(options.target, options.anchor); + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } } } - -assign(SvelteComponent.prototype, proto); export default SvelteComponent; \ No newline at end of file From 080cbd0052dc63dbce147cd5b9a70895c2df5469 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 20 Apr 2018 20:59:32 -0400 Subject: [PATCH 2/9] rename Thing to Base --- src/generators/dom/index.ts | 3 ++- src/shared/index.js | 5 ++--- store.js | 4 ++-- test/js/samples/action/expected-bundle.js | 5 ++--- .../collapses-text-around-comments/expected-bundle.js | 5 ++--- .../js/samples/component-static-immutable/expected-bundle.js | 5 ++--- .../samples/component-static-immutable2/expected-bundle.js | 5 ++--- test/js/samples/component-static/expected-bundle.js | 5 ++--- test/js/samples/computed-collapsed-if/expected-bundle.js | 5 ++--- test/js/samples/css-media-query/expected-bundle.js | 5 ++--- test/js/samples/css-shadow-dom-keyframes/expected-bundle.js | 5 ++--- test/js/samples/deconflict-builtins/expected-bundle.js | 5 ++--- test/js/samples/deconflict-globals/expected-bundle.js | 5 ++--- .../dev-warning-missing-data-computed/expected-bundle.js | 5 ++--- test/js/samples/do-use-dataset/expected-bundle.js | 5 ++--- .../js/samples/dont-use-dataset-in-legacy/expected-bundle.js | 5 ++--- test/js/samples/dont-use-dataset-in-svg/expected-bundle.js | 5 ++--- test/js/samples/each-block-changed-check/expected-bundle.js | 5 ++--- test/js/samples/event-handlers-custom/expected-bundle.js | 5 ++--- test/js/samples/head-no-whitespace/expected-bundle.js | 5 ++--- test/js/samples/if-block-no-update/expected-bundle.js | 5 ++--- test/js/samples/if-block-simple/expected-bundle.js | 5 ++--- .../inline-style-optimized-multiple/expected-bundle.js | 5 ++--- .../js/samples/inline-style-optimized-url/expected-bundle.js | 5 ++--- test/js/samples/inline-style-optimized/expected-bundle.js | 5 ++--- test/js/samples/inline-style-unoptimized/expected-bundle.js | 5 ++--- .../samples/input-without-blowback-guard/expected-bundle.js | 5 ++--- test/js/samples/legacy-input-type/expected-bundle.js | 5 ++--- test/js/samples/media-bindings/expected-bundle.js | 5 ++--- test/js/samples/non-imported-component/expected-bundle.js | 5 ++--- test/js/samples/setup-method/expected-bundle.js | 5 ++--- test/js/samples/svg-title/expected-bundle.js | 5 ++--- test/js/samples/title/expected-bundle.js | 5 ++--- test/js/samples/use-elements-as-anchors/expected-bundle.js | 5 ++--- test/js/samples/window-binding-scroll/expected-bundle.js | 5 ++--- test/runtime/index.js | 2 +- test/runtime/samples/attribute-partial-number/_config.js | 1 + 37 files changed, 72 insertions(+), 103 deletions(-) diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index dfe1a8c0b8ad..5f516e40ff96 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -406,7 +406,7 @@ export default function dom( // super gross hack to ensure Component isn't declared before its superclass usedHelpers.delete('Component'); - usedHelpers.add('Thing').add('Component'); + usedHelpers.add('Base').add('Component'); usedHelpers.forEach(key => { const str = shared[key]; @@ -449,6 +449,7 @@ export default function dom( inlineHelpers += `var ${generator.alias('transitionManager')} = window.${global} || (window.${global} = ${code});\n\n`; } else { const alias = generator.alias(expression.id.name); + if (alias !== expression.id.name) code.overwrite(expression.id.start, expression.id.end, alias); diff --git a/src/shared/index.js b/src/shared/index.js index b93a7543572c..21cb0aadfb71 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -10,8 +10,7 @@ export function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -export class Thing { +export class Base { constructor() { this._handlers = blankObject(); } @@ -52,7 +51,7 @@ export class Thing { } } -export class Component extends Thing { +export class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/store.js b/store.js index 59d40618ade6..0b40ea2c9221 100644 --- a/store.js +++ b/store.js @@ -1,11 +1,11 @@ import { - Thing, + Base, assign, blankObject, _differsImmutable } from './shared.js'; -class Store extends Thing { +class Store extends Base { constructor(state, options) { super(); diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 4cca72e910eb..9bfb8f37f63c 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -21,8 +21,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -63,7 +62,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 5e04dd681734..a560a9ab4015 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js index 027e6c7cd01c..629fdb91aeca 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js index 027e6c7cd01c..629fdb91aeca 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index 8cd994bbc40c..566baf566970 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index 5183205365e8..378d29292983 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 9a8fd8e81ed7..b28d3e04421a 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 cce0a24212ce..772a78de823b 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -21,8 +21,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -63,7 +62,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index 284f281fd88a..768107650dcf 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -39,8 +39,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -81,7 +80,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index 73a4e1c20bb7..9a46bec4b4ad 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 8e0ccbcf02ec..34cb7a388b04 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 2d544b5c15d7..18b24b0bdb21 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 7a661b32a20e..5adcc498bd31 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 @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 b2b7814ea6a3..f1bbc9b54bf0 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 @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 d77c249371ef..6062af65f7eb 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -41,8 +41,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -83,7 +82,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 10e888c5f95a..7c84b614e9a4 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -21,8 +21,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -63,7 +62,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 585e44bd3b74..06df9d7a232a 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -21,8 +21,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -63,7 +62,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 4eb0bf8bcba5..51829be7ed0e 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index 85e13f2375a1..d60da676522a 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 580c6472e273..9bac3d0f5ce7 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 51a04d5de472..39a7a07416e6 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index 1acfac36ec13..ee16d0111118 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 6e7d53f05529..9d166cfae16b 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -25,8 +25,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -67,7 +66,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 ecc959165d76..33186f7766e2 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -33,8 +33,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -75,7 +74,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index c0c999208842..9967d0adfac0 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -27,8 +27,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -69,7 +68,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index 18ee72e67c91..86cdf03519a6 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -37,8 +37,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -79,7 +78,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index 475268755dc7..f10b7ab3fba1 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -23,8 +23,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -65,7 +64,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 272fe733b40a..fb56f8acb97e 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 94d1d1587ddc..5293239c69eb 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 2d58cecb32cc..acbf1fb3577b 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -9,8 +9,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -51,7 +50,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; 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 634f34e04a8c..1c5605083399 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -33,8 +33,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -75,7 +74,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index e39ce136922f..7a9100730846 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -29,8 +29,7 @@ function blankObject() { return Object.create(null); } -// TODO need to think of a suitable name for this -class Thing { +class Base { constructor() { this._handlers = blankObject(); } @@ -71,7 +70,7 @@ class Thing { } } -class Component extends Thing { +class Component extends Base { constructor(options) { super(); this._bind = options._bind; diff --git a/test/runtime/index.js b/test/runtime/index.js index 199a9a0c9ba0..8f37b7bb8402 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -25,7 +25,7 @@ function getName(filename) { return base[0].toUpperCase() + base.slice(1); } -describe("runtime", () => { +describe.only("runtime", () => { before(() => { svelte = loadSvelte(false); svelte$ = loadSvelte(true); diff --git a/test/runtime/samples/attribute-partial-number/_config.js b/test/runtime/samples/attribute-partial-number/_config.js index 03d7168694f3..8b7c03cd93f5 100644 --- a/test/runtime/samples/attribute-partial-number/_config.js +++ b/test/runtime/samples/attribute-partial-number/_config.js @@ -1,3 +1,4 @@ export default { + solo: true, html: '

' }; From b9311393fa3bf3d1ef647b9adf7541c7344f8a45 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 20 Apr 2018 21:54:40 -0400 Subject: [PATCH 3/9] fix double output logging --- test/runtime/index.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/test/runtime/index.js b/test/runtime/index.js index 8f37b7bb8402..d5506c0c6d54 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -110,12 +110,7 @@ describe.only("runtime", () => { }; }; - try { - SvelteComponent = require(`./samples/${dir}/main.html`); - } catch (err) { - showOutput(cwd, { shared, format: 'cjs', hydratable: hydrate, store: !!compileOptions.store }, compile); // eslint-disable-line no-console - throw err; - } + SvelteComponent = require(`./samples/${dir}/main.html`); global.window = window; From f4e327ea5268437719d0884fe953f3b0c5d26e83 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 20 Apr 2018 22:03:05 -0400 Subject: [PATCH 4/9] fix some naming conflicts --- src/generators/Generator.ts | 2 +- src/generators/dom/index.ts | 4 +++- test/runtime/index.js | 2 +- test/runtime/samples/attribute-partial-number/_config.js | 1 - 4 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/generators/Generator.ts b/src/generators/Generator.ts index 0b9b2eee9a67..a243cb96a0d2 100644 --- a/src/generators/Generator.ts +++ b/src/generators/Generator.ts @@ -174,7 +174,7 @@ export default class Generator { this.templateProperties = {}; this.walkJs(dom); - this.name = this.alias(name); + this.name = this.getUniqueName(name); if (options.customElement === true) { this.customElement = { diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 5f516e40ff96..5a1a678e6369 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -404,9 +404,11 @@ export default function dom( } else { let inlineHelpers = ''; - // super gross hack to ensure Component isn't declared before its superclass + // super gross hack to ensure Component isn't declared before Base usedHelpers.delete('Component'); + usedHelpers.delete('ComponentDev'); usedHelpers.add('Base').add('Component'); + if (generator.options.dev) usedHelpers.add('ComponentDev'); usedHelpers.forEach(key => { const str = shared[key]; diff --git a/test/runtime/index.js b/test/runtime/index.js index d5506c0c6d54..52edb6f42284 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -25,7 +25,7 @@ function getName(filename) { return base[0].toUpperCase() + base.slice(1); } -describe.only("runtime", () => { +describe("runtime", () => { before(() => { svelte = loadSvelte(false); svelte$ = loadSvelte(true); diff --git a/test/runtime/samples/attribute-partial-number/_config.js b/test/runtime/samples/attribute-partial-number/_config.js index 8b7c03cd93f5..03d7168694f3 100644 --- a/test/runtime/samples/attribute-partial-number/_config.js +++ b/test/runtime/samples/attribute-partial-number/_config.js @@ -1,4 +1,3 @@ export default { - solo: true, html: '

' }; From b606dd62bbd9a4b84d55ea1c1cdb456f02b8d447 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 20 Apr 2018 23:10:46 -0400 Subject: [PATCH 5/9] get custom elements working etc --- src/generators/dom/index.ts | 29 +++++++++--------- src/shared/index.js | 22 ++++++++++---- test/custom-elements/index.js | 4 +++ test/js/samples/action/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../component-static/expected-bundle.js | 14 +++++---- .../computed-collapsed-if/expected-bundle.js | 14 +++++---- .../css-media-query/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 30 ++++++++++++++----- .../css-shadow-dom-keyframes/expected.js | 18 +++++++++-- .../deconflict-builtins/expected-bundle.js | 14 +++++---- .../deconflict-globals/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 23 ++++++++++---- .../expected.js | 1 - .../samples/do-use-dataset/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../event-handlers-custom/expected-bundle.js | 14 +++++---- .../head-no-whitespace/expected-bundle.js | 14 +++++---- .../if-block-no-update/expected-bundle.js | 14 +++++---- .../if-block-simple/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../inline-style-optimized/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../legacy-input-type/expected-bundle.js | 14 +++++---- .../samples/media-bindings/expected-bundle.js | 14 +++++---- .../non-imported-component/expected-bundle.js | 14 +++++---- .../samples/setup-method/expected-bundle.js | 14 +++++---- test/js/samples/svg-title/expected-bundle.js | 14 +++++---- test/js/samples/title/expected-bundle.js | 14 +++++---- .../expected-bundle.js | 14 +++++---- .../window-binding-scroll/expected-bundle.js | 14 +++++---- 37 files changed, 360 insertions(+), 187 deletions(-) diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 5a1a678e6369..dc62ed136f27 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -133,17 +133,6 @@ export default function dom( ? 'svelte/shared.js' : options.shared || ''; - let prototypeBase = `${name}.prototype`; - - const proto = sharedPath - ? `@Component.prototype` - : deindent` - { - ${['destroy', 'get', 'fire', 'on', 'set', '_set', '_mount', '_unmount', '_differs'] - .map(n => `${n}: @${n}`) - .join(',\n')} - }`; - const debugName = `<${generator.customElement ? generator.tag : name}>`; // generate initial state object @@ -172,8 +161,6 @@ export default function dom( const constructorBody = deindent` ${options.dev && `this._debugName = '${debugName}';`} - ${options.dev && !generator.customElement && - `if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option");`} ${templateProperties.store && `this.store = %store();`} ${generator.usesRefs && `this.refs = {};`} this._state = ${initialState.reduce((state, piece) => `@assign(${state}, ${piece})`)}; @@ -280,6 +267,8 @@ export default function dom( class ${name} extends HTMLElement { constructor(options = {}) { super(); + this._handlers = {}; + this._init.call(this, options); ${constructorBody} } @@ -319,8 +308,16 @@ export default function dom( `} } - customElements.define("${generator.tag}", ${name}); - @assign(@assign(${prototypeBase}, ${proto}), { + Object.getOwnPropertyNames(${generator.options.dev ? `Object.getPrototypeOf(@Component.prototype)` : `@Component.prototype`}).forEach(name => { + ${name}.prototype[name] = @Component.prototype[name]; + }); + + @assign(${name}.prototype, { + fire: @Base.prototype.fire, + get: @Base.prototype.get, + on: @Base.prototype.on, + _differs: @Base.prototype._differs, + _mount(target, anchor) { target.insertBefore(this, anchor); }, @@ -329,6 +326,8 @@ export default function dom( this.parentNode.removeChild(this); } }); + + customElements.define("${generator.tag}", ${name}); `); } else { // TODO put methods in class body diff --git a/src/shared/index.js b/src/shared/index.js index 21cb0aadfb71..020a8f399cf8 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -54,11 +54,7 @@ export class Base { export class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -81,6 +77,14 @@ export class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; @@ -115,6 +119,14 @@ export class Component extends Base { } export class ComponentDev extends Component { + constructor(options) { + if (!options || (!options.target && !options.root)) { + throw new Error(`'target' is a required option`); + } + + super(options); + } + destroy(detach) { super.destroy(detach); this.destroy = () => { diff --git a/test/custom-elements/index.js b/test/custom-elements/index.js index 7675e0c188b6..52d4b7da59b8 100644 --- a/test/custom-elements/index.js +++ b/test/custom-elements/index.js @@ -23,6 +23,10 @@ describe('custom-elements', function() { console[type](...args); }); + nightmare.on('page', (type, message, stack) => { + console.error(stack); + }); + let svelte; let server; let bundle; diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 9bfb8f37f63c..6b0da6f682ef 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -65,11 +65,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -92,6 +88,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 a560a9ab4015..301d76348501 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js index 629fdb91aeca..99898b6e0997 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js index 629fdb91aeca..99898b6e0997 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index 566baf566970..dd979af51e75 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index 378d29292983..1c4e9fb1e66d 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index b28d3e04421a..97405307963b 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 772a78de823b..b772989469bf 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -65,11 +65,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -92,6 +88,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; @@ -162,6 +166,8 @@ function create_main_fragment(component, state) { class SvelteComponent extends HTMLElement { constructor(options = {}) { super(); + this._handlers = {}; + this._init.call(this, options); this._state = assign({}, options.data); this.attachShadow({ mode: 'open' }); @@ -184,8 +190,16 @@ class SvelteComponent extends HTMLElement { } } -customElements.define("custom-element", SvelteComponent); -assign(assign(SvelteComponent.prototype, Component.prototype), { +Object.getOwnPropertyNames(Component.prototype).forEach(name => { + SvelteComponent.prototype[name] = Component.prototype[name]; +}); + +assign(SvelteComponent.prototype, { + fire: Base.prototype.fire, + get: Base.prototype.get, + on: Base.prototype.on, + _differs: Base.prototype._differs, + _mount(target, anchor) { target.insertBefore(this, anchor); }, @@ -195,4 +209,6 @@ assign(assign(SvelteComponent.prototype, Component.prototype), { } }); +customElements.define("custom-element", SvelteComponent); + export default SvelteComponent; diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js index 2487f11d974a..431e4e0b0cae 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected.js @@ -1,5 +1,5 @@ /* generated by Svelte vX.Y.Z */ -import { Component, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; +import { Base, Component, assign, createElement, detachNode, insertNode, noop } from "svelte/shared.js"; function create_main_fragment(component, state) { var div; @@ -28,6 +28,8 @@ function create_main_fragment(component, state) { class SvelteComponent extends HTMLElement { constructor(options = {}) { super(); + this._handlers = {}; + this._init.call(this, options); this._state = assign({}, options.data); this.attachShadow({ mode: 'open' }); @@ -50,8 +52,16 @@ class SvelteComponent extends HTMLElement { } } -customElements.define("custom-element", SvelteComponent); -assign(assign(SvelteComponent.prototype, Component.prototype), { +Object.getOwnPropertyNames(Component.prototype).forEach(name => { + SvelteComponent.prototype[name] = Component.prototype[name]; +}); + +assign(SvelteComponent.prototype, { + fire: Base.prototype.fire, + get: Base.prototype.get, + on: Base.prototype.on, + _differs: Base.prototype._differs, + _mount(target, anchor) { target.insertBefore(this, anchor); }, @@ -60,4 +70,6 @@ assign(assign(SvelteComponent.prototype, Component.prototype), { this.parentNode.removeChild(this); } }); + +customElements.define("custom-element", SvelteComponent); export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index 768107650dcf..5cd3fb63a1fb 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -83,11 +83,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -110,6 +106,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index 9a46bec4b4ad..1bb8e1cb1542 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 34cb7a388b04..9ca15e534ee2 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; @@ -134,6 +138,14 @@ class Component extends Base { } class ComponentDev extends Component { + constructor(options) { + if (!options || (!options.target && !options.root)) { + throw new Error(`'target' is a required option`); + } + + super(options); + } + destroy(detach) { super.destroy(detach); this.destroy = () => { @@ -205,7 +217,6 @@ class SvelteComponent extends ComponentDev { constructor(options) { super(options); this._debugName = ''; - if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); this._state = assign({ Math : Math }, options.data); this._recompute({ foo: 1 }, this._state); if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index f01bfb85475a..5f59f4ad2f3e 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -45,7 +45,6 @@ class SvelteComponent extends ComponentDev { constructor(options) { super(options); this._debugName = ''; - if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); this._state = assign({ Math : Math }, options.data); this._recompute({ foo: 1 }, this._state); if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 18b24b0bdb21..0a1590ef9776 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 5adcc498bd31..c52d1e46af2a 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 @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 f1bbc9b54bf0..e8a1b20748a3 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 @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 6062af65f7eb..644030d9c0cc 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -85,11 +85,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -112,6 +108,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 7c84b614e9a4..42c74274e4b2 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -65,11 +65,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -92,6 +88,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 06df9d7a232a..1c249b5e365a 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -65,11 +65,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -92,6 +88,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 51829be7ed0e..d136aec41e39 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index d60da676522a..d50825b0dc33 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 9bac3d0f5ce7..f1ea22c66bce 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 39a7a07416e6..63fd122d3767 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index ee16d0111118..fc4c0c7e7a92 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 9d166cfae16b..408622931e75 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -69,11 +69,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -96,6 +92,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 33186f7766e2..a8c94e4aa7ce 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -77,11 +77,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -104,6 +100,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 9967d0adfac0..2483c6329e73 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -71,11 +71,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -98,6 +94,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index 86cdf03519a6..eef1e702d829 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -81,11 +81,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -108,6 +104,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index f10b7ab3fba1..81a7540dc17b 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -67,11 +67,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -94,6 +90,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index fb56f8acb97e..607d633226c8 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 5293239c69eb..8ba137a50098 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index acbf1fb3577b..8e75f1e4d665 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -53,11 +53,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -80,6 +76,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; 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 1c5605083399..53b53a7dbadf 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -77,11 +77,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -104,6 +100,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index 7a9100730846..3581e25a03d3 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -73,11 +73,7 @@ class Base { class Component extends Base { constructor(options) { super(); - this._bind = options._bind; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; + this._init(options); } destroy(detach) { @@ -100,6 +96,14 @@ class Component extends Base { this.root._lock = false; } + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + _set(newState) { const previous = this._state; const changed = {}; From 56f00b8e77d34395ca2d5987e3b5fc46f61f0eb6 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 21 Apr 2018 15:01:41 -0400 Subject: [PATCH 6/9] make _recompute a class method --- src/generators/dom/index.ts | 55 ++++++++++--------- .../computed-collapsed-if/expected-bundle.js | 12 ++-- .../samples/computed-collapsed-if/expected.js | 10 ++-- .../expected-bundle.js | 12 ++-- .../expected.js | 12 ++-- 5 files changed, 53 insertions(+), 48 deletions(-) diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index dc62ed136f27..caae873e8159 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -260,6 +260,14 @@ export default function dom( `} `; + const classMethods = []; + if (computations.length) { + classMethods.push(deindent` + _recompute(changed, state) { + ${computationBuilder} + }`); + } + if (generator.customElement) { const props = generator.props || Array.from(generator.expectedProperties); @@ -277,34 +285,35 @@ export default function dom( } ${props.map(prop => deindent` - get ${prop}() { - return this.get().${prop}; - } + get ${prop}() { + return this.get().${prop}; + } - set ${prop}(value) { - this.set({ ${prop}: value }); - } - `).join('\n\n')} + set ${prop}(value) { + this.set({ ${prop}: value }); + }`).join('\n\n')} + + ${classMethods.length && classMethods.join('\n\n')} ${generator.slots.size && deindent` - connectedCallback() { - Object.keys(this._slotted).forEach(key => { - this.appendChild(this._slotted[key]); - }); - }`} + connectedCallback() { + Object.keys(this._slotted).forEach(key => { + this.appendChild(this._slotted[key]); + }); + }`} attributeChangedCallback(attr, oldValue, newValue) { this.set({ [attr]: newValue }); } ${(generator.hasComponents || generator.hasComplexBindings || templateProperties.oncreate || generator.hasIntroTransitions) && deindent` - connectedCallback() { - ${generator.hasComponents && `this._lock = true;`} - ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} - ${(generator.hasComponents || templateProperties.oncreate) && `@callAll(this._oncreate);`} - ${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`} - ${generator.hasComponents && `this._lock = false;`} - } + connectedCallback() { + ${generator.hasComponents && `this._lock = true;`} + ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} + ${(generator.hasComponents || templateProperties.oncreate) && `@callAll(this._oncreate);`} + ${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`} + ${generator.hasComponents && `this._lock = false;`} + } `} } @@ -337,6 +346,8 @@ export default function dom( super(options); ${constructorBody} } + + ${classMethods.length && classMethods.join('\n\n')} } ${templateProperties.methods && `@assign(${name}.prototype, %methods);`} @@ -355,12 +366,6 @@ export default function dom( }; `} - ${computations.length ? deindent` - ${name}.prototype._recompute = function _recompute(changed, state) { - ${computationBuilder} - } - ` : (!sharedPath && `${name}.prototype._recompute = @noop;`)} - ${templateProperties.setup && `%setup(${name});`} ${templateProperties.preload && `${name}.preload = %preload;`} diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index 1c4e9fb1e66d..a3dfffaa3bb3 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -163,13 +163,13 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -SvelteComponent.prototype._recompute = function _recompute(changed, state) { - if (changed.x) { - if (this._differs(state.a, (state.a = a(state)))) changed.a = true; - if (this._differs(state.b, (state.b = b(state)))) changed.b = true; + _recompute(changed, state) { + if (changed.x) { + if (this._differs(state.a, (state.a = a(state)))) changed.a = true; + if (this._differs(state.b, (state.b = b(state)))) changed.b = true; + } } -}; +} export default SvelteComponent; diff --git a/test/js/samples/computed-collapsed-if/expected.js b/test/js/samples/computed-collapsed-if/expected.js index 2527cd6c3d3d..1c66ea443e1f 100644 --- a/test/js/samples/computed-collapsed-if/expected.js +++ b/test/js/samples/computed-collapsed-if/expected.js @@ -37,12 +37,12 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -SvelteComponent.prototype._recompute = function _recompute(changed, state) { - if (changed.x) { - if (this._differs(state.a, (state.a = a(state)))) changed.a = true; - if (this._differs(state.b, (state.b = b(state)))) changed.b = true; + _recompute(changed, state) { + if (changed.x) { + if (this._differs(state.a, (state.a = a(state)))) changed.a = true; + if (this._differs(state.b, (state.b = b(state)))) changed.b = true; + } } } export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 9ca15e534ee2..254fc74faace 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -229,16 +229,16 @@ class SvelteComponent extends ComponentDev { this._mount(options.target, options.anchor); } } + + _recompute(changed, state) { + if (changed.foo) { + if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; + } + } } SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); }; -SvelteComponent.prototype._recompute = function _recompute(changed, state) { - if (changed.foo) { - if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; - } -}; - export default SvelteComponent; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 5f59f4ad2f3e..889873982b55 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -57,15 +57,15 @@ class SvelteComponent extends ComponentDev { this._mount(options.target, options.anchor); } } + + _recompute(changed, state) { + if (changed.foo) { + if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; + } + } } SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); }; - -SvelteComponent.prototype._recompute = function _recompute(changed, state) { - if (changed.foo) { - if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; - } -} export default SvelteComponent; \ No newline at end of file From 557d06f392c7714f346c4e61f210ab9af6bba2f3 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 21 Apr 2018 19:55:13 -0400 Subject: [PATCH 7/9] put methods on class body --- src/generators/Generator.ts | 6 +- src/generators/dom/index.ts | 56 +++++- src/shared/index.js | 2 + .../expected-bundle.js | 11 +- .../expected-v2.js | 72 ------- .../expected.js | 9 +- .../event-handlers-custom/expected-bundle.js | 12 +- .../samples/event-handlers-custom/expected.js | 12 +- .../method-arrow-function/expected-bundle.js | 169 +++++++++++++++++ .../samples/method-arrow-function/expected.js | 42 +++++ .../samples/method-arrow-function/input.html | 12 ++ .../samples/method-async/expected-bundle.js | 163 ++++++++++++++++ test/js/samples/method-async/expected.js | 36 ++++ test/js/samples/method-async/input.html | 8 + .../expected-bundle.js | 163 ++++++++++++++++ .../method-function-keyword/expected.js | 36 ++++ .../method-function-keyword/input.html | 9 + .../expected-bundle.js | 175 ++++++++++++++++++ .../expected.js | 48 +++++ .../method-non-function-expression/input.html | 16 ++ .../samples/setup-method/expected-bundle.js | 12 +- test/js/samples/setup-method/expected.js | 12 +- 22 files changed, 957 insertions(+), 124 deletions(-) delete mode 100644 test/js/samples/dev-warning-missing-data-computed/expected-v2.js create mode 100644 test/js/samples/method-arrow-function/expected-bundle.js create mode 100644 test/js/samples/method-arrow-function/expected.js create mode 100644 test/js/samples/method-arrow-function/input.html create mode 100644 test/js/samples/method-async/expected-bundle.js create mode 100644 test/js/samples/method-async/expected.js create mode 100644 test/js/samples/method-async/input.html create mode 100644 test/js/samples/method-function-keyword/expected-bundle.js create mode 100644 test/js/samples/method-function-keyword/expected.js create mode 100644 test/js/samples/method-function-keyword/input.html create mode 100644 test/js/samples/method-non-function-expression/expected-bundle.js create mode 100644 test/js/samples/method-non-function-expression/expected.js create mode 100644 test/js/samples/method-non-function-expression/input.html diff --git a/src/generators/Generator.ts b/src/generators/Generator.ts index a243cb96a0d2..a84ec430fd4e 100644 --- a/src/generators/Generator.ts +++ b/src/generators/Generator.ts @@ -610,8 +610,10 @@ export default class Generator { } if (templateProperties.methods && dom) { - addDeclaration('methods', templateProperties.methods.value); - + const indentationLevel = getIndentationLevel(source, templateProperties.methods.start); + if (indentationLevel) { + removeIndentation(code, templateProperties.methods.start, templateProperties.methods.end, indentationLevel, indentExclusionRanges); + } templateProperties.methods.value.properties.forEach(prop => { this.methods.add(prop.key.name); }); diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index caae873e8159..bc658217a9fa 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -261,6 +261,36 @@ export default function dom( `; const classMethods = []; + const extraMethods = []; + + if (templateProperties.methods) { + templateProperties.methods.value.properties.forEach(prop => { + if (/FunctionExpression/.test(prop.value.type)) { + const { type, params, body, async, generator: isGenerator, start, end } = prop.value; + + const prefix = async ? `async ` : isGenerator ? `*` : ``; + const key = `${prefix}[✂${prop.key.start}-${prop.key.end}✂]`; + + if (type === 'ArrowFunctionExpression') { + const paramsSnippet = params.length > 0 + ? `[✂${params[0].start}-${params[params.length - 1].end}✂]` + : ''; + + let bodySnippet = `[✂${body.start}-${body.end}✂]`; + if (body.type !== 'BlockStatement') bodySnippet = `{ return ${bodySnippet}; }`; + + classMethods.push(`${key}(${paramsSnippet}) ${bodySnippet}`) + } else if (type === 'FunctionExpression') { + let c = start; + while (generator.source[c] !== '(') c += 1; + classMethods.push(`${key}[✂${c}-${end}✂]`); + } + } else { + extraMethods.push(`[✂${prop.start}-${prop.end}✂]`) + } + }); + } + if (computations.length) { classMethods.push(deindent` _recompute(changed, state) { @@ -268,6 +298,17 @@ export default function dom( }`); } + if (options.dev) { + const readonly = Array.from(generator.readonly); + if (readonly.length > 0) { + classMethods.push(deindent` + _checkReadOnly(newState) { + if (this._updatingReadonlyProperty) return; + ${readonly.map(prop => `if ('${prop}' in newState) throw new Error("${debugName}: Cannot set read-only property '${prop}'");`)} + }`); + } + } + if (generator.customElement) { const props = generator.props || Array.from(generator.expectedProperties); @@ -339,7 +380,7 @@ export default function dom( customElements.define("${generator.tag}", ${name}); `); } else { - // TODO put methods in class body + // TODO assign non-function-expression methods builder.addBlock(deindent` class ${name} extends @Component { constructor(options) { @@ -349,21 +390,16 @@ export default function dom( ${classMethods.length && classMethods.join('\n\n')} } - - ${templateProperties.methods && `@assign(${name}.prototype, %methods);`} `); } const immutable = templateProperties.immutable ? templateProperties.immutable.value.value : options.immutable; builder.addBlock(deindent` - ${options.dev && deindent` - ${name}.prototype._checkReadOnly = function _checkReadOnly(newState) { - ${Array.from(generator.readonly).map( - prop => - `if ('${prop}' in newState && !this._updatingReadonlyProperty) throw new Error("${debugName}: Cannot set read-only property '${prop}'");` - )} - }; + ${extraMethods.length > 0 && deindent` + @assign(${name}.prototype, { + ${extraMethods.join(',\n\n')} + }); `} ${templateProperties.setup && `%setup(${name});`} diff --git a/src/shared/index.js b/src/shared/index.js index 020a8f399cf8..cd13e37b0099 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -142,6 +142,8 @@ export class ComponentDev extends Component { this._checkReadOnly(newState); super.set(newState); } + + _checkReadOnly() {} } export function _differsImmutable(a, b) { diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 254fc74faace..1ed5fe4538a7 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -161,6 +161,8 @@ class ComponentDev extends Component { this._checkReadOnly(newState); super.set(newState); } + + _checkReadOnly() {} } function _differsImmutable(a, b) { @@ -235,10 +237,11 @@ class SvelteComponent extends ComponentDev { if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; } } -} -SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { - if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); -}; + _checkReadOnly(newState) { + if (this._updatingReadonlyProperty) return; + if ('bar' in newState) throw new Error(": Cannot set read-only property 'bar'"); + } +} export default SvelteComponent; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-v2.js b/test/js/samples/dev-warning-missing-data-computed/expected-v2.js deleted file mode 100644 index 52dee37250c4..000000000000 --- a/test/js/samples/dev-warning-missing-data-computed/expected-v2.js +++ /dev/null @@ -1,72 +0,0 @@ -/* generated by Svelte vX.Y.Z */ -import { appendNode, assign, createElement, createText, detachNode, init, insertNode, noop, protoDev } from "svelte/shared.js"; - -function bar({ foo }) { - return foo * 2; -} - -function create_main_fragment(component, state) { - var p, text_value = state.Math.max(0, state.foo), text, text_1, text_2; - - return { - c: function create() { - p = createElement("p"); - text = createText(text_value); - text_1 = createText("\n\t"); - text_2 = createText(state.bar); - }, - - m: function mount(target, anchor) { - insertNode(p, target, anchor); - appendNode(text, p); - appendNode(text_1, p); - appendNode(text_2, p); - }, - - p: function update(changed, state) { - if ((changed.Math || changed.foo) && text_value !== (text_value = state.Math.max(0, state.foo))) { - text.data = text_value; - } - - if (changed.bar) { - text_2.data = state.bar; - } - }, - - u: function unmount() { - detachNode(p); - }, - - d: noop - }; -} - -function SvelteComponent(options) { - this._debugName = ''; - if (!options || (!options.target && !options.root)) throw new Error("'target' is a required option"); - init(this, options); - this._state = assign({ Math : Math }, options.data); - this._recompute({ foo: 1 }, this._state); - if (!('foo' in this._state)) console.warn(" was created without expected data property 'foo'"); - - this._fragment = create_main_fragment(this, this._state); - - if (options.target) { - if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); - this._fragment.c(); - this._mount(options.target, options.anchor); - } -} - -assign(SvelteComponent.prototype, protoDev); - -SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { - if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); -}; - -SvelteComponent.prototype._recompute = function _recompute(changed, state) { - if (changed.foo) { - if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; - } -} -export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 889873982b55..99d6d4c43e6c 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -63,9 +63,10 @@ class SvelteComponent extends ComponentDev { if (this._differs(state.bar, (state.bar = bar(state)))) changed.bar = true; } } -} -SvelteComponent.prototype._checkReadOnly = function _checkReadOnly(newState) { - if ('bar' in newState && !this._updatingReadonlyProperty) throw new Error(": Cannot set read-only property 'bar'"); -}; + _checkReadOnly(newState) { + if (this._updatingReadonlyProperty) return; + if ('bar' in newState) throw new Error(": Cannot set read-only property 'bar'"); + } +} export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 42c74274e4b2..cac6cefdc14e 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -142,12 +142,6 @@ function callAll(fns) { function foo( node, callback ) { // code goes here } -var methods = { - foo ( bar ) { - console.log( bar ); - } -}; - function create_main_fragment(component, state) { var button, foo_handler; @@ -193,8 +187,10 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -assign(SvelteComponent.prototype, methods); + foo( bar ) { + console.log( bar ); + } +} export default SvelteComponent; diff --git a/test/js/samples/event-handlers-custom/expected.js b/test/js/samples/event-handlers-custom/expected.js index 978532df69bc..e0b2a67cc503 100644 --- a/test/js/samples/event-handlers-custom/expected.js +++ b/test/js/samples/event-handlers-custom/expected.js @@ -5,12 +5,6 @@ function foo( node, callback ) { // code goes here }; -var methods = { - foo ( bar ) { - console.log( bar ); - } -}; - function create_main_fragment(component, state) { var button, foo_handler; @@ -56,7 +50,9 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -assign(SvelteComponent.prototype, methods); + foo( bar ) { + console.log( bar ); + } +} export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/method-arrow-function/expected-bundle.js b/test/js/samples/method-arrow-function/expected-bundle.js new file mode 100644 index 000000000000..5209210a7ad3 --- /dev/null +++ b/test/js/samples/method-arrow-function/expected-bundle.js @@ -0,0 +1,169 @@ +function noop() {} + +function assign(tar, src) { + for (var k in src) tar[k] = src[k]; + return tar; +} + +function blankObject() { + return Object.create(null); +} + +class Base { + constructor() { + this._handlers = blankObject(); + } + + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } +} + +class Component extends Base { + constructor(options) { + super(); + this._init(options); + } + + 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; + } + + 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; + } + + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } +} + +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +/* generated by Svelte vX.Y.Z */ + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + foo() { return console.log('foo'); } + + bar(x) { return console.log(x); } + + baz(x) { return console.log(x); } + + qux() { + return 42; + } +} + +export default SvelteComponent; diff --git a/test/js/samples/method-arrow-function/expected.js b/test/js/samples/method-arrow-function/expected.js new file mode 100644 index 000000000000..d0b138d8d314 --- /dev/null +++ b/test/js/samples/method-arrow-function/expected.js @@ -0,0 +1,42 @@ +/* generated by Svelte vX.Y.Z */ +import { Component, assign, noop } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + foo() { return console.log('foo'); } + + bar(x) { return console.log(x); } + + baz(x) { return console.log(x); } + + qux() { + return 42; + } +} +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/method-arrow-function/input.html b/test/js/samples/method-arrow-function/input.html new file mode 100644 index 000000000000..423eda40fc50 --- /dev/null +++ b/test/js/samples/method-arrow-function/input.html @@ -0,0 +1,12 @@ + \ No newline at end of file diff --git a/test/js/samples/method-async/expected-bundle.js b/test/js/samples/method-async/expected-bundle.js new file mode 100644 index 000000000000..6c939e025792 --- /dev/null +++ b/test/js/samples/method-async/expected-bundle.js @@ -0,0 +1,163 @@ +function noop() {} + +function assign(tar, src) { + for (var k in src) tar[k] = src[k]; + return tar; +} + +function blankObject() { + return Object.create(null); +} + +class Base { + constructor() { + this._handlers = blankObject(); + } + + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } +} + +class Component extends Base { + constructor(options) { + super(); + this._init(options); + } + + 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; + } + + 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; + } + + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } +} + +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +/* generated by Svelte vX.Y.Z */ + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + async foo() {} + + *bar() {} +} + +export default SvelteComponent; diff --git a/test/js/samples/method-async/expected.js b/test/js/samples/method-async/expected.js new file mode 100644 index 000000000000..3ec7ae454f7d --- /dev/null +++ b/test/js/samples/method-async/expected.js @@ -0,0 +1,36 @@ +/* generated by Svelte vX.Y.Z */ +import { Component, assign, noop } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + async foo() {} + + *bar() {} +} +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/method-async/input.html b/test/js/samples/method-async/input.html new file mode 100644 index 000000000000..4774378a0228 --- /dev/null +++ b/test/js/samples/method-async/input.html @@ -0,0 +1,8 @@ + \ No newline at end of file diff --git a/test/js/samples/method-function-keyword/expected-bundle.js b/test/js/samples/method-function-keyword/expected-bundle.js new file mode 100644 index 000000000000..2d8da4596a84 --- /dev/null +++ b/test/js/samples/method-function-keyword/expected-bundle.js @@ -0,0 +1,163 @@ +function noop() {} + +function assign(tar, src) { + for (var k in src) tar[k] = src[k]; + return tar; +} + +function blankObject() { + return Object.create(null); +} + +class Base { + constructor() { + this._handlers = blankObject(); + } + + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } +} + +class Component extends Base { + constructor(options) { + super(); + this._init(options); + } + + 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; + } + + 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; + } + + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } +} + +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +/* generated by Svelte vX.Y.Z */ + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + foo() { + console.log('foo'); + } +} + +export default SvelteComponent; diff --git a/test/js/samples/method-function-keyword/expected.js b/test/js/samples/method-function-keyword/expected.js new file mode 100644 index 000000000000..8c4f9825816b --- /dev/null +++ b/test/js/samples/method-function-keyword/expected.js @@ -0,0 +1,36 @@ +/* generated by Svelte vX.Y.Z */ +import { Component, assign, noop } from "svelte/shared.js"; + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } + + foo() { + console.log('foo'); + } +} +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/method-function-keyword/input.html b/test/js/samples/method-function-keyword/input.html new file mode 100644 index 000000000000..0eee56773d57 --- /dev/null +++ b/test/js/samples/method-function-keyword/input.html @@ -0,0 +1,9 @@ + \ No newline at end of file diff --git a/test/js/samples/method-non-function-expression/expected-bundle.js b/test/js/samples/method-non-function-expression/expected-bundle.js new file mode 100644 index 000000000000..1562de15d73e --- /dev/null +++ b/test/js/samples/method-non-function-expression/expected-bundle.js @@ -0,0 +1,175 @@ +function noop() {} + +function assign(tar, src) { + for (var k in src) tar[k] = src[k]; + return tar; +} + +function blankObject() { + return Object.create(null); +} + +class Base { + constructor() { + this._handlers = blankObject(); + } + + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } +} + +class Component extends Base { + constructor(options) { + super(); + this._init(options); + } + + 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; + } + + 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; + } + + _init(options) { + this._bind = options._bind; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } +} + +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +/* generated by Svelte vX.Y.Z */ + +function foo() { + console.log('foo'); +} + +function bar() { + console.log('bar'); +} + + + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } +} + +assign(SvelteComponent.prototype, { + foo, + + bar: [bar][0] +}); + +export default SvelteComponent; diff --git a/test/js/samples/method-non-function-expression/expected.js b/test/js/samples/method-non-function-expression/expected.js new file mode 100644 index 000000000000..6f2630061dfe --- /dev/null +++ b/test/js/samples/method-non-function-expression/expected.js @@ -0,0 +1,48 @@ +/* generated by Svelte vX.Y.Z */ +import { Component, assign, noop } from "svelte/shared.js"; + +function foo() { + console.log('foo'); +} + +function bar() { + console.log('bar'); +} + + + +function create_main_fragment(component, state) { + + return { + c: noop, + + m: noop, + + p: noop, + + u: noop, + + d: noop + }; +} + +class SvelteComponent extends Component { + constructor(options) { + super(options); + this._state = assign({}, options.data); + + this._fragment = create_main_fragment(this, this._state); + + if (options.target) { + this._fragment.c(); + this._mount(options.target, options.anchor); + } + } +} + +assign(SvelteComponent.prototype, { + foo, + + bar: [bar][0] +}); +export default SvelteComponent; \ No newline at end of file diff --git a/test/js/samples/method-non-function-expression/input.html b/test/js/samples/method-non-function-expression/input.html new file mode 100644 index 000000000000..90bbd192931f --- /dev/null +++ b/test/js/samples/method-non-function-expression/input.html @@ -0,0 +1,16 @@ + \ No newline at end of file diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 607d633226c8..579d23713667 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -127,12 +127,6 @@ function callAll(fns) { /* generated by Svelte vX.Y.Z */ -var methods = { - foo ( bar ) { - console.log( bar ); - } -}; - function setup(Component$$1) { Component$$1.SOME_CONSTANT = 42; Component$$1.factory = function (target) { @@ -170,9 +164,11 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -assign(SvelteComponent.prototype, methods); + foo( bar ) { + console.log( bar ); + } +} setup(SvelteComponent); diff --git a/test/js/samples/setup-method/expected.js b/test/js/samples/setup-method/expected.js index ed4ac240bee2..2aedc961330b 100644 --- a/test/js/samples/setup-method/expected.js +++ b/test/js/samples/setup-method/expected.js @@ -1,12 +1,6 @@ /* generated by Svelte vX.Y.Z */ import { Component, assign, noop } from "svelte/shared.js"; -var methods = { - foo ( bar ) { - console.log( bar ); - } -}; - function setup(Component) { Component.SOME_CONSTANT = 42; Component.factory = function (target) { @@ -44,9 +38,11 @@ class SvelteComponent extends Component { this._mount(options.target, options.anchor); } } -} -assign(SvelteComponent.prototype, methods); + foo( bar ) { + console.log( bar ); + } +} setup(SvelteComponent); export default SvelteComponent; \ No newline at end of file From ca65638bf1e74fca9297f28e982c5967bc0b07a3 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 21 Apr 2018 21:06:59 -0400 Subject: [PATCH 8/9] update tests --- src/generators/dom/index.ts | 109 +++++++----------- src/shared/index.js | 10 ++ test/js/samples/action/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 16 ++- .../component-static-immutable/expected.js | 6 - .../expected-bundle.js | 16 ++- .../component-static-immutable2/expected.js | 6 - .../component-static/expected-bundle.js | 16 ++- test/js/samples/component-static/expected.js | 6 - .../computed-collapsed-if/expected-bundle.js | 10 ++ .../css-media-query/expected-bundle.js | 10 ++ .../expected-bundle.js | 12 +- .../css-shadow-dom-keyframes/expected.js | 2 +- .../deconflict-builtins/expected-bundle.js | 10 ++ .../deconflict-globals/expected-bundle.js | 27 +++-- .../js/samples/deconflict-globals/expected.js | 17 +-- .../expected-bundle.js | 10 ++ .../samples/do-use-dataset/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../event-handlers-custom/expected-bundle.js | 10 ++ .../head-no-whitespace/expected-bundle.js | 10 ++ .../if-block-no-update/expected-bundle.js | 10 ++ .../if-block-simple/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../inline-style-optimized/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../legacy-input-type/expected-bundle.js | 10 ++ .../samples/media-bindings/expected-bundle.js | 15 ++- test/js/samples/media-bindings/expected.js | 5 - .../method-arrow-function/expected-bundle.js | 10 ++ .../samples/method-async/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../non-imported-component/expected-bundle.js | 16 ++- .../non-imported-component/expected.js | 6 - .../samples/setup-method/expected-bundle.js | 10 ++ test/js/samples/svg-title/expected-bundle.js | 10 ++ test/js/samples/title/expected-bundle.js | 10 ++ .../expected-bundle.js | 10 ++ .../window-binding-scroll/expected-bundle.js | 10 ++ 45 files changed, 425 insertions(+), 150 deletions(-) diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index bc658217a9fa..0e801601cfd0 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -162,7 +162,6 @@ export default function dom( const constructorBody = deindent` ${options.dev && `this._debugName = '${debugName}';`} ${templateProperties.store && `this.store = %store();`} - ${generator.usesRefs && `this.refs = {};`} this._state = ${initialState.reduce((state, piece) => `@assign(${state}, ${piece})`)}; ${storeProps.length > 0 && `this.store._add(this, [${storeProps.map(prop => `"${prop.slice(1)}"`)}]);`} ${generator.metaBindings} @@ -193,71 +192,51 @@ export default function dom( }];` )} - ${generator.slots.size && `this._slotted = options.slots || {};`} - - ${generator.customElement ? - deindent` - this.attachShadow({ mode: 'open' }); - ${css.code && `this.shadowRoot.innerHTML = \`\`;`} + ${generator.customElement ? deindent` + ${css.code && `this.shadowRoot.innerHTML = \`\`;`} ` : (generator.stylesheet.hasStyles && options.css !== false && - `if (!document.getElementById("${generator.stylesheet.id}-style")) @add_css();`) - } - - ${hasInitHooks && deindent` - var self = this; - var _oncreate = function() { - var changed = { ${expectedProperties.map(p => `${p}: 1`).join(', ')} }; - ${templateProperties.onstate && `%onstate.call(self, { changed: changed, current: self._state });`} - ${templateProperties.oncreate && `%oncreate.call(self);`} - self.fire("update", { changed: changed, current: self._state }); - }; - `} - - ${(hasInitHooks || generator.hasComponents || generator.hasComplexBindings || generator.hasIntroTransitions) && deindent` - if (!options.root) { - this._oncreate = []; - ${(generator.hasComponents || generator.hasComplexBindings) && `this._beforecreate = [];`} - ${(generator.hasComponents || generator.hasIntroTransitions) && `this._aftercreate = [];`} - } - `} - - ${generator.slots.size && `this.slots = {};`} + `if (!document.getElementById("${generator.stylesheet.id}-style")) @add_css();`)} this._fragment = @create_main_fragment(this, this._state); ${hasInitHooks && deindent` - this.root._oncreate.push(_oncreate); - `} + this.root._oncreate.push(() => { + const changed = { ${expectedProperties.map(p => `${p}: 1`).join(', ')} }; + ${templateProperties.onstate && `%onstate.call(this, { changed, current: this._state });`} + ${templateProperties.oncreate && `%oncreate.call(this);`} + this.fire("update", { changed, current: this._state }); + });`} - ${generator.customElement ? deindent` - this._fragment.c(); - this._fragment.${block.hasIntroMethod ? 'i' : 'm'}(this.shadowRoot, null); - - if (options.target) this._mount(options.target, options.anchor); - ` : deindent` - if (options.target) { - ${generator.hydratable - ? deindent` - var nodes = @children(options.target); - options.hydrate ? this._fragment.l(nodes) : this._fragment.c(); - nodes.forEach(@detachNode); - ` : - deindent` - ${options.dev && `if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the \`hydratable: true\` option");`} - this._fragment.c(); - `} - this._mount(options.target, options.anchor); + ${generator.customElement ? + deindent` + this._fragment.c(); + this._fragment.${block.hasIntroMethod ? 'i' : 'm'}(this.shadowRoot, null); - ${(generator.hasComponents || generator.hasComplexBindings || hasInitHooks || generator.hasIntroTransitions) && deindent` - ${generator.hasComponents && `this._lock = true;`} - ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} - ${(generator.hasComponents || hasInitHooks) && `@callAll(this._oncreate);`} - ${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`} - ${generator.hasComponents && `this._lock = false;`} - `} - } - `} + if (options.target) this._mount(options.target, options.anchor); + ` : + deindent` + if (options.target) { + ${generator.hydratable + ? deindent` + var nodes = @children(options.target); + options.hydrate ? this._fragment.l(nodes) : this._fragment.c(); + nodes.forEach(@detachNode); + ` : + deindent` + ${options.dev && `if (options.hydrate) throw new Error("options.hydrate only works if the component was compiled with the \`hydratable: true\` option");`} + this._fragment.c(); + `} + this._mount(options.target, options.anchor); + + ${(generator.hasComponents || generator.hasComplexBindings || hasInitHooks || generator.hasIntroTransitions) && deindent` + ${generator.hasComponents && `this._lock = true;`} + ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} + ${(generator.hasComponents || hasInitHooks) && `@callAll(this._oncreate);`} + ${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`} + ${generator.hasComponents && `this._lock = false;`} + `} + }`} `; const classMethods = []; @@ -318,6 +297,7 @@ export default function dom( super(); this._handlers = {}; this._init.call(this, options); + this.attachShadow({ mode: 'open' }); ${constructorBody} } @@ -336,19 +316,16 @@ export default function dom( ${classMethods.length && classMethods.join('\n\n')} - ${generator.slots.size && deindent` - connectedCallback() { - Object.keys(this._slotted).forEach(key => { - this.appendChild(this._slotted[key]); - }); - }`} - attributeChangedCallback(attr, oldValue, newValue) { this.set({ [attr]: newValue }); } - ${(generator.hasComponents || generator.hasComplexBindings || templateProperties.oncreate || generator.hasIntroTransitions) && deindent` + ${(generator.slots.size || generator.hasComponents || generator.hasComplexBindings || templateProperties.oncreate || generator.hasIntroTransitions) && deindent` connectedCallback() { + ${generator.slots.size && deindent` + Object.keys(this._slotted).forEach(key => { + this.appendChild(this._slotted[key]); + });`} ${generator.hasComponents && `this._lock = true;`} ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} ${(generator.hasComponents || templateProperties.oncreate) && `@callAll(this._oncreate);`} diff --git a/src/shared/index.js b/src/shared/index.js index cd13e37b0099..2f50eb2fdc4d 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -79,10 +79,20 @@ export class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 6b0da6f682ef..07149e6d80ef 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -90,10 +90,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 301d76348501..bf9d293129ba 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js index 99898b6e0997..3a11a66a9697 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -163,12 +173,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/component-static-immutable/expected.js b/test/js/samples/component-static-immutable/expected.js index 7512269f6ae6..f25cd25c4cf5 100644 --- a/test/js/samples/component-static-immutable/expected.js +++ b/test/js/samples/component-static-immutable/expected.js @@ -37,12 +37,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js index 99898b6e0997..3a11a66a9697 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -163,12 +173,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/component-static-immutable2/expected.js b/test/js/samples/component-static-immutable2/expected.js index 7512269f6ae6..f25cd25c4cf5 100644 --- a/test/js/samples/component-static-immutable2/expected.js +++ b/test/js/samples/component-static-immutable2/expected.js @@ -37,12 +37,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index dd979af51e75..c7af2ef32407 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -163,12 +173,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/component-static/expected.js b/test/js/samples/component-static/expected.js index 541ebae80186..d756f6fece69 100644 --- a/test/js/samples/component-static/expected.js +++ b/test/js/samples/component-static/expected.js @@ -37,12 +37,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index a3dfffaa3bb3..c99ae4aba455 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 97405307963b..3b8421f7a60d 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 b772989469bf..bb77293d584d 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -90,10 +90,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -168,9 +178,9 @@ class SvelteComponent extends HTMLElement { super(); this._handlers = {}; this._init.call(this, options); + this.attachShadow({ mode: 'open' }); this._state = assign({}, options.data); - this.attachShadow({ mode: 'open' }); this.shadowRoot.innerHTML = ``; this._fragment = create_main_fragment(this, this._state); diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js index 431e4e0b0cae..1e4678841223 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected.js @@ -30,9 +30,9 @@ class SvelteComponent extends HTMLElement { super(); this._handlers = {}; this._init.call(this, options); + this.attachShadow({ mode: 'open' }); this._state = assign({}, options.data); - this.attachShadow({ mode: 'open' }); this.shadowRoot.innerHTML = ``; this._fragment = create_main_fragment(this, this._state); diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index 5cd3fb63a1fb..dc77edef4ff3 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -108,10 +108,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index 1bb8e1cb1542..8e0497680923 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -156,20 +166,13 @@ class SvelteComponent extends Component { super(options); this._state = assign(data_1(), options.data); - var self = this; - var _oncreate = function() { - var changed = { }; - oncreate.call(self); - self.fire("update", { changed: changed, current: self._state }); - }; - - if (!options.root) { - this._oncreate = []; - } - this._fragment = create_main_fragment(this, this._state); - this.root._oncreate.push(_oncreate); + this.root._oncreate.push(() => { + const changed = { }; + oncreate.call(this); + this.fire("update", { changed, current: this._state }); + }); if (options.target) { this._fragment.c(); diff --git a/test/js/samples/deconflict-globals/expected.js b/test/js/samples/deconflict-globals/expected.js index 7922871df457..9d785bbf50d6 100644 --- a/test/js/samples/deconflict-globals/expected.js +++ b/test/js/samples/deconflict-globals/expected.js @@ -31,20 +31,13 @@ class SvelteComponent extends Component { super(options); this._state = assign(data_1(), options.data); - var self = this; - var _oncreate = function() { - var changed = { }; - oncreate.call(self); - self.fire("update", { changed: changed, current: self._state }); - }; - - if (!options.root) { - this._oncreate = []; - } - this._fragment = create_main_fragment(this, this._state); - this.root._oncreate.push(_oncreate); + this.root._oncreate.push(() => { + const changed = { }; + oncreate.call(this); + this.fire("update", { changed, current: this._state }); + }); if (options.target) { this._fragment.c(); diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 1ed5fe4538a7..dc041f1e57b5 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 0a1590ef9776..466f905864a3 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 c52d1e46af2a..0eae550e58e3 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 @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 e8a1b20748a3..f6c8a48173b7 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 @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 644030d9c0cc..6924aa1c015e 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -110,10 +110,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index cac6cefdc14e..dbf6271946a5 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -90,10 +90,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 1c249b5e365a..4fbf19e00a15 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -90,10 +90,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 d136aec41e39..a3492c7c3bac 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index d50825b0dc33..9221948e0060 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 f1ea22c66bce..aa1946499ffe 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 63fd122d3767..905ebb024cc1 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index fc4c0c7e7a92..be3e62e122ba 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 408622931e75..909f9b3646ff 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -94,10 +94,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 a8c94e4aa7ce..02ec9bccd710 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -102,10 +102,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 2483c6329e73..6da52e391418 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -96,10 +96,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index eef1e702d829..df5151a54e00 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -106,10 +106,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -243,11 +253,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index 9e424a5c65c5..9f8a7f969fee 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -89,11 +89,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/method-arrow-function/expected-bundle.js b/test/js/samples/method-arrow-function/expected-bundle.js index 5209210a7ad3..0f9e112452dd 100644 --- a/test/js/samples/method-arrow-function/expected-bundle.js +++ b/test/js/samples/method-arrow-function/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/method-async/expected-bundle.js b/test/js/samples/method-async/expected-bundle.js index 6c939e025792..10f4c1e3fd2e 100644 --- a/test/js/samples/method-async/expected-bundle.js +++ b/test/js/samples/method-async/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/method-function-keyword/expected-bundle.js b/test/js/samples/method-function-keyword/expected-bundle.js index 2d8da4596a84..6d7492f57a09 100644 --- a/test/js/samples/method-function-keyword/expected-bundle.js +++ b/test/js/samples/method-function-keyword/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/method-non-function-expression/expected-bundle.js b/test/js/samples/method-non-function-expression/expected-bundle.js index 1562de15d73e..3c4a6f8622a6 100644 --- a/test/js/samples/method-non-function-expression/expected-bundle.js +++ b/test/js/samples/method-non-function-expression/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index 81a7540dc17b..f3d943a22955 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -92,10 +92,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { @@ -187,12 +197,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/non-imported-component/expected.js b/test/js/samples/non-imported-component/expected.js index 830b989a7279..4ddb5d64f467 100644 --- a/test/js/samples/non-imported-component/expected.js +++ b/test/js/samples/non-imported-component/expected.js @@ -48,12 +48,6 @@ class SvelteComponent extends Component { super(options); this._state = assign({}, options.data); - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - this._fragment = create_main_fragment(this, this._state); if (options.target) { diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 579d23713667..523ad5eb90bb 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 8ba137a50098..5d992714dd43 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 8e75f1e4d665..55b3a2644e9f 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -78,10 +78,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { 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 53b53a7dbadf..239be07fae56 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -102,10 +102,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index 3581e25a03d3..9c2e07824987 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -98,10 +98,20 @@ class Component extends Base { _init(options) { this._bind = options._bind; + this._slotted = options.slots || {}; this.options = options; this.root = options.root || this; this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; } _set(newState) { From 6cb91559ef83dff62c20f17cbab2038547a56ce2 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sun, 22 Apr 2018 08:30:37 -0400 Subject: [PATCH 9/9] shuffle things around slightly --- src/generators/dom/index.ts | 1 - src/shared/Base.js | 46 +++++ src/shared/Component.js | 107 +++++++++++ src/shared/SvelteElement.js | 5 + src/shared/_build.js | 2 +- src/shared/index.js | 176 +----------------- src/shared/utils.js | 24 +++ test/js/samples/action/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../component-static/expected-bundle.js | 16 +- .../computed-collapsed-if/expected-bundle.js | 16 +- .../css-media-query/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../deconflict-builtins/expected-bundle.js | 16 +- .../deconflict-globals/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../samples/do-use-dataset/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../event-handlers-custom/expected-bundle.js | 16 +- .../head-no-whitespace/expected-bundle.js | 16 +- .../if-block-no-update/expected-bundle.js | 16 +- .../if-block-simple/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../inline-style-optimized/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../legacy-input-type/expected-bundle.js | 16 +- .../samples/media-bindings/expected-bundle.js | 16 +- .../method-arrow-function/expected-bundle.js | 16 +- .../samples/method-async/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../non-imported-component/expected-bundle.js | 16 +- .../samples/setup-method/expected-bundle.js | 16 +- test/js/samples/svg-title/expected-bundle.js | 16 +- test/js/samples/title/expected-bundle.js | 16 +- .../expected-bundle.js | 16 +- .../window-binding-scroll/expected-bundle.js | 16 +- 43 files changed, 473 insertions(+), 464 deletions(-) create mode 100644 src/shared/Base.js create mode 100644 src/shared/Component.js create mode 100644 src/shared/SvelteElement.js diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 0e801601cfd0..cc5a91bbb1fd 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -357,7 +357,6 @@ export default function dom( customElements.define("${generator.tag}", ${name}); `); } else { - // TODO assign non-function-expression methods builder.addBlock(deindent` class ${name} extends @Component { constructor(options) { diff --git a/src/shared/Base.js b/src/shared/Base.js new file mode 100644 index 000000000000..da798091f917 --- /dev/null +++ b/src/shared/Base.js @@ -0,0 +1,46 @@ +import { _differsImmutable } from './utils.js'; + +export function blankObject() { + return Object.create(null); +} + +export class Base { + constructor() { + this._handlers = blankObject(); + } + + fire(eventName, data) { + const handlers = eventName in this._handlers && this._handlers[eventName].slice(); + if (!handlers) return; + + for (let i = 0; i < handlers.length; i += 1) { + const handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } + } + } + + get() { + return this._state; + } + + on(eventName, handler) { + const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); + handlers.push(handler); + + return { + cancel: function() { + const index = handlers.indexOf(handler); + if (~index) handlers.splice(index, 1); + } + }; + } + + _differs(a, b) { + return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); + } +} \ No newline at end of file diff --git a/src/shared/Component.js b/src/shared/Component.js new file mode 100644 index 000000000000..33e6d1360c15 --- /dev/null +++ b/src/shared/Component.js @@ -0,0 +1,107 @@ +import { Base } from './Base.js'; +import { assign, callAll, noop } from './utils.js'; + +export class Component extends Base { + constructor(options) { + super(); + this._init(options); + } + + 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; + } + + 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; + } + + _init(options) { + this._bind = options._bind; + this._slotted = options.slots || {}; + + this.options = options; + this.root = options.root || this; + this.store = this.root.store || options.store; + + if (!options.root) { + this._oncreate = []; + this._beforecreate = []; + this._aftercreate = []; + } + + this.refs = {}; + this.slots = {}; + } + + _set(newState) { + const previous = this._state; + const changed = {}; + let dirty = false; + + for (var key in newState) { + if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; + } + + if (!dirty) return; + + this._state = assign(assign({}, previous), newState); + this._recompute(changed, this._state); + if (this._bind) this._bind(changed, this._state); + + if (this._fragment) { + this.fire("state", { changed, current: this._state, previous }); + this._fragment.p(changed, this._state); + this.fire("update", { changed, current: this._state, previous }); + } + } + + _mount(target, anchor) { + this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); + } + + _recompute() {} + + _unmount() { + if (this._fragment) this._fragment.u(); + } +} + +export class ComponentDev extends Component { + constructor(options) { + if (!options || (!options.target && !options.root)) { + throw new Error(`'target' is a required option`); + } + + super(options); + } + + destroy(detach) { + super.destroy(detach); + this.destroy = () => { + console.warn('Component was already destroyed'); + }; + } + + set(newState) { + if (typeof newState !== 'object') { + throw new Error(`${this._debugName}.set was called without an object of data key-values to update.`); + } + + this._checkReadOnly(newState); + super.set(newState); + } + + _checkReadOnly() {} +} \ No newline at end of file diff --git a/src/shared/SvelteElement.js b/src/shared/SvelteElement.js new file mode 100644 index 000000000000..185118e6d035 --- /dev/null +++ b/src/shared/SvelteElement.js @@ -0,0 +1,5 @@ +class SvelteElement extends HTMLElement { + constructor(options) { + + } +} \ No newline at end of file diff --git a/src/shared/_build.js b/src/shared/_build.js index 72bd5ab2a880..411e0b74ddbf 100644 --- a/src/shared/_build.js +++ b/src/shared/_build.js @@ -5,7 +5,7 @@ const acorn = require('acorn'); const declarations = {}; fs.readdirSync(__dirname).forEach(file => { - if (!/^[a-z\-]+\.js$/.test(file)) return; + if (!/^[a-z\-]+\.js$/i.test(file)) return; const source = fs.readFileSync(path.join(__dirname, file), 'utf-8'); const ast = acorn.parse(source, { diff --git a/src/shared/index.js b/src/shared/index.js index 2f50eb2fdc4d..76655ca03027 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -5,177 +5,5 @@ export * from './keyed-each.js'; export * from './spread.js'; export * from './transitions.js'; export * from './utils.js'; - -export function blankObject() { - return Object.create(null); -} - -export class Base { - constructor() { - this._handlers = blankObject(); - } - - fire(eventName, data) { - const handlers = eventName in this._handlers && this._handlers[eventName].slice(); - if (!handlers) return; - - for (let i = 0; i < handlers.length; i += 1) { - const handler = handlers[i]; - - if (!handler.__calling) { - handler.__calling = true; - handler.call(this, data); - handler.__calling = false; - } - } - } - - get() { - return this._state; - } - - on(eventName, handler) { - const handlers = this._handlers[eventName] || (this._handlers[eventName] = []); - handlers.push(handler); - - return { - cancel: function() { - const index = handlers.indexOf(handler); - if (~index) handlers.splice(index, 1); - } - }; - } - - _differs(a, b) { - return _differsImmutable(a, b) || ((a && typeof a === 'object') || typeof a === 'function'); - } -} - -export class Component extends Base { - constructor(options) { - super(); - this._init(options); - } - - 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; - } - - 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; - } - - _init(options) { - this._bind = options._bind; - this._slotted = options.slots || {}; - - this.options = options; - this.root = options.root || this; - this.store = this.root.store || options.store; - - if (!options.root) { - this._oncreate = []; - this._beforecreate = []; - this._aftercreate = []; - } - - this.refs = {}; - this.slots = {}; - } - - _set(newState) { - const previous = this._state; - const changed = {}; - let dirty = false; - - for (var key in newState) { - if (this._differs(newState[key], previous[key])) changed[key] = dirty = 1; - } - - if (!dirty) return; - - this._state = assign(assign({}, previous), newState); - this._recompute(changed, this._state); - if (this._bind) this._bind(changed, this._state); - - if (this._fragment) { - this.fire("state", { changed, current: this._state, previous }); - this._fragment.p(changed, this._state); - this.fire("update", { changed, current: this._state, previous }); - } - } - - _mount(target, anchor) { - this._fragment[this._fragment.i ? 'i' : 'm'](target, anchor || null); - } - - _recompute() {} - - _unmount() { - if (this._fragment) this._fragment.u(); - } -} - -export class ComponentDev extends Component { - constructor(options) { - if (!options || (!options.target && !options.root)) { - throw new Error(`'target' is a required option`); - } - - super(options); - } - - destroy(detach) { - super.destroy(detach); - this.destroy = () => { - console.warn('Component was already destroyed'); - }; - } - - set(newState) { - if (typeof newState !== 'object') { - throw new Error(`${this._debugName}.set was called without an object of data key-values to update.`); - } - - this._checkReadOnly(newState); - super.set(newState); - } - - _checkReadOnly() {} -} - -export function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -export function run(fn) { - fn(); -} - -export function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - -export function isPromise(value) { - return value && typeof value.then === 'function'; -} - -export var PENDING = {}; -export var SUCCESS = {}; -export var FAILURE = {}; - -export function removeFromStore() { - this.store._remove(this); -} \ No newline at end of file +export * from './Base.js'; +export * from './Component.js'; \ No newline at end of file diff --git a/src/shared/utils.js b/src/shared/utils.js index c9a0f83449fc..b7496392d048 100644 --- a/src/shared/utils.js +++ b/src/shared/utils.js @@ -4,3 +4,27 @@ export function assign(tar, src) { for (var k in src) tar[k] = src[k]; return tar; } + +export function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +export function run(fn) { + fn(); +} + +export function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + +export function isPromise(value) { + return value && typeof value.then === 'function'; +} + +export var PENDING = {}; +export var SUCCESS = {}; +export var FAILURE = {}; + +export function removeFromStore() { + this.store._remove(this); +} \ No newline at end of file diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 07149e6d80ef..140dfd571492 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -139,14 +147,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function link(node) { 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 bf9d293129ba..bea489055f21 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -147,14 +155,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function data() { diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js index 3a11a66a9697..b5cc5a367c14 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ var Nested = window.Nested; diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js index 3a11a66a9697..b5cc5a367c14 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ var Nested = window.Nested; diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index c7af2ef32407..c85beee6a0d5 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ var Nested = window.Nested; diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index c99ae4aba455..635830d7b3c4 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function a({ x }) { diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 3b8421f7a60d..7c31522a9e6c 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function add_css() { 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 bb77293d584d..c7c4b69fdd58 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -139,14 +147,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index dc77edef4ff3..2a03d99c1e14 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -157,14 +165,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index 8e0497680923..aa850ceb1d94 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function data_1() { diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index dc041f1e57b5..cac872e562fd 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -175,14 +183,6 @@ class ComponentDev extends Component { _checkReadOnly() {} } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function bar({ foo }) { diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 466f905864a3..79902546677c 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 0eae550e58e3..af509392ad1b 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 @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -147,14 +155,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 f6c8a48173b7..a0d7c7967b21 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 @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -147,14 +155,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 6924aa1c015e..01edc06eb947 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -159,14 +167,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index dbf6271946a5..f3e877aabb9c 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -139,14 +147,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function foo( node, callback ) { diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 4fbf19e00a15..c4e58f6211ed 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -139,14 +147,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 a3492c7c3bac..720966d58bef 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index 9221948e0060..c1075003bfb8 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 aa1946499ffe..8837d9d847a4 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 905ebb024cc1..72228302ede2 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index be3e62e122ba..43b50774d474 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 909f9b3646ff..0856f73e2aca 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -143,14 +151,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 02ec9bccd710..b8af16c6d289 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -151,14 +159,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 6da52e391418..d864a7117305 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -145,14 +153,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index df5151a54e00..f9c3a82f1f47 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -155,14 +163,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/method-arrow-function/expected-bundle.js b/test/js/samples/method-arrow-function/expected-bundle.js index 0f9e112452dd..204f0f8892df 100644 --- a/test/js/samples/method-arrow-function/expected-bundle.js +++ b/test/js/samples/method-arrow-function/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/method-async/expected-bundle.js b/test/js/samples/method-async/expected-bundle.js index 10f4c1e3fd2e..b0dc283fa1c0 100644 --- a/test/js/samples/method-async/expected-bundle.js +++ b/test/js/samples/method-async/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/method-function-keyword/expected-bundle.js b/test/js/samples/method-function-keyword/expected-bundle.js index 6d7492f57a09..2115cc6b867e 100644 --- a/test/js/samples/method-function-keyword/expected-bundle.js +++ b/test/js/samples/method-function-keyword/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/method-non-function-expression/expected-bundle.js b/test/js/samples/method-non-function-expression/expected-bundle.js index 3c4a6f8622a6..91c7b6d525ec 100644 --- a/test/js/samples/method-non-function-expression/expected-bundle.js +++ b/test/js/samples/method-non-function-expression/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function foo() { diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index f3d943a22955..f38cc96cfc73 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -7,6 +7,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function insertNode(node, target, anchor) { target.insertBefore(node, anchor); } @@ -141,14 +149,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 523ad5eb90bb..3c696b564960 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function setup(Component$$1) { diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 5d992714dd43..2f6a4423b34b 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -147,14 +155,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 55b3a2644e9f..a7458a2cd3e1 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function blankObject() { return Object.create(null); } @@ -127,14 +135,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { 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 239be07fae56..40751cfc8ff5 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -151,14 +159,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) { diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index 9c2e07824987..dc5f54aa3501 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -5,6 +5,14 @@ function assign(tar, src) { return tar; } +function _differsImmutable(a, b) { + return a != a ? b == b : a !== b; +} + +function callAll(fns) { + while (fns && fns.length) fns.shift()(); +} + function appendNode(node, target) { target.appendChild(node); } @@ -147,14 +155,6 @@ class Component extends Base { } } -function _differsImmutable(a, b) { - return a != a ? b == b : a !== b; -} - -function callAll(fns) { - while (fns && fns.length) fns.shift()(); -} - /* generated by Svelte vX.Y.Z */ function create_main_fragment(component, state) {