Fix lit-ts template (#1494)

* Fix lit-ts template * Fixing generate Template * Remove bad null check Co-authored-by: Lea Anthony <lea.anthony@gmail.com>
wailsapp · Jun 27, 2022 · b2cec41 · b2cec41
1 parent 66f79c2
commit b2cec41
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 46 deletions.
diff --git a/.../internal/commands/initialise/templates/generate/assets/lit-ts/frontend/src/my-element.ts b/.../internal/commands/initialise/templates/generate/assets/lit-ts/frontend/src/my-element.ts
@@ -68,32 +68,31 @@ export class MyElement extends LitElement {
   }
 
     `
-}
 
-@property()
-resultText = "Please enter your name below 👇"
+    @property()
+    resultText = "Please enter your name below 👇"
 
-greet()
-{
-    let thisName = this.shadowRoot.getElementById('name').value
-    Greet(thisName).then(result => {
-        this.resultText = result
-    });
-}
+    greet() {
+        let thisName = (this.shadowRoot.getElementById('name') as HTMLInputElement)?.value;
+        if (thisName) {
+            Greet(thisName).then(result => {
+                this.resultText = result
+            });
+        }
+    }
 
-render()
-{
-    return html`
-        <main>
-            <img id="logo" src=${logo} alt="Wails logo">
-            <div class="result" id="result">${this.resultText}</div>
-            <div class="input-box" id="input">
-                <input class="input" id="name" type="text" autocomplete="off"/>
-                <button @click=${this.greet} class="btn">Greet</button>
-            </div>
-        </main>
-    `
-}
+    render() {
+        return html`
+            <main>
+                <img id="logo" src=${logo} alt="Wails logo">
+                <div class="result" id="result">${this.resultText}</div>
+                <div class="input-box" id="input">
+                    <input class="input" id="name" type="text" autocomplete="off"/>
+                    <button @click=${this.greet} class="btn">Greet</button>
+                </div>
+            </main>
+        `
+    }
 }
 
 declare global {

diff --git a/.../wails/internal/commands/initialise/templates/templates/lit-ts/frontend/src/my-element.ts b/.../wails/internal/commands/initialise/templates/templates/lit-ts/frontend/src/my-element.ts
@@ -68,32 +68,31 @@ export class MyElement extends LitElement {
   }
 
     `
-}
 
-@property()
-resultText = "Please enter your name below 👇"
+    @property()
+    resultText = "Please enter your name below 👇"
 
-greet()
-{
-    let thisName = this.shadowRoot.getElementById('name').value
-    Greet(thisName).then(result => {
-        this.resultText = result
-    });
-}
+    greet() {
+        let thisName = (this.shadowRoot.getElementById('name') as HTMLInputElement)?.value;
+        if (thisName) {
+            Greet(thisName).then(result => {
+                this.resultText = result
+            });
+        }
+    }
 
-render()
-{
-    return html`
-        <main>
-            <img id="logo" src=${logo} alt="Wails logo">
-            <div class="result" id="result">${this.resultText}</div>
-            <div class="input-box" id="input">
-                <input class="input" id="name" type="text" autocomplete="off"/>
-                <button @click=${this.greet} class="btn">Greet</button>
-            </div>
-        </main>
-    `
-}
+    render() {
+        return html`
+            <main>
+                <img id="logo" src=${logo} alt="Wails logo">
+                <div class="result" id="result">${this.resultText}</div>
+                <div class="input-box" id="input">
+                    <input class="input" id="name" type="text" autocomplete="off"/>
+                    <button @click=${this.greet} class="btn">Greet</button>
+                </div>
+            </main>
+        `
+    }
 }
 
 declare global {