Browse Source

[ui] Vue 3 - Improved webComponentWrap to prevent re-registering of web-components

sreenaths 4 years ago
parent
commit
735af35bab
1 changed files with 10 additions and 11 deletions
  1. 10 11
      desktop/core/src/desktop/js/vue/webComponentWrap.ts

+ 10 - 11
desktop/core/src/desktop/js/vue/webComponentWrap.ts

@@ -1,22 +1,21 @@
-import { createApp, ComponentOptions, Component } from 'vue';
-// import wrapper from './wrapper/index';
-
-// Dummy till wrapper is fixed ---
-import { CreateAppFunction } from '@vue/runtime-core';
-function wrapper(createApp: CreateAppFunction<Element>, component: Component): CustomElementConstructor {
-  return null;
-}
-// Dummy till wrapper is fixed ---
+import { ComponentOptions, Component } from 'vue';
+import wrapper from './wrapper/index';
 
 export interface HueComponentOptions<T extends Component> extends ComponentOptions<T> {
   hueBaseUrl?: string;
 }
 
+const isRegistered = function(tag: string): boolean {
+  return document.createElement(tag).constructor !== HTMLElement;
+}
+
 export const wrap = <T extends Component>(
   tag: string,
   component: { new (): T },
   options?: ElementDefinitionOptions
 ): void => {
-  const customElement: CustomElementConstructor = wrapper(createApp, component);
-  window.customElements.define(tag, customElement, options);
+  if(!isRegistered(tag)) {
+    const customElement: CustomElementConstructor = wrapper(component);
+    window.customElements.define(tag, customElement, options);
+  }
 };