Safer query selector (#364)

* Add querySelectorNotNull helper function

* Use querySelectorNotNull

* Updates

* Update settings

* Remove unused

* Update

* Update function calls

* More updates

* Update types

* Remove obsolete code

1 files changed, 19 insertions, 17 deletions

diff --git a/ext/js/pages/settings/anki-templates-controller.js b/ext/js/pages/settings/anki-templates-controller.js
index 89848ef3..03fda9ca 100644
--- a/ext/js/pages/settings/anki-templates-controller.js
+++ b/ext/js/pages/settings/anki-templates-controller.js
@@ -18,6 +18,7 @@
 
 import {ExtensionError} from '../../core/extension-error.js';
 import {AnkiNoteBuilder} from '../../data/anki-note-builder.js';
+import {querySelectorNotNull} from '../../dom/query-selector.js';
 import {JapaneseUtil} from '../../language/sandbox/japanese-util.js';
 import {yomitan} from '../../yomitan.js';
 
@@ -40,14 +41,16 @@ export class AnkiTemplatesController {
         this._cachedDictionaryEntryText = null;
         /** @type {?string} */
         this._defaultFieldTemplates = null;
-        /** @type {?HTMLTextAreaElement} */
-        this._fieldTemplatesTextarea = null;
-        /** @type {?HTMLElement} */
-        this._compileResultInfo = null;
-        /** @type {?HTMLInputElement} */
-        this._renderFieldInput = null;
-        /** @type {?HTMLElement} */
-        this._renderResult = null;
+        /** @type {HTMLTextAreaElement} */
+        this._fieldTemplatesTextarea = querySelectorNotNull(document, '#anki-card-templates-textarea');
+        /** @type {HTMLElement} */
+        this._compileResultInfo = querySelectorNotNull(document, '#anki-card-templates-compile-result');
+        /** @type {HTMLInputElement} */
+        this._renderFieldInput = querySelectorNotNull(document, '#anki-card-templates-test-field-input');
+        /** @type {HTMLInputElement} */
+        this._renderTextInput = querySelectorNotNull(document, '#anki-card-templates-test-text-input');
+        /** @type {HTMLElement} */
+        this._renderResult = querySelectorNotNull(document, '#anki-card-templates-render-result');
         /** @type {?import('./modal.js').Modal} */
         this._fieldTemplateResetModal = null;
         /** @type {AnkiNoteBuilder} */
@@ -58,15 +61,14 @@ export class AnkiTemplatesController {
     async prepare() {
         this._defaultFieldTemplates = await yomitan.api.getDefaultAnkiFieldTemplates();
 
-        this._fieldTemplatesTextarea = /** @type {HTMLTextAreaElement} */ (document.querySelector('#anki-card-templates-textarea'));
-        this._compileResultInfo = /** @type {HTMLElement} */ (document.querySelector('#anki-card-templates-compile-result'));
-        this._renderFieldInput = /** @type {HTMLInputElement} */ (document.querySelector('#anki-card-templates-test-field-input'));
-        this._renderTextInput = /** @type {HTMLInputElement} */ (document.querySelector('#anki-card-templates-test-text-input'));
-        this._renderResult = /** @type {HTMLElement} */ (document.querySelector('#anki-card-templates-render-result'));
-        const menuButton = /** @type {HTMLButtonElement} */ (document.querySelector('#anki-card-templates-test-field-menu-button'));
-        const testRenderButton = /** @type {HTMLButtonElement} */ (document.querySelector('#anki-card-templates-test-render-button'));
-        const resetButton = /** @type {HTMLButtonElement} */ (document.querySelector('#anki-card-templates-reset-button'));
-        const resetConfirmButton = /** @type {HTMLButtonElement} */ (document.querySelector('#anki-card-templates-reset-button-confirm'));
+        /** @type {HTMLButtonElement} */
+        const menuButton = querySelectorNotNull(document, '#anki-card-templates-test-field-menu-button');
+        /** @type {HTMLButtonElement} */
+        const testRenderButton = querySelectorNotNull(document, '#anki-card-templates-test-render-button');
+        /** @type {HTMLButtonElement} */
+        const resetButton = querySelectorNotNull(document, '#anki-card-templates-reset-button');
+        /** @type {HTMLButtonElement} */
+        const resetConfirmButton = querySelectorNotNull(document, '#anki-card-templates-reset-button-confirm');
         this._fieldTemplateResetModal = this._modalController.getModal('anki-card-templates-reset');
 
         this._fieldTemplatesTextarea.addEventListener('change', this._onChanged.bind(this), false);