Hi to all, we build a library to create web components heres a demo
Hope your feedback thanks.
I'm a newbie regarding the webcomponents, but I would like to try them out and, to convince my co-workers and management to start using them, I'm preparing a small presentation which include a small demo on how to create a webcomponent.
I found I really nice example here: https://coryrylan.com/blog/introduction-to-web-components, but I would like to show a WebC is also easily testable and I'm currently blocked: we are using Jest, but I don't understand how I can use it to test a WebC: as soon as I run a simple test I got
`TypeError: Cannot read property 'define' of undefined
9 | } 10 | > 11 | window.customElements.define("zp-counter", Counter); | ^ 12 | at Object.define (src/js/counter.js:11:23) at Object.<anonymous> (__tests__/counter.js:2:1)
Any idea what should I include to make Jest work?
["yt-activity-manager", "yt-guide-manager", "yt-gfeedback-manager", "yt-navigation-manager", "yt-network-manager", "yt-playlist-manager", "yt-player-manager", "yt-visibility-monitor", "ytd-page-manager", "ytd-playlist-sidebar-renderer", "ytd-settings-sidebar-renderer", "ytd-thumbnail-overlay-time-status-renderer", "ytd-player", "video", "ytd-guide-entry-renderer", "ytd-guide-collapsible-section-entry-renderer", "yt-page-navigation-progress"]), but those indeed do not seem to use shadow dom
<paper-dropdown-menu label="Dinosaurs"> <paper-listbox slot="dropdown-content" > <paper-item>allosaurus</paper-item> <paper-item>brontosaurus</paper-item> <paper-item>carcharodontosaurus</paper-item> <paper-item>diplodocus</paper-item> </paper-listbox> </paper-dropdown-menu>