- From: Wiktor <notifications@github.com>
- Date: Thu, 28 Jul 2022 14:18:16 -0700
- To: WICG/webcomponents <webcomponents@noreply.github.com>
- Cc: Subscribed <subscribed@noreply.github.com>
- Message-ID: <WICG/webcomponents/issues/959/1198640160@github.com>
Correct me if I am wrong - `importDoc` refers to #645 spec but ultimately we are ignoring it.
The funny part to me is that this issue made me aware that this is actually not possible. As a regular developer, I expected the below code to work.
```html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello World!</title>
<script src="/script.js" type="module"></script>
</head>
<body>
<template id="buttonTemplate">
<button onclick="this.clickHandler()">My button</button>
</template>
<my-button>Button</my-button>
</body>
</html>
```
```js
customElements.define('my-button',
class extends HTMLElement {
constructor() {
super();
let template = document.getElementById('buttonTemplate');
let templateContent = template.content;
const shadowRoot = this.attachShadow({mode: 'open'});
shadowRoot.appendChild(templateContent.cloneNode(true));
}
clickHandler() {
console.log(true)
}
}
);
```
I think this is a great idea. That should allow to write less code in the component's class (making them look cleaner) and result in expected (?) behavior.
--
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/959#issuecomment-1198640160
You are receiving this because you are subscribed to this thread.
Message ID: <WICG/webcomponents/issues/959/1198640160@github.com>
Received on Thursday, 28 July 2022 21:18:30 UTC