用Jest，AudioContext进行测试和模拟
我在尝试使用AudioContext的类上做一些测试时遇到了很多困难。我相信，我的很多挫折都源于对模拟函数以及测试的执行方式缺乏很好的理解。
我试图测试一个接受AudioContext的类，但是当我运行一个测试时，我仍然会得到这个错误：
当使用TypeScript文件时：TypeError：(window.AudioContext欧元/ window.webkitAudioContext)不是构造函数
此错误发生在app.ts文件中。当我运行一个测试时，它是否必须解析或执行它的所有依赖项？
使用JavaScript文件时，测试文件中会出现此错误：ReferenceError: AudioContext未定义
现在，我想我必须要做一个模拟AudioContext。我怎么知道AudioContext上的所有方法才能开始手动模拟呢？
这是我床单的简化版。我将提供两个版本的TS和JS：
TypeScript文件版本：
// app.ts
import Sampler from './Sampler';
const audioContext: AudioContext = new (window.AudioContext || window.webkitAudioContext)();
const sampler: Sampler = new Sampler(audioContext);
// Sampler.ts
export default class Sampler{
private audioContext: AudioContext;
constructor(audioContext: AudioContext){
this.audioContext = audioContext;
}
}JS文件版本：
// app.js
const Sampler = require('./Sampler');
const audioContext = new (window.AudioContext || window.webkitAudioContext)();
const sampler = new Sampler(audioContext);
// Sampler.js
class Sampler{
constructor(audioContext){
this.audioContext = audioContext;
}
}
module.exports = Sampler;以粗体显示前面提到的错误的测试文件：
// sampler.test.ts
import Sampler from './Sampler';
// Uncomment line below if you're using plain JS and not TS
// const Sampler = require('./Sampler');
test('Test test', () => {
const audioContext = new AudioContext();
const s = new Sampler(audioContext);
})更新：--我现在有了处理普通JS文件的代码。我在测试中添加了一个空的AudioContext模拟。
// sampler.test.js
const Sampler = require('./Sampler');
require('./__mocks__/app');
test('Testing Mock AudioContext', () => {
const audioContext = new AudioContext();
const s = new Sampler(audioContext);
})
// __mocks__/app.js
window.AudioContext = jest.fn().mockImplementation(() => {
return {}
});由于我的项目是用TypeScript编写的，所以我尝试将模拟添加到我的项目中，但是我仍然从上面的"TypeError：(window.AudioContext \\ window.webkitAudioContext)不是构造函数“中得到错误。
谢谢:)。
回答 2
Stack Overflow用户
发布于 2021-01-14 14:59:12
老帖子，但我想我会分享我如何处理打字错误。为了保持类型记录和类型的优势，我只是将webkitAudioContext添加到定义的Window类型中。我的代码看起来是：
declare var window: {
webkitAudioContext: typeof AudioContext;
} & Window & typeof globalThis;
const audioContext = new (window.AudioContext || window.webkitAudioContext)();这实际上告诉类型记录到具有新的Window & typeof globalThis属性的union webkitAudioContext。
就ReferenceError: AudioContext没有定义错误而言，这很可能是因为AudioContext没有被嘲笑(正如您所说的，当我偶然发现您的帖子时，- this也是我正在寻找的问题)。我知道小丑会用jsdom来嘲弄这个王国。jsdom目前不支持AudioContext模拟
Stack Overflow用户
发布于 2019-04-10 22:47:03
您可以通过将窗口指定为"any“类型来解决这个问题。
const audioContext: AudioContext =
new (AudioContext || (window as any).webkitAudioContext)();正如人们所描述的，这里。
请注意，我不认为您需要通过代码中的窗口访问AudioContext，因为这应该是可用的。
https://stackoverflow.com/questions/55616119
复制相似问题
腾讯云开发者
