Fix compilation with TypeScript 3.8, which updated custom element types. (#902)

Author: rictic

package-lock.json

@@ -56,7 +56,7 @@
     "tachometer": "^0.4.16",
     "tslint": "^5.20.1",
     "typedoc": "^0.14.2",
-    "typescript": "^3.4.1",
+    "typescript": "^3.8.2",
     "uglify-es": "^3.3.9",
     "wct-mocha": "^1.0.0",
     "web-component-tester": "^6.9.2"

package.json

@@ -649,7 +649,7 @@ suite('Static get styles', () => {
 
   test('can extend and augment `styles`', async () => {
     const base = generateElementName();
-    customElements.define(base, class extends LitElement {
+    class BaseClass extends LitElement {
       static get styles() {
         return css`div {
           border: 2px solid blue;
@@ -660,18 +660,18 @@ suite('Static get styles', () => {
         return htmlWithStyles`
         <div>Testing1</div>`;
       }
-    });
-
+    }
+    customElements.define(base, BaseClass);
     const sub = generateElementName();
-    customElements.define(sub, class extends customElements.get(base) {
+    customElements.define(sub, class extends BaseClass {
       static get styles() {
         return [
           super.styles,
           css`span {
             display: block;
             border: 3px solid blue;
           }`
-        ];
+        ] as any;
       }
 
       render() {
@@ -682,15 +682,15 @@ suite('Static get styles', () => {
     });
 
     const subsub = generateElementName();
-    customElements.define(subsub, class extends customElements.get(sub) {
+    customElements.define(subsub, class extends BaseClass {
       static get styles() {
         return [
           super.styles,
           css`p {
             display: block;
             border: 4px solid blue;
           }`
-        ];
+        ] as any;
       }
 
       render() {
@@ -719,7 +719,7 @@ suite('Static get styles', () => {
 
   test('can extend and override `styles`', async () => {
     const base = generateElementName();
-    customElements.define(base, class extends LitElement {
+    class BaseClass extends LitElement {
       static get styles() {
         return css`div {
           border: 2px solid blue;
@@ -730,10 +730,11 @@ suite('Static get styles', () => {
         return htmlWithStyles`
         <div>Testing1</div>`;
       }
-    });
+    }
+    customElements.define(base, BaseClass);
 
     const sub = generateElementName();
-    customElements.define(sub, class extends customElements.get(base) {
+    customElements.define(sub, class extends BaseClass {
       static get styles() {
         return css`div {
           border: 3px solid blue;
@@ -742,7 +743,7 @@ suite('Static get styles', () => {
     });
 
     const subsub = generateElementName();
-    customElements.define(subsub, class extends customElements.get(sub) {
+    customElements.define(subsub, class extends BaseClass {
       static get styles() {
         return css`div {
           border: 4px solid blue;
@@ -768,12 +769,13 @@ suite('Static get styles', () => {
 
   test('elements should inherit `styles` by default', async () => {
     const base = generateElementName();
-    customElements.define(base, class extends LitElement {
+    class BaseClass extends LitElement {
       static styles = css`div {border: 4px solid black;}`;
-    });
+    }
+    customElements.define(base, BaseClass);
 
     const sub = generateElementName();
-    customElements.define(sub, class extends customElements.get(base) {
+    customElements.define(sub, class extends BaseClass {
       render() {
         return htmlWithStyles`<div></div>`;
       }