get custom elements working etc

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});
+			Object.getOwnPropertyNames(${generator.options.dev ? `Object.getPrototypeOf(@Component.prototype)` : `@Component.prototype`}).forEach(name => {
-			@assign(@assign(${prototypeBase}, ${proto}), {
+				${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

src/shared/index.js

@@ -54,11 +54,7 @@ export class Base {
 export class Component extends Base {
 	constructor(options) {
 		super();
-		this._bind = options._bind;
+		this._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = () => {

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;

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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);
+Object.getOwnPropertyNames(Component.prototype).forEach(name => {
-assign(assign(SvelteComponent.prototype, Component.prototype), {
+	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;

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);
+Object.getOwnPropertyNames(Component.prototype).forEach(name => {
-assign(assign(SvelteComponent.prototype, Component.prototype), {
+	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;

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = '<SvelteComponent>';
-		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("<SvelteComponent> was created without expected data property 'foo'");

test/js/samples/dev-warning-missing-data-computed/expected.js

@@ -45,7 +45,6 @@ class SvelteComponent extends ComponentDev {
 	constructor(options) {
 		super(options);
 		this._debugName = '<SvelteComponent>';
-		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("<SvelteComponent> was created without expected data property 'foo'");

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};

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._init(options);
-
-		this.options = options;
-		this.root = options.root || this;
-		this.store = this.root.store || options.store;
 	}
 
 	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 = {};