jest jsdom - dom.window.document.getElementById(X) 成功，但 document.getElementById(X) 失败

Question

这个问题真是令人头疼，Google 和 ChatGPT 都无法解决。

这是一个使用 jsdom 的简单直接的玩笑测试，我在博客和 Github 上见过几十个类似的测试。

1000ms睡眠只是为了证明它不是时序问题。
```
document.documentElement.outerHTML
```
显示 HTML 内容。
```
document
```
是一个有效的
```
Document
```
对象。
```
document.getElementById
```
是一个有效的函数

document.getElementById('loginEmailForm')

由于未知原因返回 null

dom.window.document.getElementById('loginEmailForm')
```
 返回 
```
document.getElementById('loginEmailForm')
之前或之后对
```
HTMLElement{}
```
进行任意次数的呼叫
window.document.getElementById('loginEmailForm')
```
 和 
```
document.getElementById('loginEmailForm')
```
 始终返回 null。
```

我对上述行为没有任何解释，我希望有人以前见过它，或者至少可以重现它。

节点是v22.3.0

jest 是 v29.7.0

jsdom 是 v24.1.0

const { JSDOM } = require('jsdom');

beforeEach(() => {
  jest.resetModules();

  const dom = new JSDOM(`
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <title>test</title>
    </head>
    <body>
      <form id="loginEmailForm">
        <input type="email" id="email">
        <span id="emailError"></span>
        <button type="submit">Submit</button>
      </form>
    </body>
    </html>
  `, { runScripts: "dangerously" });

  global.dom = dom;
  global.window = dom.window;
  global.document = dom.window.document;

  require('../src/login-email.js');
});

describe('Login Email Form', () => {
  test('form and input elements exist', async () => {
    await new Promise(resolve => setTimeout(resolve, 1000));
    console.log("document:", document.documentElement.outerHTML);
    console.log(document);
    console.log(document.getElementById);
    console.log(document.getElementById('loginEmailForm'));
    console.log(dom.window.document.getElementById('loginEmailForm'));

    expect(dom.window.document.getElementById('loginEmailForm')).not.toBeNull();
    expect(dom.window.document.getElementById('email')).not.toBeNull();
    expect(dom.window.document.getElementById('emailError')).not.toBeNull();
  });
});

Answer 1

是的，这是某种nodejs依赖地狱问题，我从一个干净的docker镜像开始，只安装了jest和jsdom，并且测试按预期运行。

jest jsdom - dom.window.document.getElementById(X) 成功，但 document.getElementById(X) 失败

问题描述投票：0回答：1

1个回答

最新问题

jest jsdom - dom.window.document.getElementById(X) 成功，但 document.getElementById(X) 失败

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1