diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts
index 776cf1ab0b..4d0ad713e8 100644
--- a/src/generators/dom/index.ts
+++ b/src/generators/dom/index.ts
@@ -323,6 +323,16 @@ export default function dom(
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;`}
+ }
+ `}
}
customElements.define("${generator.tag}", ${name});
diff --git a/test/custom-elements/assert.js b/test/custom-elements/assert.js
index 3cb3918d50..79aba6c736 100644
--- a/test/custom-elements/assert.js
+++ b/test/custom-elements/assert.js
@@ -1,3 +1,7 @@
export function equal(a, b, message) {
if (a != b) throw new Error(message || `Expected ${a} to equal ${b}`);
+}
+
+export function ok(condition, message) {
+ if (!condition) throw new Error(message || `Expected ${condition} to be truthy`);
}
\ No newline at end of file
diff --git a/test/custom-elements/index.js b/test/custom-elements/index.js
index a3287b5d10..7f0d3b462c 100644
--- a/test/custom-elements/index.js
+++ b/test/custom-elements/index.js
@@ -3,7 +3,7 @@ import * as http from 'http';
import { rollup } from 'rollup';
import virtual from 'rollup-plugin-virtual';
import Nightmare from 'nightmare';
-import { loadSvelte } from "../helpers.js";
+import { addLineNumbers, loadSvelte } from "../helpers.js";
const page = `
@@ -93,6 +93,7 @@ describe('custom-elements', function() {
if (result) console.log(result);
})
.catch(message => {
+ console.log(addLineNumbers(bundle));
throw new Error(message);
});
});
diff --git a/test/custom-elements/samples/oncreate/main.html b/test/custom-elements/samples/oncreate/main.html
new file mode 100644
index 0000000000..0c9b1b5c12
--- /dev/null
+++ b/test/custom-elements/samples/oncreate/main.html
@@ -0,0 +1,9 @@
+
\ No newline at end of file
diff --git a/test/custom-elements/samples/oncreate/test.js b/test/custom-elements/samples/oncreate/test.js
new file mode 100644
index 0000000000..a64a8c9fec
--- /dev/null
+++ b/test/custom-elements/samples/oncreate/test.js
@@ -0,0 +1,8 @@
+import * as assert from 'assert';
+import './main.html';
+
+export default function (target) {
+ target.innerHTML = '';
+ const el = target.querySelector('my-app');
+ assert.ok(el.wasCreated);
+}
\ No newline at end of file