打字稿扩展类未按预期工作

Question

我正在尝试通过两种方法扩展我的 HTMLButtonElement 接口。具体我想修改元素类列表。

class BSHTMLButtonElement extends HTMLButtonElement {
    removeOutline(): void { this.classList.remove(...COLOR_LIST.map(i => `btn-outline-${i}`)); }
    setOutline(color: string): void { this.removeOutline(); this.classList.add(`btn-outline-${color}`); }
}

const tbxusername = document.getElementById("tbxusername") as BSHTMLInputElement;
tbxusername.setOutline("danger");

然后它编译得很好，我得到一个这样的运行时错误：

tbxusername.setOutline is not a function

有没有比我正在尝试的更好的方法来扩展 HTMLElement 的功能？我做错了什么？