在笑话测试中未定义innerText [英] innerText is undefined in jest test

问题描述

使用笑话进行测试时，我看到属性innerText在未测试时是未定义的，具有正确的值.

When testing using jest I saw that the property innerText is undefined while not in test it has the right value.

  it('get text from div', () => {
    const div = document.createElement('DIV')
    div.innerHTML = '<br>a<br>b<br>c'
    console.log('innerText', div.innerText) // undefined
    console.log('textContent', div.textContent) // 'abc'
    // expect(getTextFromDiv(div).length).toMatchSnapshot()
  })

但是当在玩笑测试中使用相同的代码时，innerText显示:

But when using the same code not in jest test, the innerText shows :

'a

b

c'

，textContent是'abc'.

and textContent is 'abc'.

为什么在笑话中的innerText是未定义的，而当不在笑话中时，其值是真实的?

Why innerText in jest is undefined and when it's not in a jest than the value is real?

这是它起作用的代码(不是开玩笑):

This is the code where it works (not in jest):

const addTextInRichTextToPdf = (doc, text, offsetY) => {
  const div = document.createElement('DIV')
  div.innerHTML = '<br>a<br>b<br>c'
  console.log('innerText', div.innerText) // print the real value
  console.log('textContent', div.textContent) // 'abc'
  ...

推荐答案

如果您使用默认的 testEnvironment ，那么您正在使用jsdom.

If you are using the default testEnvironment, then you are using jsdom.

您可以检查此问题以查看为什么未在jsdom中实现它: https://github.com/tmpvar/jsdom/issues/1245

You can check this issue to see why it is not implemented in jsdom : https://github.com/tmpvar/jsdom/issues/1245

主要问题是innerText依靠布局引擎进行指导，而jsdom没有布局引擎

The primary issue is the fact that innerText leans on the layout engine for guidance, and jsdom has no layout engine

如果您想要完整"的浏览器支持，则可以检查木偶 a>

If you want "full" browser support you can check puppeteer

这篇关于在笑话测试中未定义innerText的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！