涉及 DOM 时在 Deno 中断中进行前端单元测试。TS2304 [错误]： 找不到名称"HTMLElement"

Question

我是Typescript和Deno的新手(主要是JS和Python中的代码(，我正在尝试用Deno编写前端typecscipt。我试着用我在这部艺术作品中看到的构图风格。我的一个接口中有一个HTMLElement类型，如下所示：

export default interface HasElement {
readonly element: HTMLElement;
}

实现该接口的类进行编译，我可以在浏览器中运行生成的代码，但如果我尝试使用deno test运行任何单元测试，我会得到一个错误error: TS2304 [ERROR]: Cannot find name 'HTMLElement'

我听说DOM并没有完全在Deno中实现，所以我想我可能需要依靠mocking或依赖项注入来测试任何使用该接口的代码。

我知道大多数涉及DOM的测试都应该使用Selenium之类的端到端测试来完成，但我的一些前端单元测试似乎不可避免地会遇到Deno中不存在HTMLElements的问题。

有人有这个问题的经验吗？我应该研究什么样的解决方案？

编辑：这是我的tsconfig.json.

{
"compilerOptions": {
"lib": [ "dom", "deno.ns" ]
}
}

以下是失败的测试：(我发现了这个deno-dom-wasm库，但我不确定它是否适用于我想要做的事情。(

import {
DOMParser,
Element,
} from "https://deno.land/x/deno_dom/deno-dom-wasm.ts";
import FakeBase from "./components/FakeBase/FakeBase.ts";
import LoginOrganism from "./organisms/LoginOrganism/LoginOrganism.ts";
import App from "./App.ts";
Deno.test({
name: "test App attaches to app div",
fn: async () => {
const html = await Deno.readTextFile("./src/index.html");
const doc = new DOMParser().parseFromString(
html,
"text/html",
)!;
const appDiv = doc.getElementById("App") as Element;
const fakeBase = new FakeBase(appDiv);
const app = new App(fakeBase);
const appElement = app.base.element;
assertEquals(appDiv, appElement);
},
});
Deno.test({
name: "test Apps first child is LoginOrganism",
fn: async () => {
const html = await Deno.readTextFile("./src/index.html");
const doc = new DOMParser().parseFromString(
html,
"text/html",
)!;
const appDiv = doc.getElementById("App") as Element;
const fakeBase = new FakeBase(appDiv);
const app = new App(fakeBase);
const first_child = app.children[0] as LoginOrganism;
assert(
first_child instanceof LoginOrganism,
`FIRST CHILD IS ${typeof first_child}`,
);
},
});

Answer 1

tsconfig.json中有DOMlib吗？Deno没有实现DOM，因此类型需要TypeScriptlib。

tsconfig.json

部分TypeScript配置片段：

{
// [Existing config ...]
"compilerOptions": {
"lib": [
"dom"
]
}
}

Answer 2

根据您下面的回答，我可以看到您有一个tsconfig.json，但您没有使用它。请确保您告诉deno选择带有--config标志的配置

也就是说，Deno确实支持使用TypeScript配置文件，尽管与Deno的其他部分一样，检测和使用配置文件并不是自动的。要将TypeScript配置文件与Deno一起使用，您必须在命令行上提供一个路径

deno run--config/tsconfig.json main.ts

https://deno.land/manual/typescript/configuration