From d1f3d4e3bb598900149977647b77179c1e1a998d Mon Sep 17 00:00:00 2001
From: sadick254 <sadickjunior@gmail.com>
Date: Wed, 28 Jul 2021 22:37:01 +0300
Subject: [PATCH] Use custom elements on pane container element

---
 src/panel-container-element.js | 17 ++++++++++++-----
 src/panel-container.js         |  4 ++--
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/panel-container-element.js b/src/panel-container-element.js
index 230b957d4..4e7f6024f 100644
--- a/src/panel-container-element.js
+++ b/src/panel-container-element.js
@@ -4,11 +4,12 @@ const { createFocusTrap } = require('focus-trap');
 const { CompositeDisposable } = require('event-kit');
 
 class PanelContainerElement extends HTMLElement {
-  createdCallback() {
+  constructor() {
+    super();
     this.subscriptions = new CompositeDisposable();
   }
 
-  attachedCallback() {
+  connectedCallback() {
     if (this.model.dock) {
       this.model.dock.elementAttached();
     }
@@ -111,6 +112,12 @@ class PanelContainerElement extends HTMLElement {
   }
 }
 
-module.exports = document.registerElement('atom-panel-container', {
-  prototype: PanelContainerElement.prototype
-});
+window.customElements.define('atom-panel-container', PanelContainerElement);
+
+function createPanelContainerElement() {
+  return document.createElement('atom-panel-container');
+}
+
+module.exports = {
+  createPanelContainerElement
+};
diff --git a/src/panel-container.js b/src/panel-container.js
index 16e81bbe1..5a003f3f8 100644
--- a/src/panel-container.js
+++ b/src/panel-container.js
@@ -1,7 +1,7 @@
 'use strict';
 
 const { Emitter, CompositeDisposable } = require('event-kit');
-const PanelContainerElement = require('./panel-container-element');
+const { createPanelContainerElement } = require('./panel-container-element');
 
 module.exports = class PanelContainer {
   constructor({ location, dock, viewRegistry } = {}) {
@@ -24,7 +24,7 @@ module.exports = class PanelContainer {
 
   getElement() {
     if (!this.element) {
-      this.element = new PanelContainerElement().initialize(
+      this.element = createPanelContainerElement().initialize(
         this,
         this.viewRegistry
       );