custom-element Questions

0

Per this issue with the W3C html spec, using nested sections with multiple h1's is discouraged because no browsers implement the outline algorithm needed to make them work semantically. However, i...

1

As documentation says: connectedCallback fires each time a custom element is appended into a document-connected element also: firstUpdated fires after the first time your component has b...
Represent asked 24/7, 2019 at 12:12

2

Solved

This does not work: <!-- wtf.html --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title></title> <script type="module" src="./w...
Adrien asked 11/7, 2019 at 10:19

1

This is an example of the use of custom elements from developers.google.com: let tmpl = document.createElement('template'); tmpl.innerHTML = ` <style>:host { ... }</style> <!-- loo...
Neilla asked 11/7, 2019 at 15:38

2

Solved

That statement pasted in my question was copied from https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#Using_the_lifecycle_callbacks. As a no-experience developer w...
Metalinguistic asked 2/7, 2019 at 17:40

3

Solved

I'm trying to create a native web component for input element. I wanted the component to have custom validation functionality, similar to polymer's paper-input custom validator function. I'm not su...
Hereinafter asked 14/6, 2018 at 20:40

1

Solved

Is it possible to instantiate a web component without registering it to the CustomElementRegistry? consider a simple component: export class MyCustomElm extends HTMLElement { constructor() { su...
Hibbitts asked 31/5, 2019 at 8:10

2

I'm using Vue's single-file component spec (*.vue) for custom components in my application. Together with rollup and rollup-plugin-vue, I have observed the output in the DOM, for custom components ...
Mandel asked 23/8, 2017 at 21:35

1

Solved

I'm trying to create a custom component that extends the HTMLInputElement component, but nothing renders. class myInput extends HTMLInputElement {}; customElements.define('my-input', myInpu...
Xavierxaviera asked 6/5, 2019 at 8:45

4

I am trying to understand the newish HTML custom elements. My goal is, given some array of data, create n instances of the custom element. For example, given a list of 10 users, create 10 user htm...
Ireful asked 28/10, 2018 at 23:32

0

I'm following the tutorial: https://alligator.io/web-components/composing-slots-named-slots/ I'm following the advice: How to append a HTML markup via Chrome Extension without leaking styles of ...

1

Solved

I have a simple web component that contains a <slot>. It handles form data and inside I have UI elements that emit data change/selected events. I'm wondering how the web component can react o...
Lycanthropy asked 5/4, 2019 at 1:26

1

Solved

Update: Went for a different solution: <img is=queen-of-hearts> Live at: https://card-ts.github.io/playingcardts this question is about working around CSS Selector limitations So my Cus...
Ronen asked 4/4, 2019 at 14:47

1

Solved

Is it possible to pass a class expression as parameter? Have not tried the eval route yet.. // CardtsElements.Zone contains a valid class expression // used to create a valid Zone Custom Element ...

3

Solved

How do I remove the click listener I bound to window in the constructor below? I need it to listen on window, and I need access to the button instance inside it. class MyEl extends HTMLB...

1

The spec says: However, note that connectedCallback can be called more than once, so any initialization work that is truly one-time will need a guard to prevent it from running twice. What doe...
Tizzy asked 25/2, 2019 at 20:32

2

Solved

Here's a fiddle showing an error in console in Chrome 72 and Firefox 63: https://jsfiddle.net/jr2z1ms3/1/ The code is: <script> customElements.define('test-element', class extends H...
Virelay asked 25/2, 2019 at 0:16

1

Solved

I am creating an angular element which is supposed to be embedded on multiple external sites. The embedding process will ofc just be a reference to the compiled script and a DOM element representi...
Beguine asked 15/2, 2019 at 11:54

1

Solved

I'm trying to access the ShadowRoot on my element and the property element.shadowRoot is returning null. The ShadowDOM is defined as mode: 'open', which is correct, I can even console.log(element) ...
Hemianopsia asked 9/2, 2019 at 19:52

1

Solved

I'm trying to create a wrapper Custom Element that wraps its child Custom Elements into a div. But the child elements aren't wrapped. Instead, an empty div is inserted into the wrapper element bef...
Petua asked 25/1, 2019 at 16:46

3

Solved

I'm writing a memory game in javascript. I have made a web-component for the cards, <memory-card> and a web-component to contain the cards and handle the game state <memory-game>. The &...
Chancelor asked 2/1, 2019 at 6:54

3

Solved

I am creating a web component using native implementation, which in it's html template has links to images. However, those links only work if they are absolute, or relative to the main document, wh...
Plasmosome asked 31/10, 2015 at 18:10

2

Solved

I have a custom element my-checkbox that wraps a checkbox, label, styling, etc. When that checkbox is toggled I am defining a CustomEvent named check within my constructor, like so: constructor(){...
Musjid asked 28/3, 2017 at 5:41

0

I have a custom element <my-el> structurally similar to this (purely static, server-rendered HTML): <my-el> <div>a</div> <div>b</div> <div>c</div&gt...

2

I'm trying the example from google developer site and I'm getting Error: "TypeError: Illegal constructor. What's wrong and How to fix it? class FancyButton extends HTMLButtonElement { constructor...

© 2022 - 2024 — McMap. All rights reserved.