Merge pull request #3604 from thornbill/fix-custom-elements

Fix custom element creation

src/controllers/dashboard/plugins/repositories/index.js

@@ -2,9 +2,11 @@ import loading from '../../../../components/loading/loading';
 import libraryMenu from '../../../../scripts/libraryMenu';
 import globalize from '../../../../scripts/globalize';
 import dialogHelper from '../../../../components/dialogHelper/dialogHelper';
+
 import '../../../../elements/emby-button/emby-button';
 import '../../../../elements/emby-checkbox/emby-checkbox';
 import '../../../../elements/emby-select/emby-select';
+
 import '../../../../components/formdialog.scss';
 import '../../../../components/listview/listview.scss';
 
@@ -19,8 +21,8 @@ function reloadList(page) {
             noneElement: page.querySelector('#none'),
             repositories: repositories
         });
-    }).catch(() => {
+    }).catch(e => {
-        console.error('error loading repositories');
+        console.error('error loading repositories', e);
         page.querySelector('#none').classList.remove('hide');
         loading.hide();
     });
@@ -35,8 +37,8 @@ function saveList(page) {
         contentType: 'application/json'
     }).then(() => {
         reloadList(page);
-    }).catch(() => {
+    }).catch(e => {
-        console.error('error saving repositories');
+        console.error('error saving repositories', e);
         loading.hide();
     });
 }
@@ -64,9 +66,8 @@ function getRepositoryElement(repository) {
     const listItem = document.createElement('div');
     listItem.className = 'listItem listItem-border';
 
-    const repoLink = document.createElement('a');
+    const repoLink = document.createElement('a', 'emby-linkbutton');
-    repoLink.setAttribute('is', 'emby-linkbutton');
+    repoLink.classList.add('clearLink', 'listItemIconContainer');
-    repoLink.className = 'clearLink listItemIconContainer';
     repoLink.style.margin = '0';
     repoLink.style.padding = '0';
     repoLink.rel = 'noopener noreferrer';
@@ -90,10 +91,9 @@ function getRepositoryElement(repository) {
 
     listItem.appendChild(body);
 
-    const button = document.createElement('button');
+    const button = document.createElement('button', 'paper-icon-button-light');
     button.type = 'button';
-    button.setAttribute('is', 'paper-icon-button-light');
+    button.classList.add('btnDelete');
-    button.className = 'btnDelete';
     button.id = repository.Url;
     button.title = globalize.translate('Delete');
     button.innerHTML = '<span class="material-icons delete" aria-hidden="true"></span>';

src/controllers/session/login/index.js

@@ -289,6 +289,7 @@ import './login.scss';
                 disclaimer.innerHTML = DOMPurify.sanitize(marked(options.LoginDisclaimer || ''));
 
                 for (const elem of disclaimer.querySelectorAll('a')) {
+                    elem.rel = 'noopener noreferrer';
                     elem.target = '_blank';
                     elem.classList.add('button-link');
                     elem.setAttribute('is', 'emby-linkbutton');

src/scripts/libraryMenu.js

@@ -1,4 +1,6 @@
 import escapeHtml from 'escape-html';
+import Headroom from 'headroom.js';
+
 import dom from './dom';
 import layoutManager from '../components/layoutManager';
 import inputManager from './inputManager';
@@ -12,13 +14,14 @@ import browser from './browser';
 import globalize from './globalize';
 import imageHelper from './imagehelper';
 import { getMenuLinks } from '../scripts/settings/webSettings';
+import Dashboard, { pageClassOn } from './clientUtils';
+import ServerConnections from '../components/ServerConnections';
+
 import '../elements/emby-button/paper-icon-button-light';
+
 import 'material-design-icons-iconfont';
 import '../assets/css/scrollstyles.scss';
 import '../assets/css/flexstyles.scss';
-import Dashboard, { pageClassOn } from './clientUtils';
-import ServerConnections from '../components/ServerConnections';
-import Headroom from 'headroom.js';
 
 /* eslint-disable indent */
 
@@ -667,9 +670,8 @@ import Headroom from 'headroom.js';
         if (customMenuOptions) {
             getMenuLinks().then(links => {
                 links.forEach(link => {
-                    const option = document.createElement('a');
+                    const option = document.createElement('a', 'emby-linkbutton');
-                    option.setAttribute('is', 'emby-linkbutton');
+                    option.classList.add('navMenuOption', 'lnkMediaFolder');
-                    option.className = 'navMenuOption lnkMediaFolder';
                     option.rel = 'noopener noreferrer';
                     option.target = '_blank';
                     option.href = link.url;