Unit testing TypeError:无法读取属性'；innerHTML'；空的| Vue Utils-Jest框架| Can'；无法为此运行测试用例

我正在使用Vue utils jest框架来覆盖我的Vue.js。而运行它显示的错误如下。请参考屏幕截图

我的vue代码如下

  <div id="tile" class="tile" data-scale="2.4" @mouseover="cursorEnters" @mouseout="cursorLeaves" @mousemove="cursorMove($event)" :data-image="imageUrl"
  >

mounted() {
   this.initializationImageZoom();
},    
initializationImageZoom() {
  const tile = document.querySelector('#tile');
  tile.innerHTML += '<div id="photo" class="photo"></div>';
  tile.children[0].style.backgroundImage = 'url(' + this.imageUrl + ')';
},

按测试用例呈现vue组件时。显示的错误如下（请参阅屏幕截图）

您可以尝试以下操作：

import { shallowMount } from '@vue/test-utils';

const imageUrl = "https://i.ytimg.com/vi/ETsekJKsr3M/maxresdefault.jpg";

// Creating #tile div

let tile = document.createElement('div')
tile.setAttribute("id", "tile")
let children = document.createElement('div')
tile.appendChild(children)
document.body.appendChild(tile)

let wrapper;
const ImageZoom = require('./ImageZoom.vue').default;

beforeEach(() => {
  wrapper = shallowMount(ImageZoom, {
    propsData: {
      imageUrl,
    }
  });
});

afterEach(() => {
  wrapper.destroy();
});

describe('NoRecords.vue', () => {
  it('should have props (imageUrl) type as Object', () => {
    expect(typeof wrapper.vm.imageUrl).toBe('string');
 });
});

---

我只是在主体中创建了一个div元素，这样jest就不会抛出错误。

@tony19我已经更新了问题和我的vue代码。请参考并帮助我添加您为该函数编写的测试用例？@NipunJain我已经更新了我的测试用例。如果我开始渲染，则会发生此错误。（请参阅屏幕截图），它对我有效。但这不是一个合适的方式。需要解决确切的情况。一些我从你那边得到的想法。不管怎样谢谢你

import { shallowMount } from '@vue/test-utils';

const imageUrl = "https://i.ytimg.com/vi/ETsekJKsr3M/maxresdefault.jpg";

// Creating #tile div

let tile = document.createElement('div')
tile.setAttribute("id", "tile")
let children = document.createElement('div')
tile.appendChild(children)
document.body.appendChild(tile)

let wrapper;
const ImageZoom = require('./ImageZoom.vue').default;

beforeEach(() => {
  wrapper = shallowMount(ImageZoom, {
    propsData: {
      imageUrl,
    }
  });
});

afterEach(() => {
  wrapper.destroy();
});

describe('NoRecords.vue', () => {
  it('should have props (imageUrl) type as Object', () => {
    expect(typeof wrapper.vm.imageUrl).toBe('string');
 });
});