Javascript 文档元素的模拟对象

我有下一个测试代码：

it("Test", function() {
    loadResources();

    expect(document.getElementById('MyElement').innerHTML).toBe("my string");
});

函数体加载资源（）：

document.getElementById('MyElement').innerHTML = "my string";

我的测试失败，并显示以下消息：

TypeError:无法将属性“innerHTML”设置为null

---

看起来我需要为innerHTML创建模拟对象。我该怎么做呢？

我认为您应该模拟

getElementById

来返回一个伪HtmleElement

JASMINE V1.3或更低版本

var dummyElement = document.createElement('div');
document.getElementById = jasmine.createSpy('HTML Element').andReturn(dummyElement);

JASMINE V2.0+

var dummyElement = document.createElement('div');
document.getElementById = jasmine.createSpy('HTML Element').and.returnValue(dummyElement);

现在，对于

document.getElementById

的每次调用，它都将返回伪元素。它将设置虚拟元素的innerHTML，并最终将其与预期结果进行比较

编辑：我想你应该用

toEqual

替换

toBe

toBe

可能会失败，因为它将测试对象标识而不是值相等

EDIT2（关于多个ID）：我不确定，但你可以称为假ID。它将为每个ID创建一个新的HTML元素（如果它还不存在），并将其存储在一个对象文本中以供将来使用（即使用相同ID调用

getElementById

）

JASMINE V1.3或更低版本

var dummyElement = document.createElement('div');
document.getElementById = jasmine.createSpy('HTML Element').andReturn(dummyElement);

var-HTMLElements={}；
document.getElementById=jasmine.createSpy（'HTML元素'）。和callFake（函数（ID）{
如果（！HTMLElements[ID]）{
var newElement=document.createElement（'div'）；
HTMLElements[ID]=新元素；
}
返回HTMLElements[ID]；
});

JASMINE V2.0+

var dummyElement = document.createElement('div');
document.getElementById = jasmine.createSpy('HTML Element').and.returnValue(dummyElement);

var-HTMLElements={}；
document.getElementById=jasmine.createSpy（'HTML元素'）。和.callFake（函数（ID）{
如果（！HTMLElements[ID]）{
var newElement=document.createElement（'div'）；
HTMLElements[ID]=新元素；
}
返回HTMLElements[ID]；
});

按id设置文档正文和getElement。我使用的是jest，效果很好。 看看这个

test（'Toggle innerHtml of a element'，（）=>{
document.body.innerHTML=
'' +
“你好”+
'  ' +
'';
var el=document.getElementById（'username'）；
var newText='新的内部文本'；
el.innerText=新文本；
expect（el.innerText）.toEqual（newText）；
});

试试这个：

it('should blah', () => {
  const elementMock = {
    innerHTML: 'my string'
  };    

  loadResources();

  jasmine.spyOn(document, 'getElementById').and.returnValue(elementMock);

  expect(document.getElementById('MyElement').innerHTML).toBe('my string');
});

---

如果我有两个身份证怎么办？document.getElementById（'MyElement1'）.innerHTML=“我的字符串”；document.getElementById（'MyElement2'）.innerHTML=“我的字符串”；我需要检查一下这些身份证？谢谢你的回答。注意，这个答案使用了jasmine 1.3语法。jasmine 2.0（以及之后的版本）是不同的。例如：jasmine.createSpy（'HTML元素'）。和.returnValue（dummeyelement）@devnull69您能否澄清一下，示例中的“HTML元素”应该是通常传递给文档的ID。getElementById？不，

ID

就是您所说的ID，

HTML元素

只是间谍的字符串名